Udemy is one of my favorite online platform for learning resources. It contains thousands of courses from professionals, experts in a variety of technology topics, from fundamentals to the very specifics of a framework of a development tool. You can use it as the first step on the path to learn something new or specialize in the field of your choice.
As I've been using Udemy as one of my primary resources for learning React and the related projects in its ecosystem, I wanted to give you my personal list of recommended courses for learning front-end development with React.
But let's begin by defining what are the things we need to learn from React and its satellite libraries.
- Reactjs: Of course, the next thing to master is the basics of React, like JSX, virtual DOM and the lifecycle hooks of React apps.
- Application State: Something to get in the skillset belt if we want to create more complex and scalable applications, the most popular library for managing state in React, as we'll see is Redux.
- Web Service consumer: An essential component of every front-end framework, a good popular choice is Axios or Fetch.
- Test Driven Development: After we learn the basics and feel ready for the next step, there's a necessity to learn how to make our app robust using TDD. A widely used approach for this is using Jest and Enzyme.
- Client-side routing: An essential library for React: react-router, used in Web apps and Native mobile apps as well.
- Mobile Development: Done with native components for Android and iOS thanks to the React Native project.
ES6 and Webpack
With this course you'll learn:
- Execution Contexts and Lexical Environments: Functions, Contexts, variables, scopes, ES6 syntax, and others.
- Types and Operators: Primitive types and operators.
- Objects and Functions: Objects literals, Functions as Objects, Functions Statements and Functions Expressions, Closures, Callbacks, IFFEs, Functional Programming and others.
- Building Objects: Function Constructors and Prototypes.
The course includes:
- The 'forEach' Helper
- The 'map' Helper
- The 'filter' Helper
- The 'find' Helper
- The 'every' and 'some' Helper
- The 'reduce' Helper
- Template Strings
- Arrow Functions
React with Redux
Moving to the endeavor of managing app´s state. One of the most used libraries in React is Redux (in usage with React-Redux). Here I recommend another course from Stephen Grider: Modern React with Redux
Stephen takes us from the basics of React, starting with the setup of a new project, passing through JSX, the library API, classes and component definitions.
After covering the basics, the course is divided into the following main sections:
- Ajax Requests with React: Focused on the use of React Components with Axios for consuming web services.
- Managing App State with Redux: This section is dedicated completely to redux, how it works and how to integrate it with React.
- Intermediate Redux: Middleware: Middleware is the component of redux which deals with the asynchronous nature of web API requests. React and Redux offers a simple but elegant solution to this common task.
- React Router + Redux Form: Finally, the course presents a couple of popular and powerful libraries, the first is for handling user requests using forms. A task that proves to be not trivial in other frameworks, redux-form makes it much more easily make then right. The second is react-router, without any doubt, the best library for implementing a client side router, with all the features and flexibility you might expect.
React - Test Driven Development
I found this course in the spirit of filling a gap in unit testing knowledge when working with React projects. But I was amazed how the author, David, covered all the fundamentals of TDD and how they should be used in React Development using Jest and Enzyme, and he does it in only 4,5 hours. I refer, of course to React - Mastering Test and Behavior Driven Development.
The course is made by showing the process of creating two applications while using TDD from the very first step. Some of the concepts it explains include:
- Set up a project to use Jest with Unit Tests.
- Behavior Driven Development, simulating user events with Enzyme.
- How to test Redux, including Actions and Reducers.
- How to test APIs and Middleware using Redux Thunk.
Last, but not least, we can also do mobile development with React. That's when React Native becomes handy. This library has a different approach to its main competitor (Ionic/Cordova or Phone Gap).
The contents lists as follows:
- Getting started with the basics
- Using Redux with React Native
- Debugging React Native Apps
- Liking and Using Third-Party Libraries
- Navigation in React Native Apps
- Styling and Animating React Native Apps
- Handling User Input
- Using Native Device Features: Maps, Camera & Image Gallery
- Networking - Sending Http Requests
- Authentication in React Native Apps
Keep looking for new Resources
Udemy is one of the most popular e-learning sites where you can find thousands of excellent courses, thought by brilliant professionals and available at a really affordable price. But it's not the only one, you can find many many other resources for learning React and other technologies on the web (to name a few, PluralSight, Lynda, Coursera). We're living in an age where information is more accessible than in any other time in history, it depends only on us to take the maximum advantage of it.
Thank you so much for reading this post. Take care and talk to you again with more Full-Stack development topics. Cheers!.