E-Commerce Store

Welcome to STORE, your ultimate fashion destination! 🛒 We've got something for everyone, from trendy Ethnic Wear to comfy Sleep & Lounge Wear. 📦 It's as easy as pie to add your favorite items to your cart and breeze through checkout with Stripe 💳. Need a closer look? Our quick preview modal has you covered. 🔍 Plus, we'll suggest some fabulous finds on each product page. Happy shopping with a smile at STORE! 😊

📜 Table of Contents

• 🚀 Live Demo
• 🖼️ Project Screenshots
• 💡 Key Features
• 🛠️ Installation & Set Up
• 🏭 Building & Running for Production
• 🌱 Environment Variables
• 💻 Tech Stack
• 🍰 Contribution Guidelines
• 📝 Creating a Pull Request
• 💖 Like my work?

🚀 Live Demo

Immerse yourself in its design and functionality with an interactive live demo — simply click the link to explore.

Live Preview ➡️ Demo

🖼️ Project Screenshots

Feel free to check out the screenshots of my website for a sneak peek into its captivating user interface.

⬅️ Home ➡️

⬅️ By Category ➡️

⬅️ By Product ➡️

⬅️ Preview Modal ➡️

⬅️ Cart ➡️

💡 Key Features

Here are some of the standout features of the project:

• Trendy Fashion Selection 👗: Explore a variety of fashion categories, from Ethnic Wear to Sleep & Lounge Wear, to suit your fashion needs.

• Effortless Shopping 🛍️: Easily add your favorite fashion items to your cart and breeze through checkout with Stripe for secure payments 💳.

• Product Sorting by Size and Color 🎨: Enjoy the convenience of sorting products within each category based on size and color preferences, ensuring you find the perfect fit and style.

• Individual Product Pages 📄: Dive into the details of each product by viewing dedicated individual product pages, complete with product descriptions, pricing, and sizing/color options.

• Related Items 🧥: Discover complementary fashion items below each product, helping you complete your stylish look effortlessly.

• Quick Preview Modal 🔍: Get a closer look at fashion items with our convenient quick preview modal, ensuring you make the perfect choice.

• Personalized Recommendations 🎁: Receive personalized fashion suggestions on each product page, making your shopping experience even more delightful.

• User-Friendly Interface 💻: Enjoy a user-friendly and visually appealing interface designed to enhance your shopping experience.

Visit STORE today and redefine your fashion journey!

🛠️ Installation & Set Up

1. Clone the repository:

git clone https://github.com/kranthikumarkaranam/e-commerce_store.git

2. Go to the project directory:

cd e-commerce_store

3. Install dependencies using npm:

npm install

4. Start the development server:

Before starting the server add these env variables.

npm run dev

🏭 Building & Running for Production

1. Generate a full static production build:

npm run build

2. Preview the site as it will appear once deployed:

npm run start

🌱 Environment Variables

To run this project, you need to add the following environment variables to your .env file in the project's root directory.

Also, feel free to take a look at the .env.example file here.

• NEXT_PUBLIC_API_URL

💻 Tech Stack

Technologies used in the project:

• React.js
• NEXT.js
• TypeScript
• Tailwind CSS
• react-hot-toast
• shadcn/ui
• Radix UI
• Headless UI
• react-spinners
• axios
• Stripe
• zustand
• date-fns
• query-string

🍰 Contribution Guidelines

Contributions are what make the open source community such an amazing place to be learn, inspire, and create. Any contributions you make are greatly appreciated.

• See Contributing for ways to get started.
• If you have suggestions for adding or removing projects, feel free to open an issue to discuss it, or directly create a pull request by following the guidelines here.
• Please make sure you check your spelling and grammar.
• Create individual PR for each suggestion.
• Also, please read through the Code of Conduct before posting your first idea as well.

📝 Creating a Pull Request

Follow the steps below to Initiate a Pull Request

1. Fork the repository
2. Create your Feature Branch (git checkout -b feature/AmazingFeature)
3. Commit your Changes (git commit -m 'Add some AmazingFeature')
4. Push to the Branch (git push origin feature/AmazingFeature)
5. Open a Pull Request

💖 Like my work?

Thank you for taking the time to explore the project. I hope it brings value and joy to those who use it.

If you require any help or have any questions, please don't hesitate to reach out to me here.

Made with ❤️ by KRANTHI.