Taylor Swift Archive

An interactive and responsive archive of Taylor Swift interviews.

👉 Live demo here

Browse and filter by era, type of content, or interviewer. Each era has its own color palette, and each entry displays a link and summary. Optimized for both desktop and mobile.

---

✨ Features

• Filter by era, type, and interviewer
• Responsive design (mobile-first)
• Unique color palettes for each era
• Direct links + short summaries
• Simple, static setup (HTML/CSS/JS only)

---

🗂 Project structure

taylorSwiftArchive/
├─ assets/
│  └─ icons/             # Favicons and PWA icons
│     ├─ android-chrome-192x192.png
│     ├─ android-chrome-512x512.png
│     ├─ apple-touch-icon.png
│     ├─ favicon-16x16.png
│     ├─ favicon-32x32.png
│     ├─ favicon.ico
│     └─ site.webmanifest
├─ dataTaylor.json       # Interviews database
├─ index.html            # Main page
├─ style.css             # Styles and era color palettes
├─ script.js             # Filtering and rendering logic
└─ README.md             # Project documentation

---

🚀 Running locally

This is a static app — no build tools or dependencies required.

1. Clone the repository:

   git clone https://github.com/Alonsojrr14/taylorSwiftArchive.git
   cd taylorSwiftArchive

2. Open index.html in your browser or serve it locally:

   # With Python 3
   python -m http.server 5173
   # then go to http://localhost:5173

---

🧾 Data format (dataTaylor.json)

The archive uses JSON entries to describe each interview. Example:

{
  "title": "XYZ Radio Interview",
  "date": "2023-10-21",
  "era": "Midnights",
  "type": "Radio Interview",
  "interviewer": "Jane Doe",
  "summary": "Taylor discusses creative process and behind-the-scenes of the album.",
  "link": "https://example.com/interview",
  "thumbnail": "https://example.com/cover.jpg"
}

Tips

• Keep era names consistent (Fearless (TV), 1989 (TV), Midnights, etc.)
• Use ISO dates: YYYY-MM-DD
• Summaries: 1–2 sentences max
• Make sure all links are valid
• Prefer lightweight images for thumbnail (≤ 200 KB)

---

🔎 How it works

• script.js loads dataTaylor.json, renders the list, and applies filters in memory
• style.css defines era-based colors and responsive rules
• index.html provides structure and UI elements for filtering

---

🧰 Roadmap (ideas)

• Text search (title & summary)
• Badges/tags for era and type
• Sorting by date (newest/oldest)
• Counters per filter (e.g. number of interviews per era)
• Pagination or lazy loading
• Manual dark mode

---

🤝 Contributing

Contributions are welcome!

1. Open an issue describing your idea
2. Fork and create a branch:

   git checkout -b feat/your-feature

3. Submit a PR with a clear description

---

📄 License

Add a license of your choice (e.g., MIT).
If using MIT, create a LICENSE file at the root.

---

⚠️ Disclaimer

This project is a fan-made archive of Taylor Swift interviews, not affiliated with or endorsed by Taylor Swift or her team.
Respect copyright and original sources.

---

🙌 Credits

Created by @Alonsojrr14.
Thanks to the original sources of interviews and content referenced.

📚 Data Source

The interview archive is based on the community-maintained spreadsheet:
Original Google Sheet

Special thanks to the contributors who compiled and organized this information.