Udemy
    •  
    •  
    •  
    •  
    •  
    •  
    •  
    •  
Turn what you know into an opportunity and reach millions around the world.
Learn More
Your cart is empty.
Keep shopping
React js with Redux and Node JS API [Fullstack Project]
Rating: 4.8 out of 5(11 ratings)
1,157 students

React js with Redux and Node JS API [Fullstack Project]

Full-Stack React Js with Redux, Node Js, Express
Last updated 1/2024
Arabic

What you'll learn

  • Learn how to create react ecommerce website
  • Create Fullstack Project using react - Redux - node
  • Learn Redux - Redux Toolkit - RTK Query
  • Learn localStorage (JSONstringify - JSON parse)

Course content

1 section37 lectures7h 6m total length
  • Introduction3:29
  • #2 Update all dependencies to the latest version15:20
  • #3 Home Page14:38
  • #4 Cart Page23:35
  • #5 Task Solution13:13
  • #6 What is API & MERN stack4:24
  • #7 Creating a Node js API11:45
  • #8 Upload images to Cloudinary6:15
  • #9 Fetching data using Redux Toolkit (RTK Query)22:27
  • #10 Task Solution8:17
  • #11 Redux VS Redux Toolkit VS RTK Query المقدمة6:19
  • #12 Learn Redux Toolkit (Crash Course)22:25
  • #13 Using Redux Toolkit in our project15:31
  • #14 هنعمل ايه16:49
  • #15 (Spread Operator) مراجعة جافاسكريبت8:55
  • #16 addToCartFUCNCTION13:06
  • #17 Array كيفية الحصول على عنصر معين من الـ10:14
  • #18 Task Solution7:48
  • #19 Array كيفية حذف عنصر معين من الـ18:08
  • #20 هنعمل ايه13:44
  • #21 Task Solution13:08
  • #22 Task Solution ( Array حذف عنصر معين من الـ )10:19
  • #23 Task Solution (get product quantity)10:31
  • #24 localStorage (JSON.stringify JSON.parse) شرح11:52
  • #25 Task Solution (send data to localStorage)11:04
  • #26 Task Solution (update quantity in localStorage)10:44
  • #27 Calculate the total price6:45
  • #28 react-router-dom (dynamic links)14:55
  • #29 Task Solution (node Js Express js)5:09
  • #30 Using RTK Query to get one product12:41
  • #31 How to get the params from the URL6:07
  • #32 Upload images to Cloudinary6:07
  • #33 Task Solution16:06
  • #34 Task Solution(Add product to cart)9:16
  • #35 Deploy the project for free13:20
  • #36 رفع الموقع بعد التعديل عليه8:42
  • #37 Add Custom Domain3:15

Requirements

  • React Basics

Description

  1. In this course, you will learn React Redux from scratch and make a real-world project that already exists in companies.

  2. we will create API using node and express and display data in the front end using React js Framework.

  3. I will teach you how to make a shopping cart and store the product details in the cart.

  4. we will design a home page, a product details page and a shopping cart page.

  5. learn how to upload and store images using Cloudinary service.

  6. we will fetch data using the redux toolkit (RTK query)

  7. we will use JavaScript local storage in our project to store data.

  8. At the end of this course, we will deploy the project to a free hosting service and we will connect the project a custom domain.

  9. التركيز الأساسى لهذا الكورس هو القدرة على عمل مشاريع  بإستخدام ريأكت  

  10. هذا الكورس هو كورس يعتمد على انشاء المشاريع الموجودة فى سوق العمل

  11. يجب ان تعلم ان ها الكورس هو كورس تفاعلى  بمعنى اننى سوف اطلب فى مُنتصف الفيديو ان تقوم بتكملة الكود بنفسك قبل ان اقوم بعمل الأكواد

  12. أهم نصيحة يُمكننى ان اعطيها لك هى ان تقوم بعمل المشاريع الموجودة فى  هذا  الكورس بعد مشاهدة الفيديو  مباشرة  حتى تتعود على كتابة الأكواد وعمل المشاريع الحقيقية


Who this course is for:

  • Javascript developers
  • React developers
  • front-end developers
  • full-stack developer