Skip to content
codexa

Web apps · React

Home library

Catalogue your books, see who borrowed what, and catch loans that are overdue.

Use this templateRemix
Home library starter, as built from its own files
Starter screenshot captured from this template's own build at 1440×900. It shows the template as it ships, not output generated from a prompt.

What you get

A personal library catalogue: books with author, genre and shelf, plus who has borrowed each one and when it is due back. Overdue loans and the wishlist get their own columns. The books and genres live in src/app.ts.

Files

Exactly what is copied into a new project: 12 files, nothing generated.

Raw data: GET /api/v1/templates/app-home-library

Explorer 12

src/app.ts
src/app.ts
import type { AppSpec } from "./types"; /** Everything this app shows. Edit freely. */export const app: AppSpec = {  "brand": "Shelfmark",  "icon": "book",  "storageKey": "shelfmark-books-v1",  "entity": {    "singular": "Book",    "plural": "Books"  },  "title": "My library",  "subtitle": "412 books on the shelves, a handful out on loan",  "titleKey": "title",  "statusKey": "status",  "tones": {    "On shelf": "good",    "Lent out": "accent",    "Overdue": "bad",    "Wishlist": "neutral"  },  "views": [    "table",    "board"  ],  "fields": [    {      "key": "title",      "label": "Title",      "type": "text",      "required": true    },    {      "key": "author",      "label": "Author",      "type": "text"    },    {      "key": "genre",      "label": "Genre",      "type": "select",      "options": [        "Fiction",        "History",        "Science",        "Cooking",        "Poetry"      ]    },    {      "key": "borrower",      "label": "Borrowed by",      "type": "text"    },    {      "key": "due",      "label": "Due back",      "type": "date"    },    {      "key": "pages",      "label": "Pages",      "type": "number",      "hideInTable": true    },    {      "key": "status",      "label": "Status",      "type": "select",      "options": [        "On shelf",        "Lent out",        "Overdue",        "Wishlist"      ]    },    {      "key": "notes",      "label": "Notes",      "type": "longtext",      "hideInTable": true    }  ],  "summary": [    {      "label": "Books listed",      "kind": "count"    },    {      "label": "Lent out",      "kind": "count",      "status": "Lent out"    },    {      "label": "Overdue",      "kind": "count",      "status": "Overdue"    },    {      "label": "On the wishlist",      "kind": "count",      "status": "Wishlist"    }  ],  "seed": [    {      "title": "The Remains of the Day",      "author": "Kazuo Ishiguro",      "genre": "Fiction",      "borrower": "Hannah",      "due": "2026-11-15",      "pages": 258,      "status": "Lent out",      "notes": ""    },    {      "title": "Salt, Fat, Acid, Heat",      "author": "Samin Nosrat",      "genre": "Cooking",      "borrower": "Leo",      "due": "2026-10-12",      "pages": 480,      "status": "Overdue",      "notes": "Asked twice. Has soy sauce on page 112."    },    {      "title": "The Silk Roads",      "author": "Peter Frankopan",      "genre": "History",      "borrower": "",      "due": "",      "pages": 636,      "status": "On shelf",      "notes": ""    },    {      "title": "Middlemarch",      "author": "George Eliot",      "genre": "Fiction",      "borrower": "",      "due": "",      "pages": 880,      "status": "On shelf",      "notes": "Penguin Classics, annotated."    },    {      "title": "The Gene",      "author": "Siddhartha Mukherjee",      "genre": "Science",      "borrower": "Mum",      "due": "2026-12-01",      "pages": 592,      "status": "Lent out",      "notes": ""    },    {      "title": "Collected Poems",      "author": "Mary Oliver",      "genre": "Poetry",      "borrower": "Isla",      "due": "2026-10-20",      "pages": 224,      "status": "Overdue",      "notes": ""    },    {      "title": "Braiding Sweetgrass",      "author": "Robin Wall Kimmerer",      "genre": "Science",      "borrower": "",      "due": "",      "pages": 408,      "status": "Wishlist",      "notes": "Hardback if possible."    },    {      "title": "Wolf Hall",      "author": "Hilary Mantel",      "genre": "Fiction",      "borrower": "",      "due": "",      "pages": 653,      "status": "On shelf",      "notes": ""    }  ]};

Remix

Remix this template

Describe what to change and the agent starts from Home library's files. The box is already started for you: finish “Start from Home library and …”

Agent ready

Creates a free account first; your idea is carried over.

Dependencies

Documented from the template's package.json. The runtime has a prebuilt dependency set for Vite + React + TypeScript, so installs are fast.

  • react^19.1.0
  • react-dom^19.1.0
  • vite^6.3.0
  • @vitejs/plugin-react^4.4.0
  • tailwindcss^4.1.0
  • @tailwindcss/vite^4.1.0
  • typescript^5.8.0

How it runs

Framework
Vite + React + TypeScript
Dev command
npm run dev
Build command
npm run build
Output directory
dist
Port
5173
Entry route
/

Projects run in an isolated sandbox with a live preview. Read the projects documentation for settings, snapshots and deployment.

Keep browsing

All templates

Build on Home library

Create a free account, start from this template, and ask the AI agent to turn it into your app.

Use this templateAll templates