Skip to content
codexa

Landing pages · React

Weekly newsletter

Editorial signup page for a weekly newsletter, with recent issues, reader numbers, the writer's story and a subscribe form.

Weekly newsletter 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 signup page for an independent weekly newsletter: an editorial hero, reader stats, a list of recent issues, a note about the writer, reader quotes, an FAQ and the subscribe form. All content lives in src/site.ts.

Files

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

Raw data: GET /api/v1/templates/landing-newsletter

src/site.ts
src/site.ts
import type { Site } from "./types"; /** Everything this site shows. Edit freely. */export const site: Site = {  "brand": "Kerbside",  "nav": [    {      "label": "Recent issues",      "href": "#issues"    },    {      "label": "About",      "href": "#about"    }  ],  "navCta": {    "label": "Subscribe",    "href": "#subscribe"  },  "sections": [    {      "kind": "hero",      "variant": "editorial",      "eyebrow": "A weekly letter about cities · Every Thursday at 7 am",      "title": "One good idea about streets, every Thursday morning.",      "text": "Kerbside is a six-minute read about how cities work: a bus lane that worked, a zoning rule that didn't, and what your town could borrow from both. Written by a former transport planner, free to read.",      "primary": {        "label": "Subscribe free",        "href": "#subscribe"      },      "secondary": {        "label": "Read recent issues",        "href": "#issues"      },      "visual": {        "type": "mock",        "title": "Kerbside No. 214 · Thursday 22 Oct",        "rows": [          {            "label": "The parking space that paid for a playground",            "value": "6 min"          },          {            "label": "Three links: bike counts, kerb data, a tram",            "value": "2 min"          },          {            "label": "Reader's street: Leith Walk at dusk",            "value": "Photo"          }        ],        "footer": "Sent to 18,400 readers at 7 am"      }    },    {      "kind": "stats",      "items": [        {          "value": "18,400",          "label": "Readers"        },        {          "value": "214",          "label": "Issues since 2022"        },        {          "value": "6 min",          "label": "Typical read"        },        {          "value": "54%",          "label": "Average open rate"        }      ]    },    {      "kind": "timeline",      "id": "issues",      "eyebrow": "Recent issues",      "title": "What landed in inboxes lately",      "items": [        {          "period": "No. 214 · 22 Oct",          "title": "The parking space that paid for a playground",          "text": "How one borough turned 40 kerbside spaces into a revenue line, and who complained."        },        {          "period": "No. 213 · 15 Oct",          "title": "Why your bus is late (it's the doors)",          "text": "Dwell time, all-door boarding and the four seconds that add up to twelve minutes."        },        {          "period": "No. 212 · 8 Oct",          "title": "Trees are infrastructure. Budget them like it.",          "text": "What happens when a city puts street trees in the capital plan instead of the parks line."        },        {          "period": "No. 211 · 1 Oct",          "title": "The 15-minute city, minus the arguments",          "text": "A plain reading of what the idea asks for, and what it never said."        }      ]    },    {      "kind": "split",      "id": "about",      "eyebrow": "Who writes it",      "title": "Nine years in a council transport team, now writing it down",      "text": "I'm Imogen Sato. I spent most of my career drawing bus routes and arguing about kerb heights. Kerbside is the newsletter I wanted when I started: specific, practical and short enough to finish with your coffee.",      "bullets": [        "One idea per issue, with sources",        "No sponsored issues, ever",        "Reader questions answered on the last Thursday of the month"      ],      "visual": {        "type": "card",        "tone": "#292524",        "title": "Every Thursday",        "lines": [          "One idea, about 1,200 words",          "Three links worth your time",          "A photo from a reader's street"        ]      }    },    {      "kind": "quotes",      "eyebrow": "Readers",      "title": "Read by planners, engineers and curious neighbours",      "items": [        {          "quote": "I've forwarded the bus doors issue to every councillor I know. It finally made dwell time click.",          "name": "Marcus L.",          "role": "Councillor, reader since 2023"        },        {          "quote": "The only newsletter I open the same day. Short, sourced and never smug.",          "name": "Aisha K.",          "role": "Civil engineer"        },        {          "quote": "I'm not a planner, I just walk a lot. It's changed how I see my own street.",          "name": "Pete D.",          "role": "Reader"        }      ]    },    {      "kind": "faq",      "eyebrow": "FAQ",      "title": "Before you subscribe",      "items": [        {          "q": "Is it really free?",          "a": "Yes. Every weekly issue is free. Readers who want to support it can pay $6 a month, which funds the research and the photos."        },        {          "q": "How often will I hear from you?",          "a": "Once a week, on Thursday morning. Nothing else unless you reply."        },        {          "q": "Do you share my email?",          "a": "No. Your address is used only to send Kerbside. Unsubscribe from any issue with one click."        }      ]    },    {      "kind": "contact",      "id": "subscribe",      "eyebrow": "Subscribe",      "title": "Get next Thursday's issue",      "text": "Free, weekly, six minutes. The welcome email includes the five most-read issues so far.",      "fields": [        "name",        "email"      ],      "button": "Subscribe free"    }  ],  "footer": {    "text": "A weekly letter about streets, transit and the places we share.",    "columns": [      {        "title": "Read",        "links": [          "Archive",          "Most read",          "Reader questions"        ]      },      {        "title": "Support",        "links": [          "Become a supporter",          "Gift a subscription"        ]      },      {        "title": "Contact",        "links": [          "hello@kerbside.news"        ]      }    ],    "legal": "© Kerbside. Sample content: replace it in src/site.ts."  }};

Remix

Remix this template

Describe what to change and the agent starts from Weekly newsletter's files. The box is already started for you: finish “Start from Weekly newsletter 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.

All templates

Build on Weekly newsletter

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