List App

A web application for managing and organizing lists of movies, series, and games. The app allows users to add, view, and delete media items, with support for sorting and filtering.

Features

Media Management: Add, view, and delete movies, series, and games
Sorting Options: Sort by title, year, or date added
Image Caching: Automatically downloads and caches poster images
Authentication: Password-protected actions for adding/deleting media
Responsive Design: Works on mobile and desktop devices

Technologies

Backend: TypeScript, Express, Bun runtime
Frontend: TypeScript, Bootstrap 5
Database: SQLite
APIs: OMDB API (movies/series), Twitch IGDB API (games)

Project Structure

list_app/
├── backend/              # Backend server code
│   ├── controllers/      # Business logic
│   ├── models/           # Database models
│   ├── routes/           # API routes
│   ├── miscellaneous/    # Utilities and middleware
│   └── app.ts            # Main server entry
│
├── frontend/             # Frontend code
│   ├── list/             # Main list components
│   ├── utils/            # Type definitions
│   └── elementcreate.tsx # Custom element creation
│
├── public/               # Static files
│   ├── index.html        # Main HTML file
│   ├── logo.ico          # Favicon
│   └── no_poster.jpg     # Fallback poster image
│
├── package.json          # Project dependencies
└── README.md             # This file

Setup

Install Bun runtime: https://bun.sh/
Install dependencies:
```
bun install
```
Set up your API keys in the database:
- OMDB API key for movies/series
- Twitch client ID and secret for games

API Endpoints

GET /api/media/:mediaType - List all media of a type (movies, series, games)
POST /api/media/:mediaType - Add new media (requires password)
DELETE /api/media/:mediaType - Delete media (requires password)

Configuration

The application uses SQLite for data storage. The database file mydb.sqlite will be created automatically on first run with the following tables:

movies - Stores movie information
series - Stores series information
games - Stores game information
userData - Stores configuration including API keys and password

Usage

Navigate to http://localhost:4080 in your browser
Use the navigation buttons to switch between movies, series, and games
Use the "Sort" dropdown to change sorting method
Enter your password and media ID in the form to add new items
Click "Edit" then use delete buttons to remove items

Building

To build the frontend:

./build.sh

2.7 KiB Raw Blame History