Web Design with React

UI User Interface Library

9h 42m34 lectures6 sections

What you'll learn

  • Understand React library fundamentals
  • Create interactive components
  • Manage state and props efficiently
  • Design dynamic web applications
  • Use Hooks in React
  • Master building interactive UIs

About this course

React JS is a JavaScript library designed to help developers build user interfaces for web applications, featuring a wide array of components like menus, search bars, buttons, and anything else users interact with on a website. Before React JS, developers manually used JavaScript without libraries or relied on weaker libraries like jQuery, leading to longer development times and increased chances for errors. In this course, we will explore everything about React JS from the ground up to mastery.

Expected outcomes

  • Deep understanding of React concepts with practical application.
  • Ability to create interactive and modern web applications.
  • Mastery of tools like JSX, Hooks, and components.
  • Build a final project that reflects the skills acquired during the course.

Course content

1

Introduction to React

4 lectures
  1. What is React6:55
  2. Installing Tools8:50
  3. Creating Your First Project22:16
  4. Code SandBox Tool16:22
2

Using JSX with React

6 lectures
  1. Explanation of JSX and Babel Compiler24:07
  2. Simple Practical Application5:25
  3. Handling Values15:23
  4. Handling Style and Properties24:13
  5. Adding Custom Style to Elements14:48
  6. Practical Application21:39
3

Component

14 lectures
  1. What is the Component?29:53
  2. Code Modification for the New Update5:21
  3. Embedding the Component with the Previous Practical Application11:09
  4. Handling the Model and Explaining Import and Export25:52
  5. Practical Application on the Model10:19
  6. Explanation of Props24:48
  7. Practical Application on Props33:17
  8. Using React DevTools15:32
  9. Explanation of the Map Method16:24
  10. Practical Application on the Map Method30:47
  11. Explanation of Key Functions Used19:17
  12. Explanation of Arrow Function10:19
  13. Controlling Display Through Conditions19:56
  14. Practical Application12:15
4

Explaining Hooks

5 lectures
  1. Introduction to State12:53
  2. Explaining the UseState Hook29:29
  3. Practical Application17:00
  4. Event Handling12:56
  5. Working with Forms19:01
5

Final Project

4 lectures
  1. Stage One25:34
  2. Stage Two8:01
  3. Stage Three10:31
  4. Stage Four21:31
6

Extensions

1 attachments
  1. Download Final Project Files

Instructor

Eng. Amr Abdel Fattah

Eng. Amr Abdel Fattah

Computer systems engineer specializing in mobile app and website development, with experience in creating popular platforms and web applications.
6,563 students20 courses

Related courses

  • Microsoft Access
    4.6|5,337|0h 0m

    Microsoft Access

    Learn to Create Databases and Reports

    Ahmed Hassan Khamis
    Ahmed Hassan Khamis
    $19.99
    Buy now
  • Key Logger Spyware Design
    4.5|5,026|0h 0m

    Key Logger Spyware Design

    Spyware Design Using C++ Language

    Eng. Mohamed Ali Mansour
    Eng. Mohamed Ali Mansour
    $19.99
    Buy now
  • Adobe Animate & Action Script
    4.7|6,962|16h 58m

    Adobe Animate & Action Script

    Learn to Create Cartoon Films and Interactive Games

    Ahmed Hassan Khamis
    Ahmed Hassan Khamis
    $19.99
    Buy now
  • Deep Learning
    4.5|5,162|12h 40m

    Deep Learning

    Simulating the Human Mind in Thinking

    Eng. Amr Abdel Fattah
    Eng. Amr Abdel Fattah
    $25.99
    Buy now