Name: Calendar App
Availability: InStock

Get started

Ready to build

Build the app you keep thinking about.

Describe your idea. Sanic AI builds the real app, end to end.

Start building See how it works

Built with Appsanic

Calendar App

See your week and plan your day

A clean calendar starter. Sun-first month grid with weekend tint, today circled, and category-coloured event dots with +N overflow and a legend. Day view with a 24-hour rail, all-day strip, overlap-aware lanes, and a red NOW line that ticks every minute and auto-scrolls. Agenda groups events by day under sticky TODAY / TOMORROW / date headers. Two-tap add/edit form with day strip, time and duration pills, and all-day toggle. Backed by Supabase with email auth, per-owner RLS, and realtime sync.

Month grid with weekend tint, category-coloured dots, +N overflow, and a legend
Day view with a 24-hour rail, all-day strip, and overlap-aware event lanes
Live NOW line that ticks every minute and auto-scrolls to the current time
Agenda list grouped by day with sticky TODAY / TOMORROW / date headers
Two-tap add/edit form with day strip, time and duration pills, all-day toggle
Supabase email auth, per-owner Row Level Security, and realtime device sync

Use this template

What you can do

A clean calendar starter for personal scheduling: a month grid, a single-day hour rail, and a chronological agenda, all backed by your own Supabase project. Because it runs on your Supabase, it opens on a Connect screen first - you wire up the keys and sign in (or tap Preview with sample data to explore the UI) before any real events appear.

Made forAnyone who wants a private personal calendar app to fork and extend on their own backend.

See the whole month at a glance with weekend tint, today circled, and up to three category-coloured dots per day plus a +N overflow
Drill into any day on a 24-hour rail where overlapping events pack into side-by-side lanes and an all-day strip sits on top
Stay oriented with a red NOW line that ticks every minute and a view that auto-scrolls to the current time when you open today
Scan what's coming up in an agenda grouped by day under sticky TODAY / TOMORROW / date headers
Add or edit an event in a couple of taps with a day strip, common-time pills, duration pills, and an all-day toggle, plus optional location and notes
Keep every event private to you and synced live across your devices in realtime

Under the hood

For developers: exactly what is included when you start from this template, taken straight from the template's own code.

Stack

Expo SDK 54React Native 0.81React 19.1TypeScript (strict)Supabase (@supabase/supabase-js 2.45 - Postgres, Auth, RLS, Realtime)react-native-safe-area-contextreact-native-svgreact-native-webHand-rolled useState router (no navigation library)useSyncExternalStore singleton store for events

Screens

Connect
Shown until Supabase keys are configured; explains how to connect a backend and apply the schema, with an optional Preview-with-sample-data button.
Auth
Real Supabase email/password sign-in and sign-up; sign-up captures a display name for the new customer row.
Month
Sun-first hairline month grid with weekend tint, today circled, category dots with +N overflow, and a legend; tap a day to open it.
Day
A single day's 24-hour rail with an all-day strip, overlap-aware event lanes, and a live NOW line that auto-scrolls to the current time.
Agenda
Upcoming events as a chronological list grouped by day with sticky TODAY / TOMORROW / date headers; past days are hidden.
Event detail
Full read view of one event - category, date, time range, location, notes - with edit and delete in the top bar.
Add / edit event
Create or edit an event via a horizontal day strip, common-time start pills, duration pills, an all-day toggle, and location/notes.
Settings
Profile header with at-a-glance counts (today, upcoming, all events) and sign out.

Data model

customers
One row per signed-up user (mirrors auth.users); holds email and display_name.
events
A user's calendar events - title, location, notes, category, start/end timestamps (UTC), and an all-day flag, owned via owner_id.

Backend

Row Level Security on both tables: customers is read-only to its owner (id = auth.uid()), and events grants full CRUD scoped to the owner (owner_id = auth.uid()) on both USING and WITH CHECK.
Trigger on_auth_user_created on auth.users runs the SECURITY DEFINER function handle_new_customer, which auto-creates the customers row on signup (deriving a display name from metadata or the email).
Trigger trg_events_touch on public.events runs touch_updated_at (SECURITY INVOKER) to keep updated_at fresh on every update.
Realtime: public.events is added to the supabase_realtime publication and set to REPLICA IDENTITY FULL so DELETE payloads carry owner_id for the live subscription filter - events sync live across devices.
No SECURITY DEFINER RPCs beyond the signup trigger function, no storage buckets, and no Edge Functions; the schema is a single supabase/schema.sql file (customers + events) with a composite index events_owner_starts_idx on (owner_id, starts_at).

More templates

All templates

Productivity

Notes App

Quick capture for ideas and journal entries

View template

Productivity

Budgeting App

Know where your money goes

View template

Social

Photo Journal App

One photo a day, with your friends

View template

Social

Social Feed App

An Instagram-style starter: feed, stories, likes, comments, follows, and an activity inbox

View template

Built with Appsanic

Calendar App

See your week and plan your day

Month grid with weekend tint, category-coloured dots, +N overflow, and a legend
Day view with a 24-hour rail, all-day strip, and overlap-aware event lanes
Live NOW line that ticks every minute and auto-scrolls to the current time
Agenda list grouped by day with sticky TODAY / TOMORROW / date headers
Two-tap add/edit form with day strip, time and duration pills, all-day toggle
Supabase email auth, per-owner Row Level Security, and realtime device sync

Use this template

What you can do

Made forAnyone who wants a private personal calendar app to fork and extend on their own backend.

See the whole month at a glance with weekend tint, today circled, and up to three category-coloured dots per day plus a +N overflow
Drill into any day on a 24-hour rail where overlapping events pack into side-by-side lanes and an all-day strip sits on top
Stay oriented with a red NOW line that ticks every minute and a view that auto-scrolls to the current time when you open today
Scan what's coming up in an agenda grouped by day under sticky TODAY / TOMORROW / date headers
Add or edit an event in a couple of taps with a day strip, common-time pills, duration pills, and an all-day toggle, plus optional location and notes
Keep every event private to you and synced live across your devices in realtime

Under the hood

For developers: exactly what is included when you start from this template, taken straight from the template's own code.

Stack

Screens

Connect
Shown until Supabase keys are configured; explains how to connect a backend and apply the schema, with an optional Preview-with-sample-data button.
Auth
Real Supabase email/password sign-in and sign-up; sign-up captures a display name for the new customer row.
Month
Sun-first hairline month grid with weekend tint, today circled, category dots with +N overflow, and a legend; tap a day to open it.
Day
A single day's 24-hour rail with an all-day strip, overlap-aware event lanes, and a live NOW line that auto-scrolls to the current time.
Agenda
Upcoming events as a chronological list grouped by day with sticky TODAY / TOMORROW / date headers; past days are hidden.
Event detail
Full read view of one event - category, date, time range, location, notes - with edit and delete in the top bar.
Add / edit event
Create or edit an event via a horizontal day strip, common-time start pills, duration pills, an all-day toggle, and location/notes.
Settings
Profile header with at-a-glance counts (today, upcoming, all events) and sign out.

Data model

customers
One row per signed-up user (mirrors auth.users); holds email and display_name.
events
A user's calendar events - title, location, notes, category, start/end timestamps (UTC), and an all-day flag, owned via owner_id.

Backend

Row Level Security on both tables: customers is read-only to its owner (id = auth.uid()), and events grants full CRUD scoped to the owner (owner_id = auth.uid()) on both USING and WITH CHECK.
Trigger on_auth_user_created on auth.users runs the SECURITY DEFINER function handle_new_customer, which auto-creates the customers row on signup (deriving a display name from metadata or the email).
Trigger trg_events_touch on public.events runs touch_updated_at (SECURITY INVOKER) to keep updated_at fresh on every update.
Realtime: public.events is added to the supabase_realtime publication and set to REPLICA IDENTITY FULL so DELETE payloads carry owner_id for the live subscription filter - events sync live across devices.
No SECURITY DEFINER RPCs beyond the signup trigger function, no storage buckets, and no Edge Functions; the schema is a single supabase/schema.sql file (customers + events) with a composite index events_owner_starts_idx on (owner_id, starts_at).