Skip to content

Car-Shastra🚘 is Car Rental App using the latest web technologies! In this step-by-step video, we'll guide you through building a dynamic and user-friendly car rental platform using React, Tailwind CSS, GraphQL, HyGraph, TypeScript, and the exciting Next.js 13 framework.

Notifications You must be signed in to change notification settings

sanskargouchandra/Car-Shastra

Repository files navigation

logo

Car-Shastra with NEXT.JS!

Car-Shastra🚘 is Car Rental App using the latest web technologies! In this step-by-step video, we'll guide you through building a dynamic and user-friendly car rental platform using React, Tailwind CSS, GraphQL, HyGraph, TypeScript, and the exciting Next.js 13 framework.

🌟 About the Project

📷 Demo Video


CarShastra.mp4
## LIVE DEMO 💥

forthebadge forthebadge forthebadge

🌟 Overview

Welcome to our Car Rental App using the latest web technologies! It is user-friendly car rental platform using React, Tailwind CSS, GraphQL, HyGraph, TypeScript, and the exciting Next.js 13 framework.


We Coverthe above topic "Build NextJs Car Rental App using React, Tailwind CSS, GraphQL, HyGraph, Typescript, NextJs 13":
Car-Shastra app using Next.js, React, Tailwind CSS, GraphQL, HyGraph, and TypeScript. We will start by setting up our project and installing the necessary dependencies. Then, we will create our GraphQL schema and API. Next, we will build our React components and connect them to our GraphQL API. Finally, we will style our app using Tailwind CSS.

👾 Technologies and Frameworks

-User Authentication and Management: Powered by Clerk, CarRental ensures secure user authentication and hassle-free user management, allowing users to create accounts, log in, and manage their profiles effortlessly.

-Interactive Car Search: Users can conveniently search for available cars using filters for price range and company name, making it easier to find the perfect vehicle for their needs.

-Detailed Car Information: Each car listing provides images and essential details, enabling users to make informed decisions before proceeding with a booking.

-Transparent Pricing: CarRental displays the price per kilometer for each vehicle, ensuring users have a clear understanding of the cost structure.

-Effortless Booking Process: Users can book their chosen car by providing pickup and drop-off locations, streamlining the booking process.

⚙️ Installation

🧰 Getting Started

‼️ Prerequisites

  • Create HyGraph account HERE

Follow these steps to install and run the project:
  1. Clone the repository

    Open your terminal and run the following command to clone the repository:

    https://github.com/sanskargouchandra/Car-Shastra.git
  2. Navigate to the project directory

    cd Chat-Shastra
  3. Install Node.js

    The project requires Node.js to run. If you don't have it installed, you can download it from here.

  4. Install the required packages

    The project requires several packages to be installed. Run the following command to install them:

    npm i
  5. Install the required fonts

    The project requires the "font-inter" and "font-spaceGrotesk" fonts to be available. You can download them from Google Fonts.

  6. Set up the environment variables

    Create .env.local file in fail folder

    NEXT_PUBLIC_CLERK_PUBLISHABLE_KEY=****
    CLERK_SECRET_KEY=****
  7. Start the server

    Run the following command to start the server:

    npm run start

Now, you should be able to access the project at http://localhost:3000.


Don't forget to leave a star ⭐️

About

Car-Shastra🚘 is Car Rental App using the latest web technologies! In this step-by-step video, we'll guide you through building a dynamic and user-friendly car rental platform using React, Tailwind CSS, GraphQL, HyGraph, TypeScript, and the exciting Next.js 13 framework.

Topics

Resources

Stars

Watchers

Forks

Releases

No releases published

Packages

No packages published