Skip to content

Commit 1709399

Browse files
committed
docs(about.md): document all project with AI
After several years, I decided to take a look at this project, to facilitate the onboarding of new developers and contributors I decided to create this file that contains technical documentation about the project.
1 parent be91938 commit 1709399

File tree

1 file changed

+120
-0
lines changed

1 file changed

+120
-0
lines changed

ABOUT.md

Lines changed: 120 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,120 @@
1+
# About YourRouter
2+
3+
YourRouter is a powerful client-side routing library for building Single Page Applications (SPAs) without full-page reloads and with zero external dependencies. It provides dynamic routing, template rendering, and redirection capabilities, all with full TypeScript support.
4+
5+
## Features
6+
7+
- Client-side routing without page reloads
8+
- Dynamic route parameters and extended wildcard segments
9+
- Template rendering engine (optional)
10+
- Redirection without reloading the page
11+
- Zero runtime dependencies
12+
- Full TypeScript definitions
13+
14+
## Technologies
15+
16+
- **Language & Tooling**: TypeScript, ECMAScript 2016+, Node.js
17+
- **Bundling & Build**: tsc, tsc-alias, concurrently, Vite
18+
- **Linting**: ESLint (Standard config) with @typescript-eslint
19+
- **Testing**:
20+
- Unit & Integration: Vitest, jsdom
21+
- End-to-End: Playwright (via Vitest e2e)
22+
- **CI/CD**: GitHub Actions for linting, testing, and npm publishing
23+
24+
## Installation
25+
26+
Install via npm, yarn, or pnpm:
27+
28+
```bash
29+
npm install yourrouter
30+
yarn add yourrouter
31+
pnpm add yourrouter
32+
```
33+
34+
## Quick Usage
35+
36+
```ts
37+
import Router from "yourrouter";
38+
39+
// Initialize router with optional render target
40+
const router = Router.create({
41+
path404: "/notFound",
42+
renderId: "#app", // Optional: CSS selector for template mounting
43+
});
44+
45+
// Define routes
46+
router.addRoute("/", () => {
47+
return () => "<h1>Home page!</h1>";
48+
});
49+
50+
router.addRoute("/users/:id", () => {
51+
const params = Router.get().getRouteParams();
52+
return () => `<p>User ID: ${params.id}</p>`;
53+
});
54+
```
55+
56+
For complete API and advanced examples, see the [documentation site](https://ch3ber.github.io/yourRouter).
57+
58+
## Project Structure
59+
60+
```
61+
.
62+
├── .github/ # Code of Conduct & CI workflows
63+
├── docs/ # Project images and documentation assets
64+
├── scripts/ # Build & coverage helper scripts
65+
├── src/ # Source files (TypeScript)
66+
├── __test__/ # Unit, integration, and e2e tests
67+
├── lib/ # Compiled output (generated)
68+
├── package.json # Project metadata & scripts
69+
├── tsconfig*.json # TypeScript configurations
70+
├── vite.config.js # Vite test server config
71+
├── README.md # Quick start & overview (GitHub)
72+
├── CONTRIBUTING.md # Contribution guidelines
73+
├── TODOS.md # Roadmap & outstanding tasks
74+
└── LICENSE # MIT License
75+
```
76+
77+
## npm Scripts
78+
79+
| Command | Description |
80+
| ---------------------- | ------------------------------------------------------------- |
81+
| `npm run build` | Clean, compile source & declarations, apply path aliases |
82+
| `npm run build:watch` | Watch and rebuild (for development) |
83+
| `npm run dev` | Type-check in watch mode |
84+
| `npm run lint` | Run ESLint |
85+
| `npm run lint:fix` | Run ESLint with automatic fixes |
86+
| `npm run test` | Run unit & integration tests (jsdom) |
87+
| `npm run test:watch` | Run tests in watch mode |
88+
| `npm run test:coverage`| Run tests with coverage report |
89+
| `npm run test:vite` | Build and launch Vite server for manual/browser testing |
90+
91+
## Testing
92+
93+
This project uses Vitest for unit, integration, and end-to-end testing:
94+
95+
- **Unit & Integration**: `npm run test`
96+
- **Watch mode**: `npm run test:watch`
97+
- **Coverage report**: `npm run test:coverage`
98+
- **E2E & browser**: `npm run test:vite`
99+
100+
Test configurations and mocks are located under the `__test__` directory.
101+
102+
## Continuous Integration & Deployment
103+
104+
A GitHub Actions workflow (`.github/workflows/publish.yml`) automates:
105+
106+
1. Linting & testing on each push
107+
2. Build & publish to npm on pushes to `main` (requires `NPM_TOKEN`)
108+
109+
## Documentation & Website
110+
111+
- Live docs site: [https://ch3ber.github.io/yourRouter](https://ch3ber.github.io/yourRouter)
112+
- Documentation source: https://github.com/ch3ber/yourRouter-docs
113+
114+
## Contributing
115+
116+
See [CONTRIBUTING.md](CONTRIBUTING.md) for guidelines and [CODE_OF_CONDUCT.md](.github/CODE_OF_CONDUCT.md) for community standards.
117+
118+
## License
119+
120+
This project is licensed under the MIT License. See [LICENSE](LICENSE) for details.

0 commit comments

Comments
 (0)