Full MERN Website React Nodejs w/ GraphQL Tailwind and Docker From Zero To Deployment + GIVEAWAY

Welcome to the FULL MERN STACK Beginners Course!!! This is a Full Video Course going from Zero to Hero on creating an amazingly looking Reactjs website with Tailwind CSS, styled-components, and Apollo GraphQL alongside its Node.js/Express.js Server Side app or putting together a full dedicated Car Models GraphQL API built on top of Nest.js Framework. The final steps are Dockerizing the whole Stack with MySQL Docker image and using the Nginx Rever proxy to serve the running Nodejs applications on the server. We will take the whole dockerized MERN stack application and Deploy it on a Dedicated VPS from Hostinger and this is all in one video for you to master Web Development with React.js, Apollo GraphQL, Typescript, Tailwind, Responsive Design, Node.js, Express.js, Nest.js, TypeORM, Docker, Docker Compose and VPS.
🌟🎁🎉👇🌟
➤ GIVEAWAY For Winning a 12Months VPS 2 From Hostinger:
http://www.hostg.xyz/SH75B

👉 Steps to Enter the Giveaway
1/ Subscribe to the Channel
2/ Follow Me On Twitter (For Announcing the Winner): https://twitter.com/Ipenywis
3/ Leave a Comment down below with your Twitter Handle or your Email (To Contact you)

Best Luck to Everyone 👍
🌟🎁🎉☝️🌟
➤ Grab Your Dedicated VPS Server from Hostinger Now:
➤ Use Code Promo (Coupon) Upon Checkout: CODERONE or using this Link http://www.hostg.xyz/SH75B for up to 91% Off Yearly Plans! For your next Hostinger Hosting.
⭐ Timestamps ⭐
00:00:00 Introduction and What we are going to create
00:04:45 Setting Up Frontend Project and Installing dependencies
00:19:26 Creating homepage containers and component
00:26:07 Create Responsive Navbar component
01:03:04 Create landing page Cars top section
01:30:50 Creating custom button component with Tailwind
01:40:00 Creating Booking Card with custom calendar component
02:00:24 Adding third-party calendar component for booking card
02:24:38 Add booking Steps component to landingPage
02:43:00 Adding responsivness to booking steps for mobile
02:46:40 Create Cool About Us section on landingPage
03:03:05 Creating TopCars component for showing list of cars
03:36:40 Using custom responsive carousel component for rendering car cards
03:53:47 Creating & Designing App Footer
04:50:08 Setting up Backend Server project with Nestjs
04:56:23 Setting Up TypeORM with MySQL database on Nestjs
05:09:15 Setting Up Apollo GraphQL with Nestjs
05:13:33 Create Cars Module and GraphQL Resolver
05:23:48 Creating Car entity and Fetching cars from database
05:38:42 Creating Add new Car mutation with GQL Input
05:48:00 Add validation to New Car input fields GraphQL
05:54:13 Final Project step: Binding the Frontend React App with the API
05:55:51 Setting Up Apollo GraphQL with React
06:01:43 Fetching Data from the GraphQL API
06:21:17 Creating Redux Reducer and Populating the Store with fetched cars
06:31:31 Selecting data from the Redux Store and Rendering cars
06:46:37 Adding loading spinners to topCars section
06:52:52 Deploying: Choosing the right server for your Web App
06:59:05 Setting up Hostinger VPS
07:00:55 Preparing the application for production deployment and using properly Migrations
07:15:05 Serving React App through Nodejs production server
07:19:29 Dockerizing the Backend with Node image
07:25:41 Dockerizing the Frontend with Node image
07:27:38 Creating docker-compose for full stack services
07:41:41 Adding Nginx to the stack as a Reverse Proxy running on Docker
07:49:45 Building Docker compose images for the whole app
07:52:15 Configuring Nginx as a Reverse proxy
07:57:24 Deploying to the VPS Server
08:01:45 Installing Docker Engine on the VPS Server through SSH
08:06:47 Cloning Full Project and Running it using Docker compose
08:12:19 GIVEAWAY! 12 Months Hostinger VPS for You
🧭 Watch Tutorial on Designing the website on Figma
https://youtu.be/SB3rt-cQZas

🧭 Watch Create a Modern React Login/Register Form with smooth Animations
https://youtu.be/-bll7l-BKQI

🧭 Debug React Apps Like a Pro | Master Debugging from Zero to Hero with Chrome DevTools
https://youtu.be/_rnxOD9NKAs

🧭 Master React Like Pro w/ Redux, Typescript, and GraphQL | Beginner to Advanced in React
https://youtu.be/M_Oes39FNuk

🧭 Learn Redux For Beginners | React Redux from Zero To Hero build a real-world app
https://youtu.be/_rnxOD9NKAs

🧭 Build Login/Register API Server w/ Authentication | JWT Express AUTH using Passport.JS and Sequelize
https://youtu.be/VWEJ-GhjU4U

🧭 Introduction to GraphQL with Apollo and React
https://youtu.be/eCO6MvvRhXk
⭐ You can Get the Full Web App Source Code (Frontend & Backend) w/ Docker Files from Github⭐
https://github.com/ipenywis/react-nestjs-full-web-app
🐦 Follow me on Twitter: https://twitter.com/ipenywis
💻 Github Profile: https://github.com/ipenywis
💡 My Blog: http://ipenywis.com
Made with 💗 by Coderone

Видео Full MERN Website React Nodejs w/ GraphQL Tailwind and Docker From Zero To Deployment + GIVEAWAY канала CoderOne