blob: 8fbd5c83380538c6ffd939cb9af740520f319413 (
plain)
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
|
# Sci-Fi Books Showcase
A static HTML page showcasing a science fiction book collection. Works fully offline with all assets stored locally.
**Live demo:** https://f3s.buetow.org/scifi
## Features
- Responsive book grid with cover images
- Filter by author, format (Paperback/eBook/Audiobook), or search
- Click any book to view details and plot summary
- Fully offline - no external dependencies after build
- W3C validated HTML
## Quick Start
```bash
# Build the site (embeds summaries into books.json and creates dist/)
just build
# Deploy to server
just dist
# Local development server
just open
```
## Project Structure
```
├── index.html # Main page
├── css/styles.css # Styling
├── js/app.js # Client-side logic (filtering, modals)
├── data/books.json # Book metadata with embedded summaries
├── summaries/{id}.md # Book summaries as markdown (source files)
├── images/covers/{id}.jpg # Cover images
├── build.js # Build script
├── dist/ # Generated distribution directory
└── Justfile # Task runner commands
```
## Adding a Book
1. Add entry to `data/books.json`:
```json
{
"id": 55,
"title": "Book Title",
"author": "Author Name",
"year": 2024,
"format": "Paperback",
"isbn": "9781234567890",
"language": "en",
"coverLocal": "images/covers/55.jpg"
}
```
2. Add cover image as `images/covers/55.jpg`
3. Create summary file `summaries/55.md`:
```markdown
# Book Title
Plot summary goes here...
```
4. Run `just build` to rebuild
## Editing Summaries
Summaries are stored as individual markdown files in `summaries/`. Edit them directly, then run `just build` to embed them into `books.json`.
## License
Data sourced from [foo.zone](https://foo.zone/about/novels.html).
|
