How to Build TypeScript MERN ECommerce Website Like Amazon For Beginners [2023]
If you’ve ever wanted to build an eCommerce website like Amazon, but don’t know where to start, you’re in the right place. In this article, we’ll go through the process of building a TypeScript MERN (MongoDB, Express, React, Node.js) eCommerce website, perfect for beginners who want to dive into the world of web development.
Why TypeScript and MERN stack?
TypeScript is a superset of JavaScript that adds static typing to the language. It’s a powerful tool for building scalable and maintainable applications, and it’s becoming increasingly popular in the web development community. The MERN stack, on the other hand, is a set of technologies that work seamlessly together for building full-stack web applications. MongoDB is a NoSQL database, Express is a web framework for Node.js, React is a front-end library for building user interfaces, and Node.js is a back-end runtime environment. Together, they provide a robust and efficient framework for building eCommerce websites.
Getting started with TypeScript and MERN stack
To get started with building a TypeScript MERN eCommerce website, you’ll need to have a basic understanding of HTML, CSS, and JavaScript. You’ll also need to have Node.js and MongoDB installed on your machine. Once you have these prerequisites in place, you can start by setting up your project and installing the necessary dependencies.
Building the eCommerce website
Once you have your project set up, you can start building the eCommerce website. You’ll need to create a database schema for your products, implement user authentication and authorization, and set up a payment gateway. You’ll also need to create a user interface for your website using React, and integrate it with the back-end using Express and Node.js.
Conclusion
Building a TypeScript MERN eCommerce website like Amazon is a challenging but rewarding endeavor. It requires a good understanding of web development, as well as the ability to work with a variety of technologies. However, with the right guidance and a bit of patience, anyone can build their own eCommerce website from scratch. Good luck!
is this full finished project or we should buy something to finish it ?
How can I connect to mongodb locally ?through compass, i reach to lesson 15 and when i changed the mogodb url to my locally I can’t see the products but I connected to the my compass
Hello Basir. Thank you for the lecture. Your note was very helpful and i was able to compare the code. Looking forward to your next lecture sir. All the best..
Hi I want to build multivendor marketplace e-commerce website do you any course like that?
❤❤
Thanks sir
Amazing project
I watching u I from Iran 🌹
Really Great Features, Thank you Basir!
Que buen stack MERN, aunque no se mucho ingles pero es como que entiendo de lo que habla, saludos desde Argentina, buen material amigo
Please upload next part..
Sir, if I buy the course, do I get all the videos you sell? please answer quickly, I really need it
Thanks! 🙂
excellent teaching
Hello Basir jan 🙂
First of all thank you very much for your great course on amazon clone with MERN. I also bought your complete course, finished it and learnt a lot.
I'm doing at the moment a web development bootcamp and picking ideas for my MERN project from your cours.
In your introduction Video you showed the Website with some functionality, which at the end of the course, our end code don't include them like Admin Dashboard, writing reviews on ProductPage and so much more.
In the last lesson (33) you mentioned that we'll continue newer stuff in next lessons. So i assume that there are more lessons.
I would love to watch other lessons, if you recorded them or at least haveing acces to the complete github files. Because the one github link, that you put in the description also doesn't include the whole code for Admin Dashboard and etc.
Have a good day
Kourosh
thank you will never be enough. You are a great teacher and explainer. most of the people just make a project and never updates but you are such an exception. thank you for putting your time and effort to make a project with latest technology. dont stop uploading and updating. Your content really helps a lot of beginners like me. ❣
in our initial state: const initialState: AppState = {
mode: localStorage.getItem("mode")
? localStorage.getItem("mode")!
: window.matchMedia &&
window.matchMedia("(prefers-color-scheme: dark)").matches
? "dark"
: "light", it seems it checks to see if window has a prefers-color-scheme: dark and sets it to dark but my question is where is window set to have prefers-color-scheme: dark as none of our css files have that. I'm talking strictly about our initial state before any toggle of theme, because if i want to log out and i have light mode it logs out to dark mode, if i log in and i'm in light mode, refresh the page , i'm still logged in but now it's on dark mode.
this channel what i am supposed to see.
BTW this video use monggodb or monggo atlas?
Thank you for the first section of this tutorial. I am preparing of the full course.
But when deploying, it continue to give errors by pointing out some unused codes. How do i go by this please
omg, I had an error because of
export const useGetProductsQuery = () => {
useQuery({
……
}
instead of
export const useGetProductsQuery = () =>
useQuery({
freaking curly brackets…
Sir, can you insist on using nextjs JavaScript instead of typescript, with login search details page and thumbnail binding colors and size😀
1:19:53 ThanKS
Nice course sar