Zero to Hero React JS mastery E-degree course

Zero to Hero React JS mastery E-degree course, available at $64.99, has an average rating of 4.55, with 116 lectures, based on 149 reviews, and has 12423 subscribers.

You will learn about You will become a Pro React JS web developer You will learn everything about CSS3 & Bootstrap 5 You will learn everything about JavaScript & ES6 You will learn everything about HTML5 You will learn various debugging and troubleshooting tools and techniques This course is ideal for individuals who are Anyone with interest to become a pro web developer It is particularly useful for Anyone with interest to become a pro web developer.

Enroll now: Zero to Hero React JS mastery E-degree course

Summary

Title: Zero to Hero React JS mastery E-degree course

Price: $64.99

Average Rating: 4.55

Number of Lectures: 116

Number of Published Lectures: 116

Number of Curriculum Items: 116

Number of Published Curriculum Objects: 116

Original Price: $39.99

Quality Status: approved

Status: Live

What You Will Learn

You will become a Pro React JS web developer

You will learn everything about CSS3 & Bootstrap 5

You will learn everything about JavaScript & ES6

You will learn everything about HTML5

You will learn various debugging and troubleshooting tools and techniques

Who Should Attend

Anyone with interest to become a pro web developer

Target Audiences

Anyone with interest to become a pro web developer

In this course, you will learn everything that is needed for you to become a Pro React JS developer in a hands-on step by step approach.

There is no prerequisite for this course.

Everything will be taught from scratch with practical examples.

Following are the technologies that will be covered:

HTML5 concepts

HTML5 Projects

CSS3 concepts

CSS3 Projects

JavaScript and ES6 concepts

JavaScript and ES6 projects

Bootstrap 5 concepts

ReactJS (latest version 17) concepts

ReactJS projects

The HTML5  topics that will be covered in the course are:

Introduction to web development

Client-server architecture

Three-tier architecture

What is HTML

What is CSS

What is JavaScript

Local development environment setup with industry-standard tools

Plugins and techniques to speed up development

Debugging skills

Structure of HTML page

HML tag and concept of attributes

Various components of HTML document

Meta tag and its importance

Head tag

Link tag

Script tag

Display tags like h1 until h6

Display tags like paragraph, span, division, label

Inline vs block elements

How to use Entities in HTML

Navigation via an anchor tag

Button tag

Loading images on your website

Different utility tags to make text bold, italics emphasize

Listing tags like ul, ol

Layout tag like table

How to create Registration form in HTML

Various form tags in HTML like

1. form

2. Different types of input tag

3. File uploading

4. Creating dropdown with different options

5. Writing address in textarea

Header and Footer tag

Section and Article tag

Video and Audio tag

Loading various websites inside Iframe tag

Much more

You will get the complete source code so that if you get any doubts anywhere you can just refer the source code.

The topics that will be covered for CSS3 are:

Introduction to web development

Client-server architecture

Three-tier architecture

What is HTML

What is CSS

What is JavaScript

Local development environment setup with industry-standard tools

Plugins and techniques to speed up development

Debugging skills

Structure of HTML page

HML tag and concept of attributes

Various components of HTML document

Meta tag and its importance

Head tag

Link tag

Script tag

Inline, Embedded, External styling

Linking external stylesheet in your Html

Using developer tools and knowing various components of it

Different types of CSS selectors

How to use fonts, colors, border, background style

Box model in CSS

How to solve problems due to box model

Margin and Padding in CSS

Display and Visibility

Different types of positions in CSS

Float and Clear

Usage of z-index property

Creating layouts using Flexbox

Responsive web design using media queries

Different types of pseudo-selectors and their usages

Box shadow and Text shadow

Animation and Keyframes

Transition and its types

Transformation and its types

You will get the complete source code so that if you get any doubts anywhere you can just refer the source code.

Following are the topics that will be covered in Javascript:

Setup Installation

JavaScript Introduction

ECMAScript evolution

Different types of Data types in Javascript

Variables & Constants

Different types of Comments in Javascript

Various Operators and their working on Operands

String and String manipulation

What is Variable Scoping

Control statement like if, else, switch-case-break

Loops – for, for of, forEach, while, do-while

Working with Arrays

Working with Objects

What are Functions and how to create custom functions and call them

What is the use of Prompt

What is the use of Confirm

What is the use of Alert

What is Document Object Model(DOM)

DOM manipulation using Javascript

Event and Event Listener

Set Timeout and Set Interval

Clear Timeout and Clear Interval

Date and Time operation and using its various methods

Working with Math Object

Working with JSON

Window and document object

location and history

localStorage and sessionStorage

Calling API with Fetch

What is the Ternary operator and how to use it.

What is the Array Filter function and how to use it.

Debugging and Troubleshooting in JavaScript

Template literals (Template strings) in ES6

Object Destructuring assignment in ES6

let and const

Spread operator

Arrow function expressions

We will also do Multiple projects in order to understand different concepts.

You will also get the complete source code of the whole course

Following are the topics that will be covered in React JS and Bootstrap:

1.1-ReactJS introduction and environment setup

1.2-create react app

1.3-program flow and project files walkthrough

1.4-types of components in react

1.5-creating and using 1st functional component

1.6-creating 1st stateful class component

1.7-ES6 functional component, export and import

1.8-comparision between functional and class component

1.9-react hooks intro

1.10-jsx explained

1.11-props in functional and class component

1.12-state vs props

1.13-deep dive into setState

1.14-Handling form in class component part-1

1.15-Handling form in class component part-2

1.16-componentDidMount lifecycle onload method

2.1-create new react app and understand project structure

2.2-project cleanup

2.3-installing bootstrap and react vscode extension

2.4-create home about contact page

2.5-creating navbar component

2.6-adding react-router-dom and different routes

2.7-Link and NavLink to avoid page reload

2.8-Designing About and Contact page

2.9-Page not found

2.10-Bootstrap vs React-Bootstrap

2.11-Using custom styling

3.1-setting up backend fake api and db

3.2-useState useEffect axios api call and React Dev Tools extension

3.3-showing all users on frontend UI

3.4-adding action buttons on frontend

3.5-add user navigation routing

3.6-create Add User form

3.7-set state variable data

3.8-save new user to DB via post api call

3.9-another way to save user data in DB using post api

3.10-edit user prepopulate user data

3.11-save updated user in DB

3.12-delete a user

3.13-view user details

3.14-view user address and company info

3.15-showing loading spinner

The complete source is also shared.

Course Curriculum

Chapter 1: Mastering HTML5

Lecture 1: Course Overview

Lecture 2: About your Instructor

Lecture 3: Introduction to web development

Lecture 4: Installation and Setup

Lecture 5: html-structure-comments

Lecture 6: head-meta-link-script-tags

Lecture 7: headings-p-span-div-br-hr-text

Lecture 8: anchor-img-tag

Lecture 9: Ordered and Unordered list

Lecture 10: Table Row Column

Lecture 11: Form Input Select Textarea

Lecture 12: inline-block-entities-header-footer-section-button-article-audio-video-iframe

Lecture 13: Source code for HTML5

Chapter 2: Mastering CSS3

Lecture 1: Introduction to CSS

Lecture 2: Different ways of using CSS

Lecture 3: Selectors-in-CSS

Lecture 4: Debugging-using-developer-tool

Lecture 5: Fonts-in-CSS

Lecture 6: Colors-in-CSS

Lecture 7: Border-Background-Height-Width

Lecture 8: BoxModel-Margin-Padding

Lecture 9: float-clear

Lecture 10: pseudo-selector

Lecture 11: css-display-property

Lecture 12: css-position-property

Lecture 13: css-visibility-z-index

Lecture 14: css-flex-box

Lecture 15: css-responsive-units-em-rem-vh-vw

Lecture 16: media-queries

Lecture 17: advance-pseudo-selector

Lecture 18: nth-selector

Lecture 19: before-after-pseudo-selector

Lecture 20: css-box-text-shadow

Lecture 21: css-custom-variables

Lecture 22: css-animation-keyframes-part-1

Lecture 23: css-animation-keyframes-part-2

Lecture 24: transition

Lecture 25: transform

Lecture 26: Source code CSS3

Chapter 3: Mastering JavaScript & ES6

Lecture 1: Introduction to the World of JavaScript

Lecture 2: JavaScript Popularity and ECMAScript evolution

Lecture 3: Installation and setup

Lecture 4: Writing your first javascript

Lecture 5: datatype and variables

Lecture 6: comments in javascript

Lecture 7: operators and operands

Lecture 8: string concatenation

Lecture 9: string functions

Lecture 10: scope in javascript

Lecture 11: if else switch case

Lecture 12: object in javascript

Lecture 13: array in javascript

Lecture 14: function in javascript

Lecture 15: alert prompt confirm parse in javascript

Lecture 16: loops in javascript

Lecture 17: spread operator

Lecture 18: ternary operator

Lecture 19: array filter function

Lecture 20: understanding DOM

Lecture 21: manipulating DOM with javascript

Lecture 22: event and event-listener in javascript

Lecture 23: setTimeout and clearTimeout

Lecture 24: setInterval and clearInterval

Lecture 25: Date and Time Part-1

Lecture 26: Date and Time Part-2

Lecture 27: JSON object and its manipulation

Lecture 28: Arrow function

Lecture 29: Window, document, localStorage, sessionStorage

Lecture 30: Math object and various functions

Lecture 31: Project 1

Lecture 32: Project 2

Lecture 33: Project 3

Lecture 34: Source code for JavaScript & ES6

Chapter 4: Mastering ReactJS & Bootstrap 5

Lecture 1: ReactJS introduction and environment setup

Lecture 2: create react app

Lecture 3: program flow and project files walkthrough

Lecture 4: types of components in react

Lecture 5: creating and using 1st functional component

Lecture 6: creating 1st stateful class component

Lecture 7: ES6 functional component, export and import

Lecture 8: comparision between functional and class component

Lecture 9: react hooks intro

Lecture 10: jsx explained

Lecture 11: props in functional and class component

Lecture 12: state vs props

Lecture 13: deep dive into setState

Lecture 14: Handling form in class component part-1

Lecture 15: Handling form in class component part-2

Lecture 16: componentDidMount lifecycle onload method

Lecture 17: create new react app and understand project structure

Lecture 18: project cleanup

Lecture 19: installing bootstrap and react vscode extention

Lecture 20: create home about contact page

Lecture 21: creating navbar component

Lecture 22: adding react-router-dom and different routes

Lecture 23: Link and NavLink to avoid page reload

Instructors

Ranjan Pandey
Software Professional with 14+ years of experience in IT

Rating Distribution

1 stars: 0 votes

2 stars: 4 votes

3 stars: 23 votes

4 stars: 45 votes

5 stars: 77 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!