💊 Droguería Web Clone

A fully responsive e-commerce UI clone inspired by a local pharmacy store. This project was created as part of a technical test to showcase skills in modern React development, routing, and responsive component-based UI using TailwindCSS and Vite.

It includes dynamic menus, product sliders, a mobile navigation drawer, and a custom extra product page at /item-crema-ponds beyond the scope of the original requirements.

🌐 Live Demo

👉 Try it here:
🔗 https://wilmed10.github.io/drugstore-clone/

✅ Features

• 🛒 Responsive e-commerce layout inspired by a local pharmacy.
• 📱 Mobile drawer menu with blur background and close button.
• 🔽 Dropdowns for login and city selection.
• 🔁 Product slider using keen-slider.
• 🗺️ Routing handled with React Router v6.
• 📄 Extra route: /item-crema-ponds showcasing a single product page.
• 💅 Fully styled with TailwindCSS.
• 🌙 Clean and responsive layout, optimized for all screens.

🛠️ Technologies Used

• ⚛️ React 19
• ⚡ Vite
• 🎨 TailwindCSS
• 🧭 keen-slider – For product carousels
• 🧭 React Router – Route handling
• 📦 ES Modules and modern JavaScript

🧠 What I Learned

• Creating modular components for scalable interfaces.
• Implementing dynamic and responsive navigation in React.
• Routing with React Router, including nested and extra pages.
• Using TailwindCSS to build clean UIs without writing custom CSS.
• Integrating external libraries like keen-slider seamlessly.

⚙️ Getting Started

To run the project locally:

# Clone the repository
git clone https://github.com/wilmed10/drugstore-clone

# Navigate to the project folder
cd drugstore-clone

# Install dependencies
npm install

# Start the development server
npm run dev