Name: Notes 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

Notes App

Quick capture for ideas and journal entries

A calm, Apple-Notes-style starter. The home screen has live search that highlights matches in titles and previews, plus a folder filter rail with per-folder counts above a single-column note list (pinned-first, with last-edited time). The editor autosaves as you type with a 'Saving' → 'Saved' pill, and offers a folder picker, five colour accents, removable tag chips, pin, and delete. Folders and Settings screens round it out. Backed by your own Supabase project (Postgres, Auth, RLS, Realtime).

Live search that highlights matches in titles and previews
Folder filter rail with per-folder note counts
Single-column note list, pinned-first, with last-edited time
Autosave editor with a 'Saving' → 'Saved' pill (650ms debounce)
Folder picker, five-colour accents, and removable tag chips
Realtime sync of notes and folders across devices via Supabase

Use this template

What you can do

A calm, Apple-Notes-style app for capturing thoughts, lists, and journal entries. You write a note, give it a title, and it autosaves as you type (a 'Saving' to 'Saved' pill confirms it, with a short 650ms debounce). Notes can be sorted into folders you name, pinned to float to the top, given a five-colour accent, and labelled with removable tag chips. The home screen has a live search field that highlights matching words right in the titles and previews, plus a folder filter rail with per-folder counts. It runs on your own Supabase project, so it opens on a Connect screen and a sign-in gate first, not the moment you open it; you can tap 'Preview with sample data' to explore the UI before wiring up a backend.

Made forAnyone who wants a personal, private place to keep notes, ideas, or a daily journal.

Write notes that autosave as you type, with a 'Saving' to 'Saved' pill
Organise notes into folders you create, rename, and delete
Pin important notes so they float to the top of the list
Give each note one of five colour accents and removable tag chips
Search live across titles, bodies, and tags with matches highlighted
Filter the list by folder with live per-folder counts
See notes and folders sync across 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 5.9 (strict)Supabase (Postgres, Auth, RLS, Realtime) via supabase-js 2.45react-native-svg 15.12react-native-safe-area-context 5.6react-native-web 0.21

Screens

Connect
Shown until your Supabase keys are set: how to connect a backend, with an optional 'Preview with sample data' button to explore without one.
Sign in / Sign up
Real Supabase email and password auth; sign-up takes a display name that seeds your account row.
Notes (home)
Date header, live search that highlights matches, a folder filter rail with counts, and a single-column list (pinned-first, 2-line preview, last-edited time) with a new-note button.
Editor
Title plus a roomy body that autosaves as you type, with a folder picker, five-colour accent picker, removable tag chips, pin toggle, and delete.
Folders
Create, rename, and delete folders, each with a live note count; deleting a folder keeps its notes (they become unfiled).
Settings
Your profile, at-a-glance counts of notes, folders, and pinned notes, and sign out.

Data model

customers
One row per user mirroring auth.users, holding email, display_name, and created_at. Created automatically on signup.
folders
User-owned note groups with a name, a sort_order key, and created_at; scoped to the owner.
notes
Title and plain-text body with a nullable folder_id, a text[] tags column (max 10), one of five colour accents, a pinned flag, and created_at/updated_at timestamps.

Backend

Owner-only RLS on all three tables: folders and notes allow full CRUD where owner_id = auth.uid(); customers is read-only on your own row (id = auth.uid()) with no client writes. No public read.
A handle_new_customer trigger (on_auth_user_created) on auth.users auto-creates the customers row on signup, defaulting display_name from user metadata, the email local part, or 'You'.
A touch_updated_at trigger (trg_notes_touch) keeps notes.updated_at fresh before every update.
A validate_note_tags trigger (trg_notes_tags) caps each tag at 30 characters server-side, so the limit holds for direct PostgREST writes, not just the UI.
Realtime: folders and notes are added to the supabase_realtime publication with REPLICA IDENTITY FULL so DELETE payloads carry owner_id for client-side filtering; customers is not published.
Indexes: folders_owner_idx (owner_id, sort_order, created_at), notes_owner_idx (owner_id, pinned desc, updated_at desc), and notes_folder_idx (folder_id).
No storage buckets, Edge Functions, or additional SECURITY DEFINER RPCs beyond the handle_new_customer trigger function. Sketching, voice dictation, markdown rendering, sharing, and reminders are out of scope.

More templates

All templates

Productivity

Calendar App

See your week and plan your day

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

Notes App

Quick capture for ideas and journal entries

Live search that highlights matches in titles and previews
Folder filter rail with per-folder note counts
Single-column note list, pinned-first, with last-edited time
Autosave editor with a 'Saving' → 'Saved' pill (650ms debounce)
Folder picker, five-colour accents, and removable tag chips
Realtime sync of notes and folders across devices via Supabase

Use this template

What you can do

Made forAnyone who wants a personal, private place to keep notes, ideas, or a daily journal.

Write notes that autosave as you type, with a 'Saving' to 'Saved' pill
Organise notes into folders you create, rename, and delete
Pin important notes so they float to the top of the list
Give each note one of five colour accents and removable tag chips
Search live across titles, bodies, and tags with matches highlighted
Filter the list by folder with live per-folder counts
See notes and folders sync across 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 5.9 (strict)Supabase (Postgres, Auth, RLS, Realtime) via supabase-js 2.45react-native-svg 15.12react-native-safe-area-context 5.6react-native-web 0.21

Screens

Connect
Shown until your Supabase keys are set: how to connect a backend, with an optional 'Preview with sample data' button to explore without one.
Sign in / Sign up
Real Supabase email and password auth; sign-up takes a display name that seeds your account row.
Notes (home)
Date header, live search that highlights matches, a folder filter rail with counts, and a single-column list (pinned-first, 2-line preview, last-edited time) with a new-note button.
Editor
Title plus a roomy body that autosaves as you type, with a folder picker, five-colour accent picker, removable tag chips, pin toggle, and delete.
Folders
Create, rename, and delete folders, each with a live note count; deleting a folder keeps its notes (they become unfiled).
Settings
Your profile, at-a-glance counts of notes, folders, and pinned notes, and sign out.

Data model

customers
One row per user mirroring auth.users, holding email, display_name, and created_at. Created automatically on signup.
folders
User-owned note groups with a name, a sort_order key, and created_at; scoped to the owner.
notes
Title and plain-text body with a nullable folder_id, a text[] tags column (max 10), one of five colour accents, a pinned flag, and created_at/updated_at timestamps.

Backend

Owner-only RLS on all three tables: folders and notes allow full CRUD where owner_id = auth.uid(); customers is read-only on your own row (id = auth.uid()) with no client writes. No public read.
A handle_new_customer trigger (on_auth_user_created) on auth.users auto-creates the customers row on signup, defaulting display_name from user metadata, the email local part, or 'You'.
A touch_updated_at trigger (trg_notes_touch) keeps notes.updated_at fresh before every update.
A validate_note_tags trigger (trg_notes_tags) caps each tag at 30 characters server-side, so the limit holds for direct PostgREST writes, not just the UI.
Realtime: folders and notes are added to the supabase_realtime publication with REPLICA IDENTITY FULL so DELETE payloads carry owner_id for client-side filtering; customers is not published.
Indexes: folders_owner_idx (owner_id, sort_order, created_at), notes_owner_idx (owner_id, pinned desc, updated_at desc), and notes_folder_idx (folder_id).
No storage buckets, Edge Functions, or additional SECURITY DEFINER RPCs beyond the handle_new_customer trigger function. Sketching, voice dictation, markdown rendering, sharing, and reminders are out of scope.