Choose simplicity over complexity. Build with pure semantic HTML and web standards instead of heavyweight framework abstractions
Noundry.ts embraces web standards over framework abstractions. We believe the web platform has matured to the point where, for most applications, framework-specific conventions are unnecessary overhead.
This doesn't mean frameworks are bad—they excel for highly interactive, complex UIs. But for the majority of web applications (dashboards, CRUD apps, content sites), simpler approaches using standard platform APIs are faster, more maintainable, and longer-lasting.
The complete full-stack TypeScript solution built for speed and simplicity
3x faster than Node.js with built-in bundling, testing, and package management. One tool to rule them all.
File-based routing, server-side rendering with Hono JSX, and edge-ready architecture. Full-stack with zero config.
Type-safe database queries with automatic TypeScript inference. Supports SQLite, PostgreSQL, MySQL, and more.
From database schema to API routes to UI components—full type safety with TypeScript from backend to frontend.
JWT authentication with bcrypt out of the box. Or integrate Better Auth, Auth.js, Clerk, or Auth0 in minutes.
Organized workspace with separate server and client packages. Not a starter template—a production architecture.
Scaffold projects, add UI components, generate database migrations, and more with the ndts-cli command line tool.
Tailwind CSS v4 with beautiful shadcn/ui-inspired components. Modern styling with zero configuration.
Edge-ready, Docker-ready. Deploy to Fly.io, Railway, Vercel, AWS, or self-host. Your choice, your infrastructure.
Why we use standard HTML, DOM, and JavaScript instead of framework-specific conventions
class, not classNameHTML has always used class. React invented className to work around JSX limitations. We don't use JSX, so we don't need this artificial distinction.
// ❌ React Way
<div className="container">
// ✅ Noundry Way (Hono JSX)
<div class="container">
// ✅ Noundry Way (TypeScript DOM)
createElement('div', { class: 'container' })for, not htmlForLabels have always used the for attribute. React renamed it to htmlFor. We use the real attribute name.
// ❌ React Way
<label htmlFor="email">
// ✅ Noundry Way
<label for="email">React popularized onClick, onChange, etc. The web platform has addEventListener. When we need inline events, we use lowercase onclick (the actual HTML attribute).
// ❌ React Way
<button onClick={handleClick}>
// ✅ Noundry Way (Hono JSX)
<button onclick="handleClick()">
// ✅ Noundry Way (TypeScript DOM - preferred)
const button = createElement('button');
on(button, 'click', handleClick);HonoX handles file-based routing, API endpoints, and JSX templating. The client uses vanilla TypeScript for interactivity—no massive framework bundles required.
// ✅ Server API (Hono):
app.get('/api/users', async (c) => {
const users = await db.users.findMany();
return c.json(users);
});
// ✅ Client (TypeScript):
const users = await fetch('/api/users').then(r => r.json());Our UI components are pure TypeScript classes that manipulate the DOM directly. No virtual DOM. No reconciliation. No hooks.
// ✅ Noundry Way
const input = Input.create({
name: 'email',
type: 'email',
placeholder: 'Enter email',
class: 'w-full',
onChange: (value) => console.log(value)
});Use the web platform APIs directly without framework abstractions.
FormData for forms, not state management
URL for state management, not complex stores
fetch for HTTP, not custom wrappers
The right tool for the right job
The Key Question: Does your application require frequent, complex UI state changes across many components? If not, Noundry's simplicity will serve you better than framework complexity.
Coming from React? Here's how patterns translate
| React Pattern | Noundry Pattern |
|---|---|
className="foo" |
class="foo" |
htmlFor="bar" |
for="bar" |
onClick={fn} |
on(el, 'click', fn) |
useState |
let variable = value (it's just JavaScript) |
useEffect |
addEventListener('DOMContentLoaded', fn) |
useContext |
Function parameters or module scope |
<Component /> |
Component.create() |
Virtual DOM |
Actual DOM |
Noundry.ts is not "React without React." It's a return to first principles: semantic HTML, standard JavaScript, and web platform APIs.
For most applications, the web platform provides everything you need—without the complexity. We're not fighting frameworks—we're choosing simplicity when it's the better tool for the job.
Noundry.ts: Web standards. No compromises. No React.