Theaterlog

screenshot of Theaterlog
vite
vue
contentful

A personal theater show tracker listing every show I have seen since 2010, built with Vue.js.

Overview:

TheaterLog is a log of all of the musicals and plays the author has seen since 2010. It is built using Vue.js and Contentful, and consists of Show Cards that are created for each show seen. The site also includes statistics on the number of shows seen and number of musicals seen, as well as a guide to review emojis. Users can create their own tracker by following the setup guide provided.

Features:

  • Show Cards: Each show generates a card with the show name, theater and city, month and year, label indicating if it's a musical or play, opinion stickers (favorite, review emoji), and a numbered card showing the number of times the show has been seen.
  • Statistics: The top hero section of the site displays statistics such as the number of shows seen, number of musicals seen, etc.
  • Customization: Users can customize their own tracker by following the provided setup guide. They can track movies, TV shows, songs, and more.

Summary:

TheaterLog is a Vue.js and Contentful-based theme that allows users to log and track the musicals and plays they have seen. The theme provides Show Cards with details about each show, as well as statistics and customization options. Users can install the theme by cloning the repository, setting up a Contentful account, and following the provided setup guide.

vite
Vite

Vite is a build tool that aims to provide a faster and leaner development experience for modern web projects

vue
Vue

Vue.js is a lightweight and flexible JavaScript framework that allows developers to easily build dynamic and reactive user interfaces. Its intuitive syntax, modular architecture, and focus on performance make it a popular choice for modern web development.

contentful
Contentful

Contentful is a headless content management system (CMS) that provides a flexible and scalable platform for creating, managing, and delivering digital content across multiple channels and devices.

eslint
Eslint

ESLint is a linter for JavaScript that analyzes code to detect and report on potential problems and errors, as well as enforce consistent code style and best practices, helping developers to write cleaner, more maintainable code.