Build & Deploy a Full Stack E-Commerce Website with Next.js & Strapi | Part-2 (Backend & Deployment)
54.8 هزار بار بازدید -
پارسال
-
This is the second part
This is the second part of our most loved Full Stack E-Commerce project, in this part we will complete the functionality and backend and at the end of this video we will deploy the complete project for free.
⭐⭐⭐ Watch First Part - Build & Deploy a Full Stack E-Commerc...
Recommended Videos:
⏩ Build Deploy & Google Search Clone - Build & Deploy Google Search Applicat...
⏩ Build Deploy & YouTube Clone - Build & Deploy Fully Functional YouTu...
⏩ Build & Deploy Personal Portfolio Website - Build & Deploy Fully Functional Perso...
⏩ Build & Deploy ChatGPT Ai App - Build & Deploy ChatGPT Ai App with Re...
⏩ Build a Full Stack E-Commerce Website - Build a Full Stack E-Commerce Website...
⏩ Modern Portfolio Website - Build & Deploy Modern Portfolio Websi...
📚 Materials/References:
⭐ GitHub Repository - Frontend (give it a star ⭐): http://bit.ly/3LxFzJb
⭐ GitHub Repository - Backend (give it a star ⭐): http://bit.ly/3JOLGaT
⭐ Gist: http://bit.ly/3Fppphc
⭐ Starter Boilerplate - http://bit.ly/3TfTPrS
⭐ Assets: http://bit.ly/3mQVjwF
⭐ Products Data: http://bit.ly/3TkWz7c
Tailwind installation guide for nextjs:
https://tailwindcss.com/docs/guides/n...
In this tutorial you’ll learn:
- Next.js 13 and its latest features
- Core feature of Next.js
- Server side rendering (SSR, SSG) in Next.js
- Dynamic Routing in Next.js
- Rapid UI building with Tailwind CSS
- Mobile first responsive approach
- Functional Programming through utility methods
- Strapi Headless CMS and its features
- How to fetch data from strapi api’s in next.js application
- Redux fundamentals and its best usage for cart functionality
- Complete cart functionality with add,update,delete actions
- Project deployment for frontend and backend
Follow me on 👇
🖼️ Instagram - https://bit.ly/3jIJqYc
😺 GitHub - http://bit.ly/3I6Qx6O
👇 Time Stamps
00:00:00 Strapi Installation & Postgres Database
00:08:06 Cloudinary Setup with Strapi
00:16:18 Collections creation in Strapi
00:25:15 Content Population in Strapi
00:34:55 API’s testing with Insomnia
00:45:30 Setting up data fetching method in Next.js
00:58:10 Homepage Products Data Fetching & Mapping
01:28:05 Category DropDown Data Fetching & Mapping
01:36:40 Category Page Data Fetching & Mapping Through SSG & getStaticPath
01:54:45 Pagination Functionality
02:10:40 Product Details Page Data Fetching & Mapping
02:46:32 Redux Toolkit Setup For Cart
03:15:00 Cart Functionality
03:44:35 Stripe Payment Gateway Integration & Checkout Functionality
04:07:35 Github Repo’s Creation
04:12:28 Deploying Backend Code on Render
04:20:00 Deploying Frontend Code on Vercel
Join this channel to get access to perks:
@jsdevhindi
⭐⭐⭐ Watch First Part - Build & Deploy a Full Stack E-Commerc...
Recommended Videos:
⏩ Build Deploy & Google Search Clone - Build & Deploy Google Search Applicat...
⏩ Build Deploy & YouTube Clone - Build & Deploy Fully Functional YouTu...
⏩ Build & Deploy Personal Portfolio Website - Build & Deploy Fully Functional Perso...
⏩ Build & Deploy ChatGPT Ai App - Build & Deploy ChatGPT Ai App with Re...
⏩ Build a Full Stack E-Commerce Website - Build a Full Stack E-Commerce Website...
⏩ Modern Portfolio Website - Build & Deploy Modern Portfolio Websi...
📚 Materials/References:
⭐ GitHub Repository - Frontend (give it a star ⭐): http://bit.ly/3LxFzJb
⭐ GitHub Repository - Backend (give it a star ⭐): http://bit.ly/3JOLGaT
⭐ Gist: http://bit.ly/3Fppphc
⭐ Starter Boilerplate - http://bit.ly/3TfTPrS
⭐ Assets: http://bit.ly/3mQVjwF
⭐ Products Data: http://bit.ly/3TkWz7c
Tailwind installation guide for nextjs:
https://tailwindcss.com/docs/guides/n...
In this tutorial you’ll learn:
- Next.js 13 and its latest features
- Core feature of Next.js
- Server side rendering (SSR, SSG) in Next.js
- Dynamic Routing in Next.js
- Rapid UI building with Tailwind CSS
- Mobile first responsive approach
- Functional Programming through utility methods
- Strapi Headless CMS and its features
- How to fetch data from strapi api’s in next.js application
- Redux fundamentals and its best usage for cart functionality
- Complete cart functionality with add,update,delete actions
- Project deployment for frontend and backend
Follow me on 👇
🖼️ Instagram - https://bit.ly/3jIJqYc
😺 GitHub - http://bit.ly/3I6Qx6O
👇 Time Stamps
00:00:00 Strapi Installation & Postgres Database
00:08:06 Cloudinary Setup with Strapi
00:16:18 Collections creation in Strapi
00:25:15 Content Population in Strapi
00:34:55 API’s testing with Insomnia
00:45:30 Setting up data fetching method in Next.js
00:58:10 Homepage Products Data Fetching & Mapping
01:28:05 Category DropDown Data Fetching & Mapping
01:36:40 Category Page Data Fetching & Mapping Through SSG & getStaticPath
01:54:45 Pagination Functionality
02:10:40 Product Details Page Data Fetching & Mapping
02:46:32 Redux Toolkit Setup For Cart
03:15:00 Cart Functionality
03:44:35 Stripe Payment Gateway Integration & Checkout Functionality
04:07:35 Github Repo’s Creation
04:12:28 Deploying Backend Code on Render
04:20:00 Deploying Frontend Code on Vercel
Join this channel to get access to perks:
@jsdevhindi
پارسال
در تاریخ 1401/12/27 منتشر شده
است.
54,805
بـار بازدید شده