React Js Basic To Advance (Learn By Doing)

Free Download What you'll learn
You will know everything about reat js
You will learn how to build and optimize web applications
You will be able to build complex web applications
Deployment to server
Requirements
Html
css
java script
Description
About This ClassWelcome to React for Beginners, a course designed to teach React.js to web developers, even if they have never written any React.js code before.No one will be left behind in this session as we begin from the very beginning!Because React combines HTML and JavaScript, it may seem awkward to write at first, but I'll show you how to remember when to write JavaScript and when to write HTML (or what's known as JSX).React syntax, importing from other files, components, dividing components into new files and importing them, extending components, component properties and state, click events, and how to incorporate an API request when a button is hit will all be covered in this lesson.If that seemed complex and intimidating, don't worry; I'll show you all you need to know about React.js so you can start using it right now.Why learn React.js:You can create crazily dynamic and responsive webpages and applications with the JavaScript framework React. Your JavaScript might want to do some kind of action when a user types or clicks on something. That is simpler to write and maintain thanks to react. Additionally, it may be extended, allowing you to create a small amount of code once and reuse it across the board to avoid having to write code all day.In addition, React is a skill that is in high demand. React is used by many startups, large corporations, and development firms. It allows them to build incredible user interfaces like the Netflix movie collection.Vanilla JavaScript can be used to construct anything that can be built in React, however React makes it simple to maintain and easy toWho uses React.js:Nowadays, almost everyone uses React. Whether it's a full website like Netflix or just a small section of one with intricate logic. Nowadays, React is written by pretty much everyone and their pets. And for that reason, learning is crucial.About the teacher:I'm your teacher, Edubaba Ehizeex. Since 2015, I've been instructing others how to code. Tens of thousands of students on Skillshare alone are among the hundreds of thousands of pupils I have instructed and coached.As a web programming instructor, I was able to secure a prominent position in the development community.I'll be teaching you React.js today. It's okay if you've never written a react; I'll guide you over the learning curve. If you've never developed React, you MUST first become familiar with JavaScript. So if you are unfamiliar with JavaScript, please wait before beginning this course.Throughout this course, we're going to create a fully functionalNetflix Website (clone)Professional DashboardRecipe websiteQuiz AppProfessional Portfolio website to showcase your jobs.Finally, We are gonna deploy all the project on server so that you can share the links with your employers and your sponsors.
Overview
Section 1: Introduction
Lecture 1 React Foundamentals
Lecture 2 Introduction to react js
Lecture 3 Introduction to Components
Lecture 4 Tool installations
Lecture 5 React installation
Lecture 6 React boiler plate
Lecture 7 How React js works
Lecture 8 Introduction to jsx
Lecture 9 comment in jsx
Lecture 10 Types of component
Lecture 11 Creating our first functional component
Lecture 12 Types of export
Lecture 13 Props
Lecture 14 Props.children
Lecture 15 Props Immutability
Lecture 16 Props destructuring
Lecture 17 function as props
Lecture 18 React State (useState)
Lecture 19 Event handling
Lecture 20 Conditional Rendering
Lecture 21 Map Method (List Rendering)
Lecture 22 Unique Key Props (Mapping)
Lecture 23 Regular css
Lecture 24 Css Module
Lecture 25 Form input (Controlled Component)
Lecture 26 React Fragment
Section 2: Hooks (React js Advance Topics)
Lecture 27 useState Hooks
Lecture 28 update state based on the previous state value
Lecture 29 Object as state variable
Lecture 30 Array As state variable
Lecture 31 Organize the code
Lecture 32 useEffect Intro
Lecture 33 Component did mount and update
Lecture 34 Conditionally run Effect
Lecture 35 effect clean up function
Lecture 36 Component will unmount
Lecture 37 Fetch multiple posts
Lecture 38 Button click id
Lecture 39 Implement context
Lecture 40 useContext for multiple context
Lecture 41 useReducer Hooks
Lecture 42 useReducer State and action object
Lecture 43 Multiple useReducer
Lecture 44 useState and useReducer
Lecture 45 useState Data Fetch
Lecture 46 useReducer DataFetch
Lecture 47 useCallback Hook
Lecture 48 useMemo Hook
Lecture 49 useRef Hooks
Lecture 50 useRef Hooks Timer
Section 3: YumEat Project
Lecture 51 51 Building Yum Eat Website (react installation )
Lecture 52 Clean up boiler plate
Lecture 53 Create components
Lecture 54 Tailwind Installation
Lecture 55 TopNav Component
Lecture 56 SideNav
Lecture 57 SideNav Menu design
Lecture 58 SideNav Final Touch
Lecture 59 Featured component
Lecture 60 Quick delivery component
Lecture 61 Top Pick component
Lecture 62 Meal Component
Lecture 63 Sort Buttons
Lecture 64 Trending Categories
Lecture 65 Meal Component Key
Lecture 66 Trending Category count down
Lecture 67 Footer Component
Lecture 68 Testing and Fixing
Section 4: Building Netflix Clone
Lecture 69 Netflix Clone (Create React App )
Lecture 70 Components and pages
Lecture 71 Setting Up the routes
Lecture 72 BackgroundImage reUseAble Component
Lecture 73 Header reUseAble component
Lecture 74 SignUp Page
Lecture 75 Login
Lecture 76 Login Fix
Lecture 77 SettingUp Firebase
Lecture 78 CreateUsers
Lecture 79 Login Authentication
Lecture 80 OnScrollEvent
Lecture 81 TopNav Component
Lecture 82 Global css
Lecture 83 TopNav Component
Lecture 84 LogOut
Lecture 85 Hero Component
Lecture 86 Consistent Margin
Lecture 87 VideoPlayer Component
Lecture 88 MovieCard
Lecture 89 Card css
Lecture 90 Api Key
Lecture 91 Redux toolkit
Lecture 92 Fetch Genres
Lecture 93 Fetches Movies
Lecture 94 Global State
Lecture 95 Stop infinite Loop
Lecture 96 Styling Movie Component
Lecture 97 Render Movie on The Screen
Lecture 98 Performance Optimization
Lecture 99 Slider Control
Lecture 100 Implementing the Slider
Section 5: Dashboard Project (Building Dashboard website)
Lecture 101 React js Installation
Lecture 102 Cleaning Up The Boiler Plate
Lecture 103 Understanding The Flow
Lecture 104 TopNav Component
Lecture 105 TopNav Css
Lecture 106 SideNav Component
Lecture 107 Side Nav Css
Lecture 108 Featured Item Component
Lecture 109 Featured Item Css
Lecture 110 Chart Component
Lecture 111 Chart Css
Lecture 112 Style Configuration
Lecture 113 Display Total Component
Lecture 114 Styling Display Total
Lecture 115 Order Widget Component
Lecture 116 Styling Order Widget
Lecture 117 Member Widget Component
Lecture 118 implementing the Routes
Lecture 119 Styling The Member Widget
Lecture 120 User List Table
Lecture 121 Refactoring
Lecture 122 Adding Custom Data
Lecture 123 Delete Button
Lecture 124 User Profile
Lecture 125 Profile Css
Lecture 126 Create User Route
Lecture 127 Create User Component
Lecture 128 Create User Css
Lecture 129 ProductLIst Component
Lecture 130 Product List Design
Lecture 131 Product List Css
This course is for beginners of all level, who want to learn react basics and advance topics.


Homepage