Skip to content

PhyuSinKhantAung/cocktails

Repository files navigation

Cocktails Explorer

Welcome to Cocktails Explorer, your ultimate destination for exploring a wide variety of cocktails! This project, built with Next.js and leveraging app router, allows users to discover and learn about different cocktails sourced from an external free cocktails API.

Features

  • Next.js Application: Cocktails Explorer is developed as a Next.js application, providing server-side rendering and seamless navigation between pages using app router.
  • External API Integration: The project utilizes an external free cocktails API to fetch and display cocktail data, including names, ingredients, instructions, and images.
  • Search Functionality: Users can search for cocktails by their names, making it easy to find specific drinks of interest.
  • Cocktail Details: Users can view detailed information about each cocktail, including its ingredients, instructions for preparation, and a visually appealing image.
  • Responsive Design: The application is designed to be responsive, ensuring a consistent and enjoyable experience across various devices and screen sizes.

Technologies Used

  • Next.js: A React framework for building server-side rendered and statically generated applications.
  • External Cocktails API: An external free cocktails API is integrated with the project to fetch cocktail data.
  • App Router: Next.js's built-in router is utilized for client-side routing, enabling smooth navigation between different cocktail pages.
  • React: The project is built using React, providing a robust and efficient frontend development environment.
  • CSS: Styling is done using TailwindCSS to ensure a visually appealing and user-friendly interface.

Getting Started

To get started with Cocktails Explorer, follow these steps:

  1. Clone the Repository: Clone this repository to your local machine using git clone https://github.com/your/repository.git.

  2. Install Dependencies: Navigate to the project directory and install dependencies using npm install.

  3. Run the Application: Start the application using npm run dev. Ensure that the Next.js server is running and accessible.

  4. Explore Cocktails: Access the platform via the provided URL or localhost address, and start exploring the wide variety of cocktails available!

Contributing

Contributions are welcome! If you'd like to contribute to the development of Cocktails Explorer, please follow these guidelines:

  • Fork the repository and create a new branch for your feature or bug fix.
  • Commit your changes with descriptive commit messages.
  • Submit a pull request detailing the changes you've made and the problem or feature it addresses.

Releases

No releases published

Packages

No packages published