Build Ecommerce site from scratch using React,Node&Bootstrap

Course Curriculum

Chapter 1: Introduction

Lecture 1: What we will be building, an overview

Chapter 2: Getting started with React

Lecture 1: Downloading and installing development tools i.e node and visual studio code

Lecture 2: Links to download node and visual studio code

Lecture 3: Creating a boilerplate from react default program

Lecture 4: Cleaning and getting the boilerplate ready for coding

Lecture 5: Downloading and linking Bootstrap to a React project

Lecture 6: Link to download Bootstrap and already downloaded Bootstrap file

Lecture 7: Downloading and linking Jquery to a React project

Lecture 8: Link to download Jquery

Lecture 9: Downloading and linking fontawesome to a React project

Lecture 10: Link to download fontawesome and the raw file

Lecture 11: How to confirm and check that files linked to a React project are working

Chapter 3: Understing terminologies in React and Creating Components

Lecture 1: Defining terms and familarizing ourselves with concepts in React

Lecture 2: Understanding the general overview and flow of React

Lecture 3: What is JSX? How to apply it in React

Lecture 4: Creating our first and reuseable components

Lecture 5: Functional based components in React and how it works

Lecture 6: Class based components in React and how to use it.

Lecture 7: Recap on Components in React and structuring your files

Chapter 4: Brief insight on Bootstrap and application

Lecture 1: What is bootstrap and why we use it

Lecture 2: Understanding bootstrap margin, padding and lists system in React

Chapter 5: Creating a responsive Navbar in React

Lecture 1: Creating a Navbar from scratch in React:What we will build at the end of lecture

Lecture 2: Navbar creation: Linking images and external css file in React

Lecture 3: Navbar creation continuation: Working with icons in React

Lecture 4: Navbar conclusion: Creating dropdowns in react and what we built

Chapter 6: React Route and Links: Navigating from one page to another

Lecture 1: Understanding React Router for functional based components

Lecture 2: Using React Route for class based components

Lecture 3: Restructuring your React project to fit your specification eg our ecommerce app

Lecture 4: React Links: Creating our footer using react links

Chapter 7: React responsive homepage: Ecommerce homepage from scratch

Lecture 1: What we will be building for our homepage usng React components

Lecture 2: Understanding parent / child components and the relationship between them

Lecture 3: Creating our homepage first section using bootstrap carosuel

Lecture 4: Reuseable sidebar component for our homepage first section

Lecture 5: Summary for our homepage first section

Lecture 6: Creating our second section for our homepage using picture icons

Chapter 8: Getting Started with Node

Lecture 1: Complete setup, creating folders and installing necessary dependencies for node

Lecture 2: Installing axios and cors dependencies for fetching data in React

Chapter 9: Populating our homepage with content from Node our server

Lecture 1: Dealing with state in react

Lecture 2: Understanding array mapping in React

Lecture 3: Working with React PROPS

Lecture 4: Calling data from node server or API using the functional approach

Lecture 5: Calling data from node server or API using the class based approach

Lecture 6: Understanding the new React AppContext using practical example to explain

Lecture 7: Creating and populating our homepage third section with actual products

Chapter 10: Ecommerce Add to Cart: Cont. of building Ecommerce homepage from scratch

Lecture 1: Creating the add to cart function in React

Lecture 2: Creating the cart and cartItem components

Lecture 3: Creating the remove item from cart and the remove from cart functions

Chapter 11: Creating and populating other pages of our SideBar section from Node server

Lecture 1: Creating the fashions page and retrieving data from API or server

Lecture 2: Creating and linking other pages in our SideBar to our Homepage

Lecture 3: Populating the categories or SideBar pages with contents from Node server

Chapter 12: Conclusion

Lecture 1: CONGRATS!!!