This is the landing page for a coffee shop website called "Brewista" built using Next.js, a React framework for server-side rendering (SSR) and static site generation (SSG). The landing page includes a visually appealing hero section, featured products, and information about the coffee shop.
Demo.mp4
- Hero Section: A stunning hero section with a large image, descriptive text, and additional smaller images showcasing the coffee shop's offerings and values.
- Featured Products: A section highlighting some of Brewista's popular or recommended products.
- About Section: A brief section providing information about Brewista's history, values, and the team behind it.
- Responsive Design: The landing page is designed to be fully responsive and optimized for various screen sizes and devices.
- Tailwind CSS: The website uses the Tailwind CSS utility-first framework for styling.
- Next.js: A React framework for building server-side rendered and static websites.
- React: A JavaScript library for building user interfaces.
- Tailwind CSS: A utility-first CSS framework for rapidly building custom user interfaces.
- next/image: An optimization module from Next.js for optimizing and serving images efficiently.
- Axios: A promise-based HTTP client for making API requests from the browser or Node.js.
To run the project locally, follow these steps:
- Clone the repository:
git clone https://github.com/your-username/brewista.git - Navigate to the project directory:
cd brewista - Install dependencies:
npm install - Start the development server:
npm run dev - Open your browser and visit
http://localhost:3000to see the Brewista landing page.
This landing page can be easily deployed to Vercel, a hosting platform designed specifically for Next.js applications. Vercel provides a seamless deployment process and supports features like serverless functions, static site generation, and more.
To deploy the Brewista landing page to Vercel, follow these steps:
- Sign up for a Vercel account if you don't have one already.
- Install the Vercel CLI by running
npm install -g vercelin your terminal. - Navigate to your project directory:
cd brewista - Initialize a new Vercel project by running
vercel init - When prompted, choose the appropriate settings for your project, such as the project name, root directory, and build command.
- After the initialization process is complete, deploy your project by running
vercel - Vercel will provide you with a deployment URL where you can access your landing page.
For more detailed instructions and advanced deployment options, refer to the Vercel documentation.
Contributions are welcome! If you find any issues or have suggestions for improvements, please open an issue or submit a pull request.
This project is licensed under the MIT License.