Bandpage
This is a small HTML / CSS / JS bandpage which displays information about a band and a store to buy merchandise.
General Information
- The aim for this beginner project was to connect HTML / CSS and JS to build an interactive homepage
- I wanted to get to know the logic behind building up a store with simple HTML / CSS / JS (e.g., dynamically adding items to it, calculating the price)
- This project was a nice refresher for my CSS styling skills (e.g., positioning elements with Flexbox)
Technologies Used
- HTML / CSS / JS
Features
- Displaying information about the band
- Displaying a store with the ability to select items to a cart
- Dynamically rendering the cart based on the items added to it (calculating the price)
Screenshots
Demo
Live demo here.
Setup
- Clone the repo
- Open index.html in your browser
Learnings
- How to target specific HTML elements using JS
- How to append / remove elements dynamically to / from the DOM
- Adding Event Listeners in JS to provide interactivity to a webpage
Project Status
The project is provisionally finished. I may revisit it in the future to add some more interactive features to it and enhance my JS skills
To do
- Add a feature to purchase tickets
Acknowledgements
- This project was based on this tutorial.