charbuild
Val Town is a collaborative website to build and scale JavaScript apps.
Deploy APIs, crons, & store data – all from the browser, and deployed in milliseconds.
index.ts
https://dcm31--b402c6b8041511f087d1569c3dd06744.web.val.run
A modular application platform where each page functions as an independent application, sharing only authentication and header styling.
char.build/
├── index.js # Main entry point and router
├── core/ # Shared functionality
│ ├── header.js # Shared header component with auth
│ ├── db.js # Database utilities
│ └── registry.js # App registry for routing
├── apps/ # Individual applications
│ ├── notes/ # Notes application
│ │ ├── index.js # Routes and backend logic
│ │ └── ui.js # Frontend UI
│ ├── template/ # Template for new apps
│ │ ├── index.js # Routes template
│ │ └── ui.js # UI template
│ └── [app-name]/ # Additional applications
└── README.md # This file
- Each app is completely independent and self-contained within its own directory
- Apps share authentication through the
lastloginmiddleware - Each app has its own frontend and backend code
- Apps can have their own unique styling while maintaining a consistent header
- Copy the
apps/templatedirectory toapps/[your-app-name] - Customize the UI in
apps/[your-app-name]/ui.js - Add your backend routes in
apps/[your-app-name]/index.js - Register your app in
core/registry.js:
export const appRegistry = {
// Existing apps...
// Add your app
yourAppName: {
name: 'Your App Display Name',
description: 'Brief description of your app',
routes: (await import('../apps/your-app-name/index.js')).default,
},
};
- Truly Modular: Work on each app independently without affecting others
- Shared Authentication: Google authentication through
lastloginis available in all apps - Consistent Header: All apps share the same header with navigation
- Independent Styling: Each app can have its own unique UI/UX
- Database Integration: Built-in SQLite functionality with table prefixing for isolation
The guiding philosophy is that adding a new page or feature should be as simple as:
- Adding a new directory
- Writing your app code
- Registering it in one place
No need to modify routing in multiple places or navigate through complex file structures. Everything your app needs should be within its own directory.