Public
Browse books from Notion with grid + hold status detail page
Val Town is a collaborative website to build and scale JavaScript apps.
Deploy APIs, crons, & store data – all from the browser, and deployed in milliseconds.

πŸ“š Notion Book Library

A web interface that pulls book data from a Notion database and displays it in a responsive grid with a detail page showing hold status.

Setup

1. Notion Integration

  1. Go to notion.so/my-integrations and create a new integration.
  2. Copy the Internal Integration Secret β€” this is your NOTION_TOKEN.
  3. Open your Notion book database, click … β†’ Connections β†’ add your integration.

2. Notion Database

Your database should have these properties (names are flexible β€” the code tries common variants):

PropertyTypePurpose
Title / NameTitleBook title
AuthorRich text or SelectAuthor name
On HoldCheckboxWhether a hold has been placed
Cover / ImageFiles or URLBook cover image (optional, auto-fetched from Open Library when missing)
ISBNRich textISBN number (optional)
GenreSelect or Multi-selectGenre tags (optional)
DescriptionRich textBook description (optional)

3. Environment Variables

Set these in the val's Environment Variables settings:

  • NOTION_TOKEN β€” your Notion integration token
  • NOTION_DATABASE_ID β€” the database ID (found in the database URL: notion.so/DATABASE_ID?v=...)

Routes

  • / β€” Book grid with all books from the database
  • /book/:id β€” Book detail page with cover, metadata, and hold status
  • /?genre=Fantasy β€” Filters the book grid by genre
  • /?title=hobbit β€” Searches books by title (case-insensitive)

Missing covers are looked up from Open Library and cached in Val Town SQLite for faster subsequent requests.