Skip to content

Latest commit

 

History

History
111 lines (82 loc) · 4.01 KB

README.md

File metadata and controls

111 lines (82 loc) · 4.01 KB
Raw

Car Showroom

Description

Car Showroom is a modern, responsive web application showcasing a diverse collection of vehicles. Built with Next.js 14.0.4, this platform offers an immersive browsing experience for car enthusiasts and potential buyers. The application fetches real-time data from an external API, ensuring up-to-date information on various car models, specifications, and pricing. With its sleek design and efficient performance, Car Showroom demonstrates the power of server-side rendering and the latest web technologies in creating engaging automotive showcases.

Website

https://car-showroom-coral.vercel.app/

Topics

nextjs react typescript car-catalog api-integration server-side-rendering responsive-design automotive-industry user-interface

Table of Contents

  1. Introduction
  2. Features
  3. Technologies Used
  4. Getting Started
  5. Usage
  6. API Integration
  7. Deployment
  8. Contributing
  9. License
  10. Acknowledgements

Installation

Follow these steps to set up the project locally:

  1. Clone the repository

    git clone https://github.com/yusrilprayoga-code/car-showroom.git
cd car-showroom

  2. Install dependencies

    npm install

  3. Set up environment variables Create a .env.local file in the root directory and add your API key:

    API_KEY=your_api_key_here

  4. Run the development server

    npm run dev

Your Car Showroom application should now be running at http://localhost:3000.

Usage

To use the Car Showroom website:

  1. Browse Cars:

    • Navigate through the homepage to see featured cars.
    • Use the search bar to find specific models or brands.

  2. View Details:

    • Click on a car card to view detailed specifications.
    • Explore high-quality images, performance stats, and pricing information.

  3. Filter Options:

    • Use the sidebar filters to narrow down your search by make, model, year, or price range.

  4. Compare Models:

    • Select multiple cars to compare their features side by side.

  5. Responsive Design:

    • Enjoy a seamless experience across desktop, tablet, and mobile devices.

Credits

This project leverages the following technologies and resources:

  • Next.js 14.0.4 - The React framework for production
  • React - A JavaScript library for building user interfaces
  • TypeScript - Typed superset of JavaScript
  • Tailwind CSS - A utility-first CSS framework
  • [Car Data API] - Using Rapid-Api

Special thanks to the open-source community and all contributors who have helped shape this project.

License

This project is licensed under the MIT License. See the LICENSE file for details.

MIT License

Copyright (c) 2024 [Car-Showroom]

Permission is hereby granted, free of charge, to any person obtaining a copy of this software and associated documentation files (the "Software"), to deal in the Software without restriction, including without limitation the rights to use, copy, modify, merge, publish, distribute, sublicense, and/or sell copies of the Software, and to permit persons to whom the Software is furnished to do so, subject to the following conditions:

The above copyright notice and this permission notice shall be included in all copies or substantial portions of the Software.

THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY, FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM, OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE SOFTWARE.