Skip to content

README.en.md

Latest commit

 

History

History
80 lines (62 loc) · 3.48 KB

README.en.md

File metadata and controls

80 lines (62 loc) · 3.48 KB

🎸 GigTracker (EN)

🌎 Languages:
🇧🇷 Português | 🇺🇸 English

Welcome to GigTracker, an interactive catalog of bands I’ve already seen live and those I still dream of seeing on stage! This personal project allows you to explore, search, and filter band cards, with direct access to each band’s Spotify and YouTube.

This project was developed entirely by me, Piter Gomes, as part of my personal portfolio to showcase skills in JavaScript, HTML, CSS, DOM manipulation, JSON usage, as well as responsive UX/UI principles and clean code best practices.

🔗 Access Here

🚀 Features

  • 🎧 Dynamic Search: Filter bands by name, music genre, and country of origin.
  • 🔃 Smart Sorting: Sort by name, genre, or country, in ascending or descending order.
  • 🎛️ Interactive Filters: Unique styles and locations are automatically detected.
  • 🌙 Theme Toggle: Light/dark mode with preference saved in the browser.
  • 🔗 Direct Links: Quick access to each band’s YouTube and Spotify.
  • 📡 Last.fm: Integration to display what I’m currently listening to.

🛠️ Technologies Used

  • HTML5 + CSS3
  • JavaScript (Pure/Vanilla)
  • Font Awesome (social and music icons)
  • Integration with Last.fm API Widget
  • Data structure in JSON
  • LocalStorage for light/dark theme persistence

📁 Project Structure

gigtracker/
│
├── index.html            # Main page
├── style.css             # Visual styles
├── script.js             # Logic and interactivity for index.html
├── bandas.json           # Band data for index.html
├── wishlist.html         # Desired bands list
├── wishlist.js           # Logic and interactivity for wishlist.html
├── bandas-wishlist.json  # Band data for wishlist.html
├── imagens/              # Images and favicon

🔧 How to Run Locally

  1. Clone the repository: 
    git clone https://github.com/pitercoding/gigtracker.git
cd gigtracker
  2. Open the index.html file in your favorite browser (double-click it or use a local server such as Live Server in VS Code).

🧠 Possible future improvements

As a project in constant evolution, there are several ideas for improvements for future versions. If you have any, feel free to collaborate:

  • Favorite bands and save to localStorage
  • Manual band addition form
  • Local persistence: save custom user bands in localStorage
  • Integration with real APIs, such as:
  • Create an interactive Wishlist with a curation system
  • Details page with automatic band biography
  • Addition of other filters
  • List or grid display modes
  • Internationalization (i18n) with translation to other languages

📜 License

This project is under the MIT license.

🧑‍💻 Author

Piter Gomes — Computer Science Student (4th Semester) & Full-Stack Developer

📧 Email | 💼 LinkedIn | 💻 GitHub | 🌐 Portfolio