Build, Test, Deploy a Full Stack Nextjs E-Commerce Multi Vendor Sass From Scratch in 2025 - Part2

If you're looking for a well-designed front-end roadmap, here's one of the best you'll see.

We'll also build a front-end application from scratch, so you can start your front-end application with ease.

Watch, learn, try to build your own project

📚 Materials/References:

📚 Frontend Courses:

## ASSETS

🟢Online Store Website ORION MULTI VENDOR

🔴Admin - Seller Dashboard ORION MULTI VENDOR

## ✖️ Additional content ( SOURCE CODE )

⏰TIMESTAMPS
00:00:00 -- Intro
00:01:28 -- What is Frontend Development ?
00:02:40 -- What do Frontend Developers do ?
00:04:00 -- What skills will you need to get hired in 2025 ?
00:15:30 -- Demo: Frontend Project
00:21:22 -- Prerequisites
00:22:38 -- Install Nextjs Project
00:30:07 -- Folder Structure
00:34:47 -- Setup ShadCn UI
00:39:45 -- Setup Branding - Fonts
00:44:36 -- Setting up Responsive Design
00:51:56 -- Setup Branding - Colors
00:57:14 -- Setup Branding - Typography
01:05:00 -- Setup Clerk Auth
01:35:35 -- Marketing page
03:17:52 -- Admin Dashboard - UI
03:56:19 -- Admin Dashboard - Fetching data on server side
04:08:14 -- Admin Settings UI
04:20:13 -- Admin Settings - Fetching data on client side
05:19:00 -- Admin Subcategories - List UI
05:51:01 -- Admin Subcategories - List UI - Fetching data client side
06:01:01 -- Admin Subcategories - Form UI
06:23:00 -- Admin Subcategories - Form - Fetching data client side
07:22:00 -- Setup Cloudinary
09:09:00 -- What you learnt
09:10:00 -- Your tasks
09:10:54 -- What's next ?

❓WHO THIS COURSE FOR
Beginners in JavaScript
Web developers
Passionate learners 

 
✍️ COURSE STRUCTURE
Admin part :  Building Front-end Application for admin
Store part: Building Front-end Application for the store

 
📑 WHAT WILL YOU LEARN ?
Learning Responsive design using Tailwind Css and NextJs
Learning how to structure your Front-end application with NextJs
Learning how to create reusable components with React and NextJs
Learning how to integrate Restful APIs  with useSWR
Integrating client side validation with Zod Validator

✍️ TODO

i won't actually build all the modules. I'm just going to show you how to do and it's going to be your turn. You're welcome

So here are your tasks 
Create forms and lists for modules such as
categories
tags
collections
products
orders
shippings
stores
sellers campaigns
withdrawals
vendors store

👩‍💻 IF YOU HAVE ISSUES: 

💻Get the source code and solve problems at your own.

✅Prerequisite knowledge
This course assumes knowledge of HTML, CSS, JavaScript.

✅ System requirements
Before you start this course, make sure you have the following installed:
Operating systems: macOS, Windows (including WSL), or Linux.
VSCode or another text editor of your choice.

⚠️ DISCLAIMER
The disclaimer video is intended for educational purposes only. Copyright Disclaimer Under Section 107 of the Copyright Act 1976, allowance is made for "fair use" for purposes such as criticism, comment, reporting current affairs, teaching, scholarship and research. Fair use is permitted by copyright law that might otherwise be infringing. Non-profit, educational or personal use tips the balance in favor of fair use.

#nextjs15
#frontend
#frontenddeveloper
#2025

[sylvaincodes]

If you're looking for a well-designed front-end Roadmap, here's one of the best you'll see.

We'll also build a front-end application from scratch, so you can start your front-end application with ease.

Watch, learn, try to build your own project

📚 Materials/References:

📚 Frontend Courses:


🟢Online Store Website ORION MULTI VENDOR



🔴Admin - Seller Dashboard ORION MULTI VENDOR



## ✖ Additional content ( SOURCE CODE )




⏰TIMESTAMPS
00:00:00 -- Intro
00:01:28 -- What is Frontend Development ?
00:02:40 -- What do Frontend Developers do ?
00:04:00 -- What skills will you need to get hired in 2025 ?
00:15:30 -- Demo: Frontend Project
00:21:22 -- Prerequisites
00:22:38 -- Install Nextjs Project
00:30:07 -- Folder Structure
00:34:47 -- Setup ShadCn UI
00:39:45 -- Setup Branding - Fonts
00:44:36 -- Setting up Responsive Design
00:51:56 -- Setup Branding - Colors
00:57:14 -- Setup Branding - Typography
01:05:00 -- Setup Clerk Auth
01:35:35 -- Marketing page
03:17:52 -- Admin Dashboard - UI
03:56:19 -- Admin Dashboard - Fetching data on server side
04:08:14 -- Admin Settings UI
04:20:13 -- Admin Settings - Fetching data on client side
05:19:00 -- Admin Subcategories - List UI
05:51:01 -- Admin Subcategories - List UI - Fetching data client side
06:01:01 -- Admin Subcategories - Form UI
06:23:00 -- Admin Subcategories - Form - Fetching data client side
07:22:00 -- Setup Cloudinary
09:09:00 -- What you learnt
09:10:00 -- Your tasks
09:10:54 -- What's next ?


❓WHO THIS COURSE FOR

Beginners in JavaScript
Web developers
Passionate learners


✍ COURSE STRUCTURE

Admin part : Building Front-end Application for admin
Store part: Building Front-end Application for the store


📑 WHAT WILL YOU LEARN ?

- Learning Responsive design using Tailwind Css and NextJs
- Learning how to structure your Front-end application with NextJs
- Learning how to create reusable components with React and NextJs
- Learning how to integrate Restful APIs with useSWR
- Integrating client side validation with Zod Validator


✍ TODO

i won't actually build all the modules. I'm just going to show you how to do and it's going to be your turn. You're welcome

So here are your tasks
Create forms and lists for modules such as
categories
tags
collections
products
orders
shippings
stores
sellers campaigns
withdrawals
vendors store


👩‍💻 IF YOU HAVE ISSUES:

💻Get the source code and solve problems at your own.


✅Prerequisite knowledge

This course assumes knowledge of HTML, CSS, JavaScript.


✅ System requirements

Before you start this course, make sure you have the following installed:
Node.js 20.x or later installed.
Operating systems: macOS, Windows (including WSL), or Linux.
VSCode or another text editor of your choice.

[joshprog-quhy]

I was looking for a frontend Roadmap, That's great. 🥰