- Видео 451
- Просмотров 1 791 643
Dynamic Coding with Amit
Индия
Добавлен 4 фев 2021
My name is Amit Prajapati and I am a software engineer. I have always been fascinated by the world of programming, and I consider myself lucky to have found a career that aligns with my passions.
Throughout my career, I have had the opportunity to work with a variety of programming languages and technologies, which has allowed me to grow and develop as a programmer. While I have gained a considerable amount of knowledge and experience, I am always eager to continue learning and improving.
I created "Dynamic Coding with Amit" with the intention of sharing my love for programming and helping others to learn and grow in the field. My hope is that my tutorials and insights will be useful to others and that I can contribute to the programming community in a positive way.
Don't Forgot to Subscribe channel
Thanks Regard,
Dynamic Coding with Amit
For Business Enquiry Contact : DynamicCodingWithAmit@gmail.com
Throughout my career, I have had the opportunity to work with a variety of programming languages and technologies, which has allowed me to grow and develop as a programmer. While I have gained a considerable amount of knowledge and experience, I am always eager to continue learning and improving.
I created "Dynamic Coding with Amit" with the intention of sharing my love for programming and helping others to learn and grow in the field. My hope is that my tutorials and insights will be useful to others and that I can contribute to the programming community in a positive way.
Don't Forgot to Subscribe channel
Thanks Regard,
Dynamic Coding with Amit
For Business Enquiry Contact : DynamicCodingWithAmit@gmail.com
#3 Full Stack Blinkit Clone MERN App | Category, Sub Category, Admin User, Product
Build a complete e-commerce platform that looks like Blinkit using the MERN stack!
In this project, we will create an online shopping site with key features, including product uploads, an admin panel, and management for categories and subcategories. We will use access and refresh tokens to establish secure user authentication. You will also learn how to set up password recovery, OTP-based email verification, and secure authentication processes.
This project is a great way to improve your MongoDB, Express, React, and Node.js skills.
References :
MongoDB: www.mongodb.com/
Express: expressjs.com/
React: react.dev/
React Vite : v3.vitejs.dev/guide/
Nodejs: nodejs.org/en
Redux-Toolkit: react-redux.j...
In this project, we will create an online shopping site with key features, including product uploads, an admin panel, and management for categories and subcategories. We will use access and refresh tokens to establish secure user authentication. You will also learn how to set up password recovery, OTP-based email verification, and secure authentication processes.
This project is a great way to improve your MongoDB, Express, React, and Node.js skills.
References :
MongoDB: www.mongodb.com/
Express: expressjs.com/
React: react.dev/
React Vite : v3.vitejs.dev/guide/
Nodejs: nodejs.org/en
Redux-Toolkit: react-redux.j...
Просмотров: 2 947
Видео
#2 Full Stack Blinkit Clone MERN App | Login , Register, Forgot Password, Edit user details UI
Просмотров 5 тыс.14 дней назад
Build a complete e-commerce platform that looks like Blinkit using the MERN stack! In this video, you will master the art of building a comprehensive React project using Vite. We dive straight into essential features, including creating a responsive login screen, implementing robust user registration, integrating a forgot password feature, and updating user details-all while ensuring a seamless...
Full Stack Blinkit Clone MERN App with JWT Auth, Forgot Password, Search, React, Nodejs, MongoDB
Просмотров 34 тыс.14 дней назад
Build a complete e-commerce platform that looks like Blinkit using the MERN stack! In this project, we will create an online shopping site with key features, including product uploads, an admin panel, and management for categories and subcategories. We will use access and refresh tokens to establish secure user authentication. You will also learn how to set up password recovery, OTP-based email...
Full Stack E-commerce | Forgot Password, Admin panel, Redux, MERN, JWT
Просмотров 1,5 тыс.Месяц назад
E-commerce Website | Forgot Password | Admin panel | Redux | MERN App | Full Stack Material and Reference : stripe : stripe.com/in stripe documentation : docs.stripe.com/checkout/quickstart stripe react documentation : docs.stripe.com/stripe-js/react stripe github : github.com/stripe/stripe-node#Webhook-signing mongodb : www.mongodb.com/ Watch more tutorials : E-Commerce with firebase : ruclips...
Payment Gateway and Order Page | Full Stack E-Commerce Responsive MERN App | Stripe, React, MongoDB
Просмотров 28 тыс.5 месяцев назад
Learn how to integrate a payment gateway with Stripe, create an order page, and develop an admin panel to view all orders. Finally, upload all the code to GitHub and deploy it on the Vercel. ⭐ Subscribe to our channel for more MERN stack tutorials and stay tuned for upcoming videos on advanced topics like authentication, pagination, and more. Don't forget to like this video and leave your comme...
Build and Deploy movie app with React & Redux | Mobile Responsive
Просмотров 30 тыс.6 месяцев назад
In this movie app, you will understanding the principle of reactjs including the javascript fundamental, component, props, state management, react lifecycle, conditional rendering and redux-toolkit intergration. Moreover, you will explore into custom hooks for enhanced functionality. Utilizing tailwind css for styling and react router dom for smooth navigation between pages. Whether you're a be...
Build Chat App with React, Socket.io, Nodejs, Redux-Toolkit, MongoDB (2024)
Просмотров 98 тыс.6 месяцев назад
Learn to build a real-time messaging Chat App using React, Socket.io, Node.js, Redux-Toolkit, and MongoDB with responsive. This tutorial series covers everything from setup to implementation, offering valuable insights and practical skills. Whether you're a beginner or an experienced developer, start learning to take your React and Node.js expertise to the next level! Subscribe now and start bu...
How To Create Image Search Using HTML CSS and JavaScript | Infinte Scrolling
Просмотров 6707 месяцев назад
A way to make the task of creating an infinite scroll image search feature using HTML, CSS, and JavaScript interesting and involving many steps. Initially, you'll come up with a design in HTML which consists of a search input element as well as an images display container. Later on, spice things up by adding CSS styles to bring life to the visual aspect of your elements. Then, let JavaScript ta...
Full Stack Nextjs App with Auth, Likes, Comment , Post | Mongodb, Nodejs
Просмотров 5 тыс.7 месяцев назад
Learn how to build a complete Full Stack Nextjs app with authentication, likes, comments, posts, and more using MongoDB and Nodejs. Perfect for web developers looking to expand their skills! Make sure you establish a workflow that makes development easier and design an up-to-date UI that will make users enjoy the service. Come learn with us and raise your skills in NextJS today! We have more Fu...
Full Stack E-Commerce Responsive MERN App with Auth, Search, Filter, Upload Product | React, MongoDB
Просмотров 365 тыс.7 месяцев назад
Links : MongoDB: www.mongodb.com/ Express: expressjs.com/ React: react.dev/ Nodejs: nodejs.org/en Redux-Toolkit: react-redux.js.org/introduction/getting-started React Router: reactrouter.com/en/main/start/tutorial Mongoose: mongoosejs.com/ JsonWebToken: www.npmjs.com/package/jsonwebtoken Dotenv: www.npmjs.com/package/dotenv VsCode: code.visualstudio.com/ Code completed code : github.com/IsAmitp...
Sign In & Sign Up - MongoDB, express, React js, Nodejs & JWT
Просмотров 1,8 тыс.9 месяцев назад
Sign In & Sign Up - MongoDB, express, React js, Nodejs & JWT 🐥Frontend : ReactJS 🎒Backend : NodeJs, ExpressJs, MongoDB, Mongoose, JWT In this video, I build the complete sign in and sign up functionality in the MERN stack (MongoDB, expressJs, ReactJs, NodeJs) also learn the some concepts of the javascript and more function like spread Operator, routing, axios, how to connection done in mongoDB ...
Full Stack Ecommerce | MERN | DEMO | coming soon | new video
Просмотров 1,5 тыс.Год назад
Full Stack Ecommerce | MERN | DEMO | coming soon | new video #mern #react #mongodb #newvideo
Create a Resposive Food/Restaurat wesite design using html css and Javascript from scratch
Просмотров 3,4 тыс.Год назад
Create a Resposive Food/Restaurat wesite design using html css and Javascript from scratch
Complete CRUD Operation with Nodejs, MongoDB, React, Express | MERN Stack
Просмотров 71 тыс.Год назад
Complete CRUD Operation with Nodejs, MongoDB, React, Express | MERN Stack
Login with Google using Firebase in React.js
Просмотров 873Год назад
Login with Google using Firebase in React.js
Add Payment Gateway and Deploy Responsive MERN App | React, Redux, Nodejs, MongoDB, Express, Stripe
Просмотров 16 тыс.Год назад
Add Payment Gateway and Deploy Responsive MERN App | React, Redux, Nodejs, MongoDB, Express, Stripe
youtube clone navigation mobile using reactjs | part - 4
Просмотров 421Год назад
youtube clone navigation mobile using reactjs | part - 4
youtube clone sidebar using reactjs | part - 3
Просмотров 396Год назад
youtube clone sidebar using reactjs | part - 3
youtube clone Login with google - part-2
Просмотров 325Год назад
youtube clone Login with google - part-2
Youtube clone Header using React JS - part-1
Просмотров 1 тыс.Год назад
RUclips clone Header using React JS - part-1
Build amazing portfolio using html css and javascript
Просмотров 728Год назад
Build amazing portfolio using html css and javascript
Build a COMPLETE Fullstack ecommerce Responsive MERN App | React, Redux, Nodejs, MongoDB, Express
Просмотров 185 тыс.Год назад
Build a COMPLETE Fullstack ecommerce Responsive MERN App | React, Redux, Nodejs, MongoDB, Express
how to scroll indicator - html css and javascript
Просмотров 75Год назад
how to scroll indicator - html css and javascript
Order page Starbucks clone website ReactJS | #7
Просмотров 761Год назад
Order page Starbucks clone website ReactJS | #7
How to Build a Chroma Clone Website Using Reactjs
Просмотров 1,9 тыс.Год назад
How to Build a Chroma Clone Website Using Reactjs
Gift page Starbucks clone website ReactJS | #6
Просмотров 333Год назад
Gift page Starbucks clone website ReactJS | #6
Part : 3 - Filter product section MEESHO Clone using HTML/CSS/JavaScript
Просмотров 970Год назад
Part : 3 - Filter product section MEESHO Clone using HTML/CSS/JavaScript
When the admin tries to update the user role from 'GENERAL' to 'ADMIN,' it is not working.
CMS use kiye ho kya sir
Next part kab sir
hello , i just begin with nodejs and express , but i realize it has so many packages and when i search to read the doc on the website, it quite difficult to me to understand. In my college, they just code and don't use any env like react or nodejs , do you have any recommend or suggest for me to practice with them ?
It's an dynamic project ya static
qui peut m'aider je suis bloquer au niveau de webhook je n'arrive pas à installer le cli de stripe je suis sur ubuntu
Waiting for next part. Please uploaded it Thank You
varol dayi
Bro when next part come
tomorrow i will upload editing is done
next part.....
tomorrow i will upload editing is done
@@DynamicCodingwithAmit Ok..
Do anybody know how to handle that error of reinstate ur account...I tried to create a new one as well but still it's not working ....again and again Authorization failed.....please reply if anyone knows
next part
i need same in php , as i use host... basic hosting
Thank you Amit Bhai for Teaching and sharing knowledge
Very interesting video.. Very nice.. Also very cleared Would u build e commerse website for me
Yes, sure
Bro token undefined bata raha h
Any way to upload the product easily. Bcz it takes lots of time😢
Dear All is there some one could help please , i'm facing this matter node:internal/crypto/keys:596 throw new ERR_INVALID_ARG_TYPE( ^ TypeError [ERR_INVALID_ARG_TYPE]: The "key" argument must be of type string or an instance of ArrayBuffer, Buffer, TypedArray, DataView, KeyObject, or CryptoKey. Received undefined at prepareSecretKey (node:internal/crypto/keys:596:11) Ho couls I save it?
Thanks
only banner was loading in the source code of project please help me
Thank you sir. Great explain every part. 😋💛 Love from Srilanka 💛
Thanks! Glad you liked it, keep watching!
lots of love
Is it completed
Menu is not working Why?
you need to id the id
Is this project going to deployed ?
Yes
Thank You..💖. Waiting for next part. Please uploaded it very fast
Tomorrow
Waiting for next part...
Next part sir
Stay tuned, coming soon!
Thanks a lot.... Is this project responsive or not?Thanks in advance..
Yes, it is
next part please
Tomorrow
When come @@DynamicCodingwithAmit
2 questions: 1. is this the part part of this ecommerce project series? 2. why cant admin change status of the orders of user?
Login Page: 03:05:45
thats a nice project, I will definatie=le try thisone
Thank you for this wonderful video
how do i create my own logo with SVG..... someone help, how do i design With or On SVG
you can use any online service , like loka for create logo
pls also show us how to deploy this project
sure, i do this
Bro i am facing an error says process it not defined plz tell me what is the problem
Awesome project
Thanks, I'm happy you found it helpful!
How do we deploy this as an application for free, please tell us
sir i'm Software Engineer Undergraduate in sri Lanka can i get the source code for my education purpose
Nihon kara aishiteimasu
Hello teacher, please write a code to count the number of viewers.???
6:04:14 - Overview of product model structure in the backend for MERN app. 6:06:30 - Implementing product publishing logic in the app. 6:10:55 - Enhancing product form layout with gap adjustments and additional fields. 6:13:21 - Implementing a multi-line text area for user inputs in the app. 6:18:13 - Implementing an image upload feature in a MERN app. 6:20:38 - Implementing image upload functionality in the MERN app. 6:25:13 - Implementing image upload functionality in a MERN app. 6:27:37 - Implementing image display functionality in a MERN app. 6:32:30 - Implementing loading states and image upload functionality in the MERN app. 6:34:46 - Implementing full-screen image display and deletion functionality in the MERN app. 6:39:29 - Implementing group functionality for nested elements in a MERN app. 6:41:43 - Implementing image upload and delete functionality in the MERN app. 6:46:23 - Designing a multi-select category input in the MERN app. 6:48:39 - Implementing category selection in the product upload feature. 6:53:13 - Implementing category selection and display in a MERN app. 6:55:28 - Implementing responsive layout adjustments and dynamic behaviors in the MERN app. 6:59:54 - Implementing subcategory fetching in a MERN Blinkit clone. 7:02:11 - Implementing subcategory selection using Redux state in a MERN app. 7:06:59 - Creating input fields for product unit and stock in the admin panel. 7:09:15 - Implementing stock, price, and discount input fields in the app. 7:14:11 - Implementing a dialog for adding fields in the application. 7:16:41 - Implementing add field component in MERN app with dialog box design. 7:21:10 - Creating a styled input box with an add button for a MERN app. 7:23:31 - Implementing form submission and data handling in the MERN app. 7:28:33 - Implementing error handling and data display in MERN app 7:31:00 - Demonstrating the addition of fields in a form component. 7:35:47 - Implementing a form submission with styling for a MERN app. 7:38:16 - Debugging integration of product data in the MERN stack application. 7:43:25 - Creating a product model and handling errors in the MERN app. 7:46:29 - Product creation involves validation of required fields and error handling. 7:51:15 - Implementing product routes and middleware for user creation. 7:53:35 - Integrating API endpoint for product creation in the front end. 7:58:26 - Implementing success alerts and handling product uploads in the MERN app. 8:00:41 - Creating subcategories and linking products in the MERN app. 8:05:49 - Overview of adding product details in the MERN app. 8:07:58 - Debugging product submission in the MERN app. 8:12:27 - Managing button functionality and product uploads in the MERN app. 8:14:52 - Demonstrating product creation in the MERN app with various details. 8:19:16 - Successfully uploads and manages product data in the application. 8:21:27 - Implementing product controller with error handling and pagination in MERN app. 8:25:53 - Implementing pagination and search functionality in MERN app. 8:28:12 - Creating text indexes in MongoDB for efficient product search. 8:32:43 - Implementing pagination and product retrieval in the MERN app. 8:34:58 - Implementation of product fetching in MERN Full Stack application. 8:39:29 - Troubleshooting product display issues in MERN app. 8:42:08 - Debugging and fixing backend errors in the Full Stack Blinkit Clone. 8:46:29 - Implementing product loading and display in a MERN app. 8:48:44 - Implementing product display in the MERN app with image handling. 8:53:19 - Adjusting product display layout for different screen sizes in Admin component. 8:55:40 - Overview of product display customization in the MERN app. 9:00:09 - Implementing pagination with current and total page display. 9:02:20 - Implementing pagination controls for a product list. 9:06:49 - Implemented pagination and search functionality for the product page. 9:09:09 - Adjusting styles and adding search functionality in a React component. 9:14:08 - Implementing a stateful search feature using React. 9:16:35 - Implementing dynamic search functionality with pagination in the MERN app. 9:21:21 - Implementing debouncing improves API call efficiency during search. 9:23:42 - Designing the layout for categories and products in the app.
Timestamps: 00:04 - Create and manage categories and subcategories in the MERN app. 02:11 - Overview of product management features in the MERN Blinkit clone. 07:26 - Creating category, subcategory, and product pages in a MERN app. 10:24 - Creating categories and subcategories with product upload functionality. 16:11 - Implementing a category addition feature in the MERN app. 18:41 - Implementing a modal for uploading categories in a MERN app. 23:31 - Creating a modal for category input with image and name. 25:44 - Creating a category form in the MERN app. 30:27 - Styling category input fields with borders and margins. 32:54 - Creating a responsive image upload form with Flexbox and Grid. 37:57 - Adding and validating category names with dynamic button states. 40:22 - Implementing form handling and file upload in the MERN app. 44:54 - Implementing image upload and category management in the MERN App. 47:14 - Error handling during user data submission in a MERN app. 52:17 - Creating category routes in a MERN application. 54:49 - Troubleshooting and implementing category routes in a MERN application. 59:55 - Implementing image upload functionality in a MERN application. 1:02:33 - Uploading multiple images for categories and products in a MERN app. 1:07:37 - Implementing image upload functionality in a Full Stack Blinkit Clone. 1:10:05 - Debugging image upload functionality in category creation. 1:14:53 - Discusses uploading images and handling responses in a MERN app. 1:17:17 - Updating and displaying images in the MERN application. 1:22:26 - Button activation depends on category name and image availability. 1:25:04 - Implementing API call with loading state in category submission. 1:29:51 - Implemented category management with pagination in the Blinkit clone. 1:32:10 - Implementing category fetching in a MERN stack application. 1:37:00 - Debugging loading state and handling category data in the MERN app. 1:39:28 - Implementing a no-data display component in a MERN app. 1:44:20 - Implementing category data retrieval in the MERN app. 1:46:45 - Displaying category images with specific attributes in the MERN app. 1:51:34 - Demonstrates category addition and display in a MERN app. 1:53:51 - Adjusting dashboard layout and product display settings. 1:59:12 - Responsive design for displaying categories on different devices. 2:01:29 - Handling category updates and error responses in MERN app. 2:06:23 - Enhancing product display and button functionality in the MERN app. 2:08:56 - Customizing button styles and colors for the MERN app. 2:13:42 - Updating the UI for editing categories in a MERN app. 2:16:11 - Resolving errors and implementing image upload functionality. 2:21:11 - Implementing category management features in the MERN Blinkit clone. 2:23:34 - Implementing image upload with loading state in the MERN app. 2:28:16 - Managing categories and subcategories in a MERN app. 2:30:38 - Check the existence of categories and products in the MERN app. 2:35:41 - Implementing a delete feature with confirmation dialog in a MERN app. 2:38:29 - Implement deletion confirmation functionality for categories in the MERN app. 2:43:25 - Creating a delete confirmation modal with buttons. 2:46:02 - Styling a Confirmation Box with Flex and Colors 2:50:41 - Implementing category deletion with error handling in the MERN app. 2:53:17 - Managing categories through addition and deletion in the app. 2:57:55 - Implementing user role management in the dashboard using Redux. 3:00:14 - Managing admin user roles and navigation in a MERN app. 3:05:01 - User role-based display logic for admin in the application. 3:07:25 - Implement admin user access control for protected pages. 3:12:15 - Developing the subcategory section for the MERN app. 3:14:37 - Handling React errors and implementing subcategory upload feature. 3:19:04 - Designing the subcategory upload section with responsive layout. 3:21:19 - Creating a subcategory input form with styling. 3:26:09 - Implementing image upload and display for subcategories in a MERN app. 3:28:38 - Building a form to manage subcategory data in a MERN app. 3:33:20 - Designing mobile and desktop layouts for the upload image button. 3:35:45 - Creating a responsive button with dynamic color and image upload. 3:40:17 - Manage category and subcategory image uploads in MERN app. 3:42:31 - Implementing subcategory addition with proper selection and design. 3:47:00 - Implementing category selection with a transparent background. 3:49:13 - Creating a Redux slice for managing categories and products in the admin panel. 3:53:45 - Demonstrates Redux setup for managing product categories. 3:56:00 - Implementing Redux store and dispatching category data. 4:00:41 - Implementing category data management in a full-stack MERN app. 4:02:59 - Implementing category selection with option tags and unique IDs. 4:07:40 - Displaying and managing selected categories in the MERN application. 4:09:46 - Enhancing user interface with borders and chips in the MERN app. 4:14:19 - Demonstrating category removal functionality in a MERN app. 4:16:42 - Demonstrates deleting and managing subcategory data in a MERN app. 4:21:23 - Creating and saving subcategory data in MongoDB. 4:23:43 - Managing subcategory data and dynamic background color changes. 4:28:12 - Error handling for missing subcategory details in the MERN app. 4:30:30 - Saving subcategory data in MongoDB with appropriate response handling. 4:35:07 - Setting up and creating a subcategory endpoint in MERN app. 4:37:28 - Implementing subcategory creation with error handling in a MERN app. 4:42:03 - Creating and fetching subcategories in the MERN app. 4:44:12 - Handling errors and retrieving subcategory data from MongoDB. 4:48:53 - Managing API data and loading state in a React app. 4:51:13 - Installing and using TanStack React Table in the MERN app. 4:55:25 - Importing and configuring column helper for React Tanis. 4:57:47 - Implementing subcategory display features in the MERN app. 5:02:14 - Implementing React Table for displaying data with suitable formatting. 5:04:22 - Implementing table styling in the MERN app. 5:08:45 - Centering images using Flexbox in a MERN application. 5:11:04 - Creating a table header with serial numbers in a MERN app. 5:15:35 - Integrating image URLs and dynamic state management in the app. 5:17:56 - Implementing image URL handling in the Blinkit clone app. 5:22:15 - Implementing category display with dynamic styling in the MERN Blinkit clone. 5:24:43 - Adding edit and delete buttons to categories in the app. 5:29:11 - Updating UI elements in the MERN app with new icons and colors. 5:31:35 - Implementing edit functionality using state management in React. 5:36:11 - Implementing and updating subcategories in the MERN app. 5:38:31 - Validating and updating subcategory data in a MERN app. 5:42:59 - Updating and deleting subcategories in a MERN app. 5:45:14 - Implementing subcategory deletion with error handling in the MERN app. 5:49:57 - Implementing delete functionality in MERN app UI. 5:52:20 - Implementing deletion functionality for subcategories in a MERN app. 5:57:03 - Debugging delete functionality for subcategories in a MERN app. 5:59:38 - Enhanced responsiveness for category and subcategory sections.
39:16
Hi please could someone help me? When i try to connect my server to mongodb it sends me an error: could not connect to any server in your mongodb server. I thought it was a ip address but it not worked
can you share the error message
@@DynamicCodingwithAmit MongooseServerSelectionError: Could not connect to any servers in your MongoDB Atlas cluster. One common reason is that you're trying to access the database from an IP that isn't whitelisted
You can add the ip address in the mongodb wishlist
@@DynamicCodingwithAmit yes i did it also added the allow access from anywhere but i have the same error.
hi for those who have had the same error just install install mongoose@8.5.2
the tutorial was totally good, so can you add the varieties of products like colors of the products and specs of the products so as user may need to select
Sure I will do this, upcoming project
@DynamicCodingwithAmit I'll love to learn that, as it now a popular features for most ecommerce
error: { statusCode: 400, message: 'The associated domain with your API key is not verified. Please, create a new API key with full access or with a verified domain.', name: 'validation_error' } when i click on the send otp button this error comes in my terminal section. Ye error ka solution kya he
You can create your api for resend to send email, and for testing purpose resend provided email id, you test by same email which you have login, If you want to your custom email you need to connect your domain
@@DynamicCodingwithAmit thanks
PLEASE MAKE TUTORIAL UNTIL DEPLOYMENT ON VERCEL
sure i will do it
Thank you for this wonderful content. I appreciate this huge project.
Glad you enjoy it!
Thank you bro, how many videos are there still
3 more for including deployment