Complete React Course for Creating Amazing UI

Complete React Course for Creating Amazing UI, available at $19.99, has an average rating of 3.8, with 65 lectures, based on 66 reviews, and has 382 subscribers.

You will learn about Create Functional React Applications Create Beautiful UI Fetch Real-World Data by Calling RESTful APIs Create Chrome Extensions This course is ideal for individuals who are Beginner Web Developers or UI Designers It is particularly useful for Beginner Web Developers or UI Designers.

Enroll now: Complete React Course for Creating Amazing UI

Summary

Title: Complete React Course for Creating Amazing UI

Price: $19.99

Average Rating: 3.8

Number of Lectures: 65

Number of Published Lectures: 65

Number of Curriculum Items: 65

Number of Published Curriculum Objects: 65

Original Price: $89.99

Quality Status: approved

Status: Live

What You Will Learn

Create Functional React Applications
Create Beautiful UI
Fetch Real-World Data by Calling RESTful APIs
Create Chrome Extensions

Who Should Attend

Beginner Web Developers
UI Designers

Target Audiences

Beginner Web Developers
UI Designers

UI is often omitted in coding courses, yet it is so crustal to a product’s success. That’s why this course places equal emphasis on building functional web applications with beautiful UI in React.

The course is divided into 2 parts. In the first part, we will start from the basics of React, such as JSX, creating React Components, passing React props, using React state, making React forms, React lifecycle functions and React Router.

In the second part, we will build two final projects: a Todo Chrome Extension and a custom GitHub Dashboard. Not only are you going to apply your knowledge from the first part, you’ll also learn along besides React – such as using the Axios library for calling RESTful APIs, using UI libraries such as Material UI and Ant Design to style your web apps, and using localStorage to store your data in your browser.

I can’t wait to see you in the first lecture!

Course Curriculum

Chapter 1: Welcome!

Lecture 1: Introduction

Chapter 2: JSX

Lecture 1: Welcome to Section 2

Lecture 2: Codepen Setup

Lecture 3: What is JSX?

Lecture 4: Adding Attributes to JSX

Lecture 5: Nested Elements in JSX

Lecture 6: JSX Summary

Chapter 3: React Components

Lecture 1: Welcome to Section 3

Lecture 2: Setting Up React Locally

Lecture 3: Writing Your First Components

Lecture 4: Rendering Lists in React with map()

Lecture 5: Summary

Chapter 4: Props

Lecture 1: Welcome to Section 4

Lecture 2: Introduction to Props

Lecture 3: Default Props

Lecture 4: Typechecking Props

Lecture 5: Summary

Chapter 5: Introduction to State

Lecture 1: Welcome to Section 5

Lecture 2: Click Counter Project

Lecture 3: Summary

Chapter 6: Advanced State

Lecture 1: Welcome to Section 6

Lecture 2: Tic Tac Toe Project – Introduction

Lecture 3: Tic Tac Toe – Basic Implementation

Lecture 4: Detour – What is Deep Copying?

Lecture 5: Tic Tac Toe – Implementing Player Turns

Lecture 6: Tic Tac Toe – Determining Who Has Won

Lecture 7: Summary

Chapter 7: React Forms

Lecture 1: Welcome to Section 7

Lecture 2: Creating React Forms

Lecture 3: React Forms Applications

Lecture 4: Summary

Chapter 8: React Lifecycle Functions

Lecture 1: Welcome to Section 8

Lecture 2: Introduction to React Lifecycle Functions

Lecture 3: constructor()

Lecture 4: getDerivedStateFromProps()

Lecture 5: render(), componentDidMount()

Lecture 6: getSnapShotBeforeUpdate(), componentDidUpdate(), componentWillUnmount()

Chapter 9: React Router

Lecture 1: Welcome to Section 9

Lecture 2: Introduction to React Router

Lecture 3: Switch

Lecture 4: Passing Parameters

Lecture 5: Links

Lecture 6: Summary

Chapter 10: Graduation Project 1 – Todo Chrome Extension

Lecture 1: Welcome to Graduation Project 1

Lecture 2: What is a Graduation Project?

Lecture 3: Project 1 Overview

Lecture 4: Part 1 – Basic Functionalities

Lecture 5: Note on Font Icons

Lecture 6: Part 2 – Styling

Lecture 7: Part 3 – Reorganizing Code

Lecture 8: Part 4 – Drag and Drop

Lecture 9: Part 5 – Local Storage

Lecture 10: IMPORTANT: Update on Create React App 2

Lecture 11: Part 6 – Turning it into a Chrome Extension!

Chapter 11: Graduation Project 2 – Custom Github Dashboard

Lecture 1: Welcome to Graduation Project 2

Lecture 2: Project 2 Overview

Lecture 3: Detour – Asynchronous Code & JavaScript Promises

Lecture 4: Part 1 – Introduction to Axios

Lecture 5: Part 2 – Fetching Data from GitHub API

Lecture 6: Part 3 – Creating the Layout

Lecture 7: Part 4 – Creating the Profile Page

Lecture 8: Part 5 – Creating the All Repositories Page & Setting Up React Router

Lecture 9: Part 6 – Adding the Search Box

Lecture 10: Part 7 – Refactoring

Chapter 12: Graduation

Lecture 1: What's Next?

Instructors

Boon Hong Donovan So
Computer Engineering Major

Rating Distribution

1 stars: 1 votes
2 stars: 3 votes
3 stars: 11 votes
4 stars: 24 votes
5 stars: 27 votes

Frequently Asked Questions

How long do I have access to the course materials?

You can view and review the lecture materials indefinitely, like an on-demand channel.

Can I take my courses with me wherever I go?

Definitely! If you have an internet connection, courses on Udemy are available on any device at any time. If you don’t have an internet connection, some instructors also let their students download course lectures. That’s up to the instructor though, so make sure you get on their good side!

Menu