Previews
--Landing page--
--Index page with 2nd screen shot--
--shopping page--
--cart page--
#store
Yo! Check out my E-commerce Website with Tailwind CSS!
This repo holds a simple e-commerce website built with the power of Tailwind CSS. We're talking multi-page goodness, with:
index.html: Your main landing zone showcasing products.
shopping.html: Dive deeper into product details with images and descriptions.
cart.html: Keep track of your shopping spree with a dedicated cart page.
styles.css: This file only contains tailwind css importing
---We have used Vite to develop the website---
Built with:
HTML5 & CSS3 for the basics
Tailwind CSS for a rapid styling boost
JavaScript (ES6) for some interactive magic
Features you'll love:
Responsive design that looks good on any screen size.
Product cards with everything you need: image, title, description, and price.
Add to-cart functionality for a smooth shopping experience.
A static website, no database connections needed.
There is an array of objects with the name item which contains information about products -Feel free to add and remove items on basis of your need.
Getting started:
Clone the repo: Just like downloading a file, but cooler.
Open it up: Use your favorite code editor or IDE.
Install the essentials: Like tailwindcss and vite.
--Do the basic setup that is needed to run the tailwindcss project--
Let's go ahead and see it live: Open index.html in your browser.
Note: While developing the website tailwindcss and postcss were used and vite to preview.
Running it:
Open a terminal: Think of it as a command center.
Run a server: This makes the website accessible within your browser.
Go to http://localhost:[port provided by your vite]: Bam! Your website is live.
Make it your own:
Tweak the code to your liking. Make it unique!
Swap out the placeholder image with your own product pics.
Join the conversation:
Found a bug or have an amazing idea? Open an issue or send a pull request on GitHub. Let's collaborate!
Go ahead, explore, and build something awesome!