# Templates - SSR websites

> The websites a new SSR website starts from - Starter, Blank, Blog, Shop, Dashboard, Landing page and Documentation - and the models a new page, layout, endpoint or component starts as.

Source: https://docs.apimaker.dev/v4/docs/ssr/templates.html

A new website starts from a template. Each one is a whole website you change as you like ; every page has comments which say why it is written so, for you and for an AI assistant. Each `README.md` lists its pages and what they show.

| Template | What it is | UI libraries | Needs |
|---|---|---|---|
| **Starter** | One example page per feature : loaders, dynamic and catch-all routes, forms and actions, components, a grid of a table (search, sort, pages), a form which inserts rows, a sign-in and private pages, the cache, cookies, scripts in the browser, UI libraries, partials, endpoints. The place to learn. | Chart.js, on one page | Nothing ; the grid and the form use the table `contacts`, the sign-in the auth provider `customers` |
| **Blank** | A layout, a home page and a page for 404. | | Nothing |
| **Blog** | Posts with tags and authors, search, pages of results, an RSS feed, Open Graph, JSON-LD, a sitemap of every post. Posts from `data/posts.json`, or a table. | highlight.js | Nothing |
| **Shop** | Products with filters and pages, a cart in a cookie, sign-in and sign-up, a checkout which saves orders, the orders of each customer which nobody else reaches. | Bootstrap, Bootstrap Icons | Runs on sample products ; orders need the tables and the auth provider `customers` |
| **Dashboard** | A support desk behind a sign-in : numbers and charts, tickets with a search as you type (htmx), forms to create and change them, removing for the group `admin`, pages only that group opens. | Bootstrap, Bootstrap Icons, Chart.js, htmx | The auth provider `staff` ; the table `tickets` to save |
| **Landing page** | A product page in Tailwind CSS : hero, features, prices, questions, a newsletter form whose table the website may only add to. | Tailwind CSS | Nothing to show it |
| **Documentation** | Pages in sections from JSON, a catch-all route, a navigation, search, the page before and after, headings with anchors. | highlight.js | Nothing |

The panel shows, for each, what it shows, its libraries, what it needs, and the pages worth opening first.

## New files

**New file** in the tree of a website starts a file from a model :

| Model | Kind | Where |
|---|---|---|
| Page | Page | `pages/new-page.tsx` |
| Page with data | Page | `pages/items/index.tsx` : a loader with `ctx.db`, a search, pages |
| Page of a record | Page | `pages/items/[id].tsx` : `getById`, `notFound()` |
| Form | Page | `pages/contact.tsx` : an action, its checks, the message after it |
| Page for signed-in visitors | Page | `pages/account.tsx` : `access` |
| Cached page | Page | `pages/news.tsx` : `cache` with a tag |
| Sign-in page | Page | `pages/login.tsx` : `ctx.auth.login` |
| Layout | Layout | `pages/_layout.tsx` |
| Middleware | Layout | `pages/_middleware.ts` |
| Page for 404, Page for errors | Layout | `pages/_404.tsx`, `pages/_error.tsx` |
| JSON endpoint | Endpoint | `pages/api/hello.ts` |
| Endpoint of a table | Endpoint | `pages/api/items.ts` : GET a list, POST a record, with the rules of the website |
| Sign-out endpoint | Endpoint | `pages/logout.ts` |
| HTML partial | Endpoint | `pages/partials/item.ts` : HTML without the layout, for htmx |
| RSS feed | Endpoint | `pages/feed.xml.ts` |
| Component | Component | `components/<Name>.tsx` |
| Code module | Code | `lib/<name>.ts` |

Every template and every model is compiled and rendered by the tests of the server : what you start from works.
