ufbr

Universal File-Based Router - A framework-agnostic file-based routing solution for modern web applications.

ufbr automatically generates routes from your file structure, eliminating the need for manual route configuration. Perfect for building single-page applications with intuitive file organization.

Features

- 📁 File-Based Routing - Routes automatically generated from your file structure
- ⚡ Sync & Async Components - Support for both synchronous and asynchronous component loading
- 🔗 Nested Routes - Build hierarchical route structures effortlessly
- 🎯 Dynamic Routes - Create parameterized routes with [param] syntax
- 🎨 Framework Agnostic - Works with Preact, Solid, Ziko, Vue, and more

Installation

``bash
npm install ufbr
`

Quick Start

$3

`js
import { createFileBasedRouter } from 'ufbr/[FRAMEWORK]'

createFileBasedRouter({
pages: import.meta.glob('./pages/*/.[jsx,js]'),
target: document.body
})
`

Demos

|Tech|Stackblitz Link|
|-|-|
|Van||
|Preact||
|Solid||
|Vue||
|Svelte||

API

$3

Options:
- pages (object) - Result of import.meta.glob() pattern with all page components
- target (Element) - DOM element where the router will render components

$3

`
pages/
├── index.[extension] → /
├── about.[extension] → /about
├── blog/
│ ├── index.[extension] → /blog
│ └── [id].[extension] → /blog/:id
└── user/
└── [name].[extension] → /user/:name
`

License

MIT