In this module we get a quick introduction to front-end JavaScript frameworks and libraries, followed by an introduction to React. We will also learn about React components and JSX.
Welcome to Front-End Web Development with React
How to Use the Learning Resources
What is Full-Stack Web Development
Exercise: Setting up Git
Exercise: Basic Git Commands
Exercise: Online Git Repositories
Node.js and NP
Exercise: Setting up Node.js and NP
Exercise: Basics of Node.js and NPM
Front-end JavaScript Frameworks and Libraries Overview
Introduction to Reac
Exercise: Getting Started with Reac
React App Overview
Introduction to JS
Exercise: Configuring your React Applicatio
React Component
Exercise: React Components Part 1
React Components: State and Prop
Exercise: React Components Part 2
React Components: Lifecycle Methods Part 1
Assignment 1 Requirements: React Component
React Router and Single Page Applications
In this week, you will learn about various component types. You will learn about React router and its use in designing single page applications. You will also learn about single page applications and use React Router to design single page applications.
Presentational and Container Components
Exercise : Presentational and Container Components
React Components: Lifecycle Methods Part
Functional Components
Exercise : Functional Components
React Virtual DOM
Exercise : Header and Footer
React Router
Exercise : React Router
Single Page Applications
Exercise : Single Page Applications Part
React Router: Parameter
Exercise : Single Page Applications Part 2
Assignment 2: React Router and Single Page Applications
React Forms, Flow Architecture and Introduction to Redux
In this module you will be introduced to uncontrolled and controlled forms and briefly examine form validation in React applications. You will get an overview of the Flux architecture and introduced to Redux as a way of realizing the flux architecture
Controlled Forms
Exercise : Controlled Forms
Exercise : Controlled Form Validation
Uncontrolled Components
Exercise : Uncontrolled Forms
The Model-View-Controller Framework
The Flux Architecture
Introduction to Redux2
Exercise : Introduction to Redux
React Redux Forms
Exercise : React Redux Form
Exercise : React Redux Form Validation
Assignment 3: React Forms and Redux
More Redux and Client-Server Communication
In this module you will explore Redux further including Redux action, combining reducers, and Redux thunk, client-server communication using Fetch and the REST API. You will get a brief introduction to animation in React. You will also learn about testing, building and deploying React applications.
Redux Actions
Exercise : Combining Reducers
Exercise : Redux Actions
Redux Thunk
Exercise : Redux Thunk
Exercise : React-Redux-Form Revisited
Networking Essentials
Brief Representational State Transfer (REST)
Exercise : Setting up a Server using json-server
Promises
Fetch
Exercise : Fetch from Server
Exercise : Fetch Handling Errors
Exercise : Fetch Post Comment
React Animations
Exercise : React Animations
Exercise : React Animation Components
Assignment 4: Redux, Client-Server Communication and Fetch
Introduction to Webpack
Exercise : Building and Deploying the React Application
