Front End & Fullstack - React 16.8 +
4.7 (6 ratings)
Course Ratings are calculated from individual students’ ratings and a variety of other signals, like age of rating and reliability, to ensure that they reflect course quality fairly and accurately.
114 students enrolled

Front End & Fullstack - React 16.8 +

Full course for beginners to learn Full Stack React, MERN, Redux, Node.js, React Router 4, Networking
4.7 (6 ratings)
Course Ratings are calculated from individual students’ ratings and a variety of other signals, like age of rating and reliability, to ensure that they reflect course quality fairly and accurately.
114 students enrolled
Created by Sandra L
Last updated 10/2019
English
English [Auto-generated]
Current price: $132.99 Original price: $189.99 Discount: 30% off
5 hours left at this price!
30-Day Money-Back Guarantee
This course includes
  • 13 hours on-demand video
  • 21 articles
  • 22 downloadable resources
  • Full lifetime access
  • Access on mobile and TV
  • Certificate of Completion
Training 5 or more people?

Get your team access to 4,000+ top Udemy courses anytime, anywhere.

Try Udemy for Business
What you'll learn
  • Anyone who wants to get better at JavaScript and Frontend developpment
  • Developers who wish to grow and sharpen their javascript skills
Course content
Expand all 140 lectures 13:06:37
+ Try React Online !
8 lectures 52:36
Stateful complexe component
08:03
Lifecycle & Props
04:00
Component-based application 1/3
10:41
Component-based application 2/3
10:15
Component-based application 3/3
01:23
Introducing JSX
05:01
+ Tools, Installation & Set up
9 lectures 30:22
Getting Started : Technical Requirements
00:55
The Tools & environment
05:58
Node.js & Npm
02:00
Visual Code Studio
00:27
Chrome Extensions
02:56
React CLI
03:23
Zero-configuration Set up
04:19
create-react-app - Hello React
07:12
"Hello React"
03:12
+ Learn React : Fundamentals & Starter Projects
11 lectures 48:22
Prerequisites
00:02
Project Files
00:01
React Create App - CLI
05:40
Intro to React : "Bonjour World"
00:42
React Components : from stateless to stateful
05:49
Initialize & Maintain State
06:02
Handle Events : onMouseover, onClick (event-handling)
09:09
List & Keys
15:23
[Exercise] - Display a list
05:22
The React Tree (Chrome Inspector Tool)
00:11
Downloadable Files
00:01
+ [WORKSHOP] - Countdown
12 lectures 01:20:27
Project Set up
04:35
Build the UI
08:07
Styling the UI
04:23
Countdown Interval
10:11
Time Difference calculation 1/2
12:14
Time Difference Calculation 2/2
01:31
Maintain State
06:44
DatePicker
13:12
Add Styling
09:51
Countdown - Date picker (select date)
05:12
Final Steps
04:07
+ Learn React : Further Topics
14 lectures 01:17:17
New Project to learn the fundamentals 1/3
08:50
Project Files
00:01
New Project to learn the fundamentals 2/3
08:49
New Project to learn the fundamentals 3/3
06:10
List & keys
05:22
Ternary Operator
05:42
High order function : map()
04:15
functions : delete, markComplete
08:37
Code Splitting 1/2
06:33
Code Splitting 2/2
07:57
Spread Operator ...
05:41
Reusable Item
02:47
Conditional Rendering
06:32
Final Project to download
00:01
+ [Workshop] - Time management & Data Persistence
14 lectures 01:25:43
Presentation
07:27
Starter Project
00:12
Conditional UI rendering
07:35
User Interaction
08:54
manage immutable state
01:18
render items
04:10
JS objects
04:57
Iterating and Rendering with map()
07:21
Iterating and Filtering with filter()
05:51
Adding a Progress Bar
13:55
Form Validation
01:28
HTML5 LocalStorage
08:32
Breaking the UI up
14:02
Downloadable Files
00:01
+ Networking- Internet Data Fetching & APIs
10 lectures 40:02
Intro to Networking
02:58
Starter Project & assets
02:27
The Breaking Bad API
05:54
Chrome Extension : JSON View
00:53
Learn Fetch()
06:40
Making Asynchronous HTTP Request & Promise
04:21
Refresh Font Awesome
03:28
Flat UI Colors, Styling
04:39
Finishing
08:41
Downloadable Files
00:01
+ Build a React.js Weather App
16 lectures 02:07:30
What will be building ?
00:07
OWM website
02:38
OWM API Key
01:34
OWM Documentation
08:35
Create a weather app
10:32
Networking with fetch()
09:02
Parsing response
15:00
Bootstrap CSS
11:17
Dashboard Component
11:17
Dashboard Component - adding styling
12:07
Country flags API
05:16
Date & Time
16:09
Alert Dialog
12:40
refactorisation - immutable state
03:42
Persisting with HTML5 Localstorage
07:32
Downloadable Files
00:01
+ Introducing React Redux
11 lectures 01:13:02
The Redux Design Pattern
07:49
Starter Project
00:01
React redux install dependency
05:02
Creating Actions
07:58
Designing a Reducer
15:42
Setting up the Store
12:47
Presentational vs container components
03:26
Container Components
10:44
Hook-up React App to Redux (mapStateToProps)
08:54
mapDispatchToProps
00:38
Downloadable Files
00:01
Requirements
  • HMTL, CSS & JS
  • Node & NPM
Description

React provides the perfect solution for creating JavaScript-based interfaces, with a huge range of uses for it including building native mobile apps and web apps.

This class will teach you to build dynamic website components and real-time applications with React.js.

React is a Javascript library, developed in 2013 by Jordan Walke of Facebook. You’ll find React is both very popular (it’s the 5th most starred JS library on GitHub) and used on major sites including on Facebook, Netflix, and Khan Academy.

You’ll love the flexibility of using React with your favorite web technologies (except for jQuery!), and this path will take you from the fundamentals all the way up to building full apps with custom styling. With this class, learn the A-Z of React :

  • the basics and fundamentals with snack-bite size video lessons. From simple to complex, tutorials and exercises will help you get up to speed fast with the main concepts of web development with react.js

  • Understanding React Components (stateless and stateful components)

  • writing and displaying data with JSX

  • Networking with asynchronous HTTP requests & RESTFul APIs

  • Maintain your Application's State

  • Passing dynamic data with props objects

  • Component lifecycle (componentDidMount, componentDidUpdate)

  • Communication between components

  • Events and event binding

  • Working with State and HTML5 LocalStorage

  • Creating maintainable code with JavaScript Modules

  • Data Persistence with Redux

  • Routing with React Router 4

  • Taking advantage of new ES6 Features

  • The React Hooks (useState, useEffect)

  • + So much more

What we will be building together?

  • A real-time and single page application - Countdown Timer - stating how many days, hours and minutes are left until this awesome event you look forward to.

  • The classic Todo List example to get up to speed with the basics and main concepts in a short amount of time

  • An interactive - checklist - developed with the Bootstrap Library, Font Awesome icons & HTML5 Localstorage

  • A front to back example with MERN (MongoDB, Express.js, React.js & Node.js)

  • a weather widget with the Restful API openweathermap(dot)org

  • + So much more

Who is this class for?

  • Anyone willing to learn and build solid frontend skills

  • Developers who wish to grow and sharpen their javascript skills

Who this course is for:
  • for beginners