What is Bini.js?

Bini.js is a React framework for building full-stack applications that run natively across web, desktop, and mobile — all from a single codebase. You use React Components to build user interfaces, and Bini.js handles the complexity of multi-platform deployment.

It automatically configures lower-level tools while providing a seamless path to native apps. You can focus on building your product and shipping quickly, without worrying about the underlying platform differences.

Whether you're building a web app, a desktop application for Windows, macOS, or Linux, or a mobile app for Android and iOS — Bini.js gives you the tools to do it all from one project.

Native Apps from a Single Codebase

Bini.js goes beyond the browser. With Tauri integration, your React app becomes a real native application on every major platform — not a wrapped web view.

How to use the docs

The docs are organized into several sections:

• Getting Started: Step-by-step tutorials to create a new application and learn core features
• Routing: Folder-based and file-based routing, dynamic routes, and more
• API Routes: Build backend endpoints with Hono or plain functions
• Styling: Style your app with Tailwind CSS, CSS Modules, or plain CSS
• Platforms: Build for web, Windows, macOS, Linux, Android, and iOS
• Deployment: Deploy to Node.js, Netlify, Vercel, Cloudflare, or Deno

Bini.js Router

Bini.js uses a file-system based router that supports:

• Folder-Based Routing: Folders define URL segments. Nesting folders creates nested routes automatically.For example, app/blog/ creates /blog, and app/blog/[slug]/ creates dynamic routes like /blog/my-post.
• File-Based Routing: Special files define route behavior:
  • page.tsx — Creates a public route accessible at the folder's URL
  • layout.tsx — Wraps pages and nested layouts, persists across navigation
  • loading.tsx — Shows loading UI while the page content streams
  • not-found.tsx — Custom 404 page for unmatched routes
  • error.tsx — Custom error boundary for the folder and its children

Routes are automatically code-split — no manual React.lazy() required.

Pre-requisite knowledge

Our documentation assumes some familiarity with web development. Before getting started, it'll help if you're comfortable with:

• HTML
• CSS
• JavaScript
• React

If you're new to React or need a refresher, we recommend starting with the React documentation .