Parking Application - Part 2: Full-Stack Monorepo with Next.js, NestJS, GraphQL, Prisma & Tailwind

This is the continuation of the Parking application monorepo application development.

Watch Part I here:

00:00:00 Create Garage
00:34:34 List Garages with Create more slots
00:55:51 Garage Bookings
01:37:13 Booking Timeline
01:45:15 Customer Booking Page
02:10:34 Valet Application Setup
02:44:40 Pickups & Dropoffs.
03:17:14 Accept Trips
03:27:00 Valet My Trips
03:47:46 Admin Console
04:33:10 3D Scene
05:28:50 Deployment
05:45:42 Polishes

Note: The video exceeded the limit and could not be released as one video. Next time I will make the tutorial concise with better planning.

Follow me:

Technologies:

The Autospace monorepo leverages a range of modern technologies and libraries to provide a comprehensive and efficient parking management solution. Below is a breakdown of the primary technologies used in the project:

Frontend:
React: A JavaScript library for building user interfaces.
Tailwind CSS: A utility-first CSS framework for rapid UI development.
Material UI: The world's most popular React UI framework.
@tabler/icons-react: Icon set for React applications.
react-hook-form: A library for managing form state in React.
zod: TypeScript-first schema validation with static type inference.
@react-three/drei: Useful helpers for React-Three-Fiber.

Backend:
GraphQL: A query language for your API.
REST API: Standard for creating APIs using HTTP requests.
Swagger: A tool for documenting REST APIs.
Stripe: A suite of APIs for handling online payments and transactions.

Shared Libraries:
@autospace/network: Manages network requests and GraphQL code generation.
@autospace/forms: Provides reusable form components and validation using react-hook-form and Zod.
@autospace/3d: Utilizes React-Three-Fiber and Drei for 3D graphics.

Tools and Utilities:
Nx: A smart, fast, and extensible build system with first-class monorepo support.
TypeScript: A typed superset of JavaScript that compiles to plain JavaScript.
Prettier: An opinionated code formatter.
ESLint: A tool for identifying and fixing problems in JavaScript code.
Husky: A tool for managing Git hooks.

Thanks for watching. ❤️

[amirahmed]

As a software engineer of 7 years, I really admire the effort you put in these extensive tutorials. Kudos man you deserve it.

[MoizGhuman-zp]

this is mindblowing Karthick. pure industry grade app logic and scope. there's no one in your league on youtube at the moment.

just a small request, pls make a full stack tutorial with a complete in depth dive on deployment. either that be azure or aws with kubernetes and terraform, need heavylifiting on devops domain as well. thanks again man

[saibotsan]

Wonderful video once again. I really appreciate this

[shivrajnag]

Hi Karthick, would love to see a moderately complex microservices app using either Express.js or Nest.js and please add a sprinkle of BullMQ, Redis, etc

[mtdesigner]

tnx a lot bro, your works is so professional than the others at all sides, and tnx a lot, ❤you bro.

[kartikchinda]

Hey man, stumbled on to your channel and absolutely loved your videos! I'm hoping if you could make a project using Next, Turborepo, tRPC, Prisma etc but also inculcating some AWS/Firebase stuff with it (I'm really eager to learn the devops side of it all but there's no projects like that on YouTube). Great tutorial nevertheless!

[Venkatesh-vmll]

Can u tech u securely deploy in ec2 or kubernites in aws

[naveedwaddo]

Hey for the deployment on railway we have to pay some amount or is it free?

[flexcoder]

Bro can you make a website which tracks vehicle in real time using sockets, kafka.Actually I want to make a web app which can track all buses of my college and show it to all users in real time.Can you also tell about this project in breif so that I can start building it