todo_list

// set by tmcw.todo_list at 2023-10-08T18:17:35.831Z

An interactive, runnable TypeScript val by stevekrouse

SSR React Mini & SQLite Todo App This Todo App is server rendered and client-hydrated React. This architecture is a lightweight alternative to NextJS, RemixJS, or other React metaframeworks with no compile or build step. The data is saved server-side in Val Town SQLite . SSR React Mini Framework This "framework" is currently 44 lines of code, so it's obviously not a true replacement for NextJS or Remix. The trick is client-side importing the React component that you're server rendering . Val Town is uniquely suited for this trick because it both runs your code server-side and exposes vals as modules importable by the browser. The tricky part is making sure that server-only code doesn't run on the client and vice-versa. For example, because this val colocates the server-side loader and action with the React component we have to be careful to do all server-only imports (ie sqlite) dynamically inside the loader and action , so they only run server-side.

Server-side Render React Mini Framework This is very experimental, more of a prototype of an architecture, than a true framework Example: https://www.val.town/v/stevekrouse/TodoApp

An interactive, runnable TypeScript val by stevekrouse

An interactive, runnable TypeScript val by stevekrouse

An interactive, runnable TypeScript val by stevekrouse

SQLite - Docs ↗ SQLite is a lightweight, standard database. Every Val Town account comes with its own private SQLite database that is accessible from any of your vals via std/sqlite . Val Town SQLite is powered by Turso . Usage Migrations ORMs We recommend these admin data viewers for managing your database – viewing or editing data or your database table schema: Outerbase Studio (recommended) - formely known as LibSQL Studio – see instructions here SQLite Explorer (built in Val Town) Limits You can store 10mb on the free plan and up to 1gb on the paid plan. Contact us if you need more space. 📝 Edit docs