Setting Up Your MERN App Structure: Backend with Express & Frontend with Vite + Tailwind CSS!

In this video, we’ll dive into setting up the essential MERN app structure! From creating an Express backend server to configuring a sleek frontend with Vite, React, and Tailwind CSS, follow along to build a solid foundation for your MERN eCommerce platform. Perfect for both beginners and experienced developers!

Timestamps:

00:00 - Set up the main folder structure
03:17 - Backend setup with Express folder structure
05:30 - Initiate the backend project
06:55 - Install backend packages
09:26 - Create server and start the app
17:09 - Set up client (frontend)
20:45 - Install packages
22:12 - Configure Tailwind CSS
25:27 - List of required dependencies and install

Dependencies to Install:
npm install @chakra-ui/react @emotion/react @emotion/styled @mui/icons-material @mui/material @mui/x-charts @paypal/react-paypal-js @reduxjs/toolkit @shadcn/ui @toolpad/core antd axios formik framer-motion prop-types react-helmet react-medium-image-zoom react-redux react-router-dom react-slick recharts shadcn-ui slick-carousel yup