Introduction to React-Welcome to Front-End Web Development with React
Welcome to Front-End Web Development with React
()
How to Use the Learning Resources
()
Welcome to Front-End Web Development with React: Additional Resources
Introduction to React-Full-Stack Web Development: The Big Picture
Full-Stack Web Development: The Big Picture: Objectives and Outcomes
What is Full-Stack Web Development?
()
Full Stack Web Development: Additional Resources
Introduction to React-Setting up your Development Environment: Git and Node
Setting up Your Development Environment: Git and Node: Objectives and Outcomes
Setting up your Development Environment
Exercise (Video): Setting up Git
()
Exercise (Instructions): Setting up Git
Exercise (Video): Basic Git Commands
()
Exercise (Instructions): Basic Git Commands
Exercise (Video): Online Git Repositories
()
Exercise (Instructions): Online Git Repositories
Node.js and NPM
()
Exercise (Video): Setting up Node.js and NPM
()
Exercise (Instructions): Setting up Node.js and NPM
Exercise (Video): Basics of Node.js and NPM
()
Exercise (Instructions): Basics of Node.js and NPM
Setting up your Development Environment: Git and Node: Additional Resources
Introduction to React-Introduction to React
Introduction to React: Objectives and Outcomes
Front-end JavaScript Frameworks and Libraries Overview
()
Introduction to React
()
Exercise (Video): Getting Started with React
()
Exercise (Instructions): Getting Started with React
React App Overview
()
Introduction to JSX
()
Exercise (Video): Configuring your React Application
()
Exercise (Instructions): Configuring your React Application
Introduction to React: Additional Resources
Introduction to React-React Components
React Components: Objectives and Outcomes
React Components
()
Exercise (Video): React Components Part 1
()
Exercise (Instructions): React Components Part 1
React Components: State and Props
()
Exercise (Video): React Components Part 2
()
Exercise (Instructions): React Components Part 2
React Components: Lifecycle Methods Part 1
()
React Components: Additional Resources
Introduction to React-Assignment 1: React Components
Assignment 1 Requirements (Video): React Components
()
Assignment 1: React Components: Additional Resources
Introduction to React-Ideation
Ideation: Objectives and Outcomes
Ideation Report Template
Ideation: Additional Resources
React Router and Single Page Applications-React Component Types
React Component Types: Objectives and Outcomes
Presentational and Container Components
()
Exercise (Video): Presentational and Container Components
()
Exercise (Instructions): Presentational and Container Components
React Components: Lifecycle Methods Part 2
()
Functional Components
()
Exercise (Video): Functional Components
()
Exercise (Instructions): Functional Components
React Component Types: Additional Resources
React Router and Single Page Applications-React Router
React Router: Objectives and Outcomes
React Virtual DOM
()
Exercise (Video): Header and Footer
()
Exercise (Instructions): Header and Footer
React Router
()
Exercise (Video): React Router
()
Exercise (Instructions): React Router
React Router: Additional Resources
React Router and Single Page Applications-Single Page Applications
Single Page Applications: Objectives and Outcomes
Single Page Applications
()
Exercise (Video): Single Page Applications Part 1
()
Exercise (Instructions): Single Page Applications Part 1
React Router: Parameters
()
Exercise (Video): Single Page Applications Part 2
()
Exercise (Instructions): Single Page Applications Part 2
Single Page Applications: Additional Resources
React Router and Single Page Applications-Assignment 2: React Router and Single Page Applications
Assignment 2: React Router and Single Page Applications
()
Assignment 2: React Router and Single Page Applications: Additional Resources
React Router and Single Page Applications-UI Design and Prototyping
UI Design and Prototyping: Objectives and Outcomes
UI Design and Prototyping Report Template
UI Design and Prototyping: Additional Resources
React Forms, Flow Architecture and Introduction to Redux-Controlled Forms
Controlled Forms: Objectives and Oute
Controlled Forms
()
Exercise (Video): Controlled Forms
()
Exercise (Instructions): Controlled Forms
Exercise (Video): Controlled Form Validation
()
Exercise (Instructions): Controlled Form Validation
Controlled Forms: Additional Resources
React Forms, Flow Architecture and Introduction to Redux-Uncontrolled Forms
Uncontrolled Forms: Objectives and Outcomes
Uncontrolled Components
()
Exercise (Video): Uncontrolled Forms
()
Exercise (Instructions): Uncontrolled Forms
Uncontrolled Forms: Additional Resources
React Forms, Flow Architecture and Introduction to Redux-Introduction to Redux
Introduction to Redux: Objectives and Outcomes
The Model-View-Controller Framework
()
The Flux Architecture
()
Introduction to Redux
()
Exercise (Video): Introduction to Redux
()
Exercise (Instructions): Introduction to Redux
Introduction to Redux: Additional Resources
React Forms, Flow Architecture and Introduction to Redux-React Redux Form
React Redux Form: Objectives and Outcomes
React Redux Forms
()
Exercise (Video): React Redux Form
()
Exercise (Instructions): React Redux Form
Exercise (Video): React Redux Form Validation
()
Exercise (Instructions): React Redux Form Validation
React Redux Form: Additional Resources
React Forms, Flow Architecture and Introduction to Redux-Assignment 3: React Forms and Redux
Assignment 3: React Forms and Redux
()
Assignment 3: React Forms and Redux: Additional Resources
More Redux and Client-Server Communication-Redux Actions
Redux Actions: Objectives and Outcomes
Redux Actions
()
Exercise (Video): Combining Reducers
()
Exercise (Instructions): Combining Reducers
Exercise (Video): Redux Actions
()
Exercise (Instructions): Redux Actions
Redux Actions: Additional Resources
More Redux and Client-Server Communication-Redux Thunk
Redux Thunk: Objectives and Outcomes
Redux Thunk
()
Exercise (Video): Redux Thunk
()
Exercise (Instructions): Redux Thunk
Exercise (Video): React-Redux-Form Revisited
()
Exercise (Instructions): React-Redux-Form Revisited
Redux Thunk: Additional Resources
More Redux and Client-Server Communication-Client-Server Communication
Client-Server Communication: Objectives and Outcomes
Networking Essentials
()
Brief Representational State Transfer (REST)
()
Exercise (Video): Setting up a Server using json-server
()
Exercise (Instructions): Setting up a Server using json-server
Client-Server Communication: Additional Resources
More Redux and Client-Server Communication-Fetch
Fetch: Objectives and Outcomes
Promises
()
Fetch
()
Exercise (Video): Fetch from Server
()
Exercise (Instructions): Fetch from Server
Exercise (Video): Fetch Handling Errors
()
Exercise (Instructions): Fetch Handling Errors
Exercise (Video): Fetch Post Comment
()
Exercise (Instructions): Fetch Post Comment
Fetch: Additional Resources
More Redux and Client-Server Communication-React Animations
React Animations: Objectives and Outcomes
React Animations
()
Exercise (Video): React Animations
()
Exercise (Instructions): React Animations
Exercise (Video): React Animation Components
()
Exercise (Instructions): React Animation Components
React Animations: Additional Resources
More Redux and Client-Server Communication-Assignment 4: Redux, Client-Server Communication and Fetch
Assignment 4: Redux, Client-Server Communication and Fetch
()
Assignment 4: Redux, Client-Server Communication and Fetch: Additional Resources
More Redux and Client-Server Communication-Building and Deployment
Building and Deployment: Objectives and Outcomes
Introduction to Webpack
()
Exercise (Video): Building and Deploying the React Application
()
Exercise (Instructions): Building and Deploying the React Application
Building and Deployment: Additional Resources
More Redux and Client-Server Communication-Project Implementation
Project Implementation: Objectives and Outcomes
Final Report Template