https://github.com/ersync/coffeeshop-responsive-website
Responsive coffee shop website with Tailwind CSS and JavaScript
https://github.com/ersync/coffeeshop-responsive-website
coffee-shop responsive-layout tailwindcss
Last synced: 8 months ago
JSON representation
Responsive coffee shop website with Tailwind CSS and JavaScript
- Host: GitHub
- URL: https://github.com/ersync/coffeeshop-responsive-website
- Owner: ersync
- Created: 2023-10-14T12:25:08.000Z (over 2 years ago)
- Default Branch: main
- Last Pushed: 2025-01-02T14:34:32.000Z (over 1 year ago)
- Last Synced: 2025-10-28T22:48:30.591Z (8 months ago)
- Topics: coffee-shop, responsive-layout, tailwindcss
- Language: HTML
- Homepage: https://coffeeshop.emadrahimi.dev
- Size: 2.58 MB
- Stars: 0
- Watchers: 1
- Forks: 1
- Open Issues: 0
-
Metadata Files:
- Readme: README.md
Awesome Lists containing this project
README
# Coffee Shop Website
A sleek and modern static coffee shop website in Persian, featuring responsive layouts, dark mode, and engaging animations. This frontend implementation demonstrates the visual and interactive aspects of a coffee shop's online presence.
## ✨ Features
- 📱 **Responsive Design**: Optimized for all screen sizes
- 🌓 **Dark Mode**: Seamless light/dark theme switching
- 🎨 **Custom Animations**: Smooth and captivating effects
- 🖼️ **Image Sliders**: Interactive visual displays powered by Swiper.js
## 🛠️ Tech Stack
- **HTML5**: Accessible, semantic markup
- **Tailwind CSS**: Utility-first CSS framework for rapid styling
- **JavaScript**: Added interactivity and smooth animations
- **Swiper.js**: High-performance image sliders
## 🏗️ Getting Started
### Prerequisites
Ensure the following tools are installed on your system:
- **Node.js**: Version 14 or later
- **npm** or **yarn**: For managing dependencies
### Installation
1. **Clone the Repository**
```bash
git clone https://github.com/ersync/coffeeshop-responsive-website.git
cd coffeeshop-responsive-website
```
2. **Install Dependencies**
```bash
npm install
```
3. **Start the Development Server**
```bash
npm run dev
```
4. **View the Website**
Open your browser and navigate to: [http://localhost:3000](http://localhost:3000)
> **Note**: Do not open `index.html` directly; use the development server for proper functionality.
## 📚 Acknowledgments
This project leverages the following technologies and resources:
- [Tailwind CSS](https://tailwindcss.com/)
- [Swiper.js](https://swiperjs.com/)
## 📄 License
This project is open source and available under the [MIT License](LICENSE).