WebJs, explained

What is WebJs?

WebJs is a free, open-source, full-stack JavaScript web framework built on web components. It server-renders every page and component to real HTML, needs no build step or bundler, and runs on Node 24+ or Bun.

You write pages, layouts, and components as plain files. WebJs serves that source to the browser exactly as you wrote it, so the code you read is the code that runs. Content reads and forms submit before any script loads, and JavaScript is added only where an interaction actually needs it.

Get started Why WebJs exists

npm create webjs@latest my-app

The whole stack, three files

What a WebJs app looks like

A component, a server function, and a page. These are ordinary files in your project, served as written. There is no compile step between what you see here and what the browser receives.

A component

components/like-button.ts

import { WebComponent, html, signal } from '@webjsdev/core';

class LikeButton extends WebComponent {
  likes = signal(0);
  render() {
    return html`<button @click=${() => this.likes.set(this.likes.get() + 1)}>
      ♥ ${this.likes.get()}
    </button>`;
  }
}
LikeButton.register('like-button');

A server function

actions/get-post.server.ts

'use server';
import { eq } from 'drizzle-orm';
import { db } from '#db/connection.server.ts';
import { posts } from '#db/schema.server.ts';

// Import this from a page or client component. WebJs rewrites
// the import into a typed RPC stub (the real call at SSR). No
// fetch by hand.
export async function getPost(id) {
  const [post] = await db.select().from(posts).where(eq(posts.id, id));
  return post;
}

A page

app/posts/[id]/page.ts

import { html, notFound } from '@webjsdev/core';
import { getPost } from '#actions/get-post.server.ts';
import '#components/like-button.ts';

export default async function Post({ params }) {
  const post = await getPost(params.id);
  if (!post) notFound();
  return html`<article>
    <h1>${post.title}</h1>
    <like-button></like-button>
  </article>`;
}

What you get

What WebJs does for you

WebJs is a full framework rather than a rendering library, so routing, data, and the production concerns arrive together instead of as six decisions you make yourself.

Web components, server-rendered

Components are standard custom elements. Every render() runs on the server, so the initial markup is in the HTTP response before any script loads. Light DOM is the default, so global CSS and Tailwind apply directly, and shadow DOM is one static field away when you want scoped styles.

File-based routing

A page.ts file is a route, a layout.ts wraps everything under it, and a route.ts is an HTTP handler. Dynamic segments, route groups, catch-alls, error boundaries, and loading states all follow the folder structure, so the URL map is the directory tree.

Server actions with real types

Export an async function from a .server.ts file and import it straight into a component. The import becomes a typed RPC call, and the wire preserves Date, Map, Set, BigInt, Blob, File, FormData, and reference cycles. The server source never reaches the browser.

Batteries included

Sessions, authentication, caching, rate limiting, file storage, and WebSockets ship in the box, sharing one pluggable store. In-memory by default, and a single setStore call moves all of them onto Redis.

TypeScript with nothing to compile

Write .ts files and run them. Types are stripped at request time by Node 24+ or by amaro on Bun, position-preserving and near-zero overhead, so what you read in the editor is what runs in the browser.

Readable end to end

The framework ships as plain JavaScript with JSDoc in node_modules. Nothing is minified or hidden behind a compiler, so you can follow a request from routing through SSR to the client without leaving your project.

Same name, different projects

Other things called WebJS

The name is shared. If you arrived looking for one of these, they are not this project.

whatsapp-web.js (wwebjs): An unofficial Node.js library for building WhatsApp clients and bots. Commonly shortened to wwebjs, and unrelated to this framework.
WebJS for Java: An older framework aimed at letting Java developers build web applications without combining many technologies. Last published in 2013 and no longer active.
webJS toolkit: A small client-side JavaScript toolkit that compiles HTML templates into reusable JavaScript for dynamic page rendering. A browser library rather than a full-stack framework.