https://github.com/modernweb-dev/rocket
The modern web setup for static sites with a sprinkle of JavaScript
https://github.com/modernweb-dev/rocket
eleventy hacktoberfest modern-web rollup static-site-generator web-components
Last synced: 19 days ago
JSON representation
The modern web setup for static sites with a sprinkle of JavaScript
- Host: GitHub
- URL: https://github.com/modernweb-dev/rocket
- Owner: modernweb-dev
- License: mit
- Created: 2021-01-03T13:55:46.000Z (over 5 years ago)
- Default Branch: main
- Last Pushed: 2024-02-24T16:56:56.000Z (over 2 years ago)
- Last Synced: 2025-05-01T23:22:32.567Z (about 1 year ago)
- Topics: eleventy, hacktoberfest, modern-web, rollup, static-site-generator, web-components
- Language: JavaScript
- Homepage: https://rocket.modern-web.dev
- Size: 30.3 MB
- Stars: 373
- Watchers: 12
- Forks: 52
- Open Issues: 59
-
Metadata Files:
- Readme: README.md
- Contributing: CONTRIBUTING.md
- Funding: .github/FUNDING.yml
- License: LICENSE
- Code of conduct: CODE_OF_CONDUCT.md
Awesome Lists containing this project
README
> Rocket is in public alpha. Expect APIs and documentation to keep improving before 1.0.
Website
·
Start with AI
·
Discord Community
# Rocket
Rocket is a static-site metaframework for content sites and Web Component docs: HTML-first, zero JS
by default, AI-friendly, and deployable anywhere.
- **Start with AI:** Copy the starter prompt, paste it into Claude, Cursor, Codex, or another
coding agent, and get a deployable Rocket site made of plain files.
- **Content first:** Write durable pages in Markdown, then opt into JavaScript only when it helps.
- **Explicit routes:** Each Page owns its public URL with `config.path`, independent of file
location.
- **Component loading:** Choose `server`, `client`, or `hydrate:*` per Registered Component.
- **Modern Web stack:** Build on Lit, Vite, and Modern Web tooling without hiding the underlying
configuration.
Rocket is not a SPA framework, React/Vite/Astro replacement, or backend application framework. Use
it when the output should mostly be static HTML and the source should stay easy for humans and
coding agents to inspect.
Start With AI ▶
·
Manual Quick Start
## Five-minute path
Use [Start With AI](https://rocket.modern-web.dev/setup/build-with-ai/) when you want an agent to
create the project shell, pages, layout, metadata, and Netlify config for you:
1. Copy the Rocket prompt.
2. Paste it into Claude, Cursor, Codex, or another coding agent with a short Site Brief.
3. Let the agent create the files, run `npm run build`, and fix failures.
4. Keep the plain Markdown, JavaScript, CSS, and config files afterward.
Rocket requires Node.js 22 or newer.
For a manual project, install the package from npm:
```bash
npm install @rocket/js
npx rocket init
```
`rocket init` creates a compact Atlas docs starter, including `rocket-config.js`,
`docs/pages/sharedData.js`, starter Markdown Pages, a static JSON Page for a Request Demo, and a
removable project-local Rocket Agent Skill. It also adds npm scripts when the names are available:
```json
{
"type": "module",
"scripts": {
"start": "rocket start",
"build": "rocket build"
},
"dependencies": {
"@rocket/js": "^0.1.0"
}
}
```
The generated `rocket-config.js` discovers general documentation Pages under `docs/pages` and
colocated component reference Pages under `src`:
```js
/** @type {import('@rocket/js/types.js').RocketConfig} */
export default {
includeGlobs: ['docs/pages/**/*.rocket.{md,js}', 'src/**/*.rocket.{md,js}'],
};
```
The generated `docs/pages/index.rocket.md` gives you an Atlas hero home Page:
````md
```js server
export const config = {
path: '/',
metadata: {
title: 'Rocket Site',
description: 'Documentation built with Rocket.',
},
menu: {
iconName: 'house',
order: 0,
},
};
import { atlasHeroLayout, atlasHeroComponents } from '@rocket/js/layouts/atlasHero.js';
import { heroData } from './sharedData.js';
export const components = atlasHeroComponents;
export const layout = pageData => atlasHeroLayout(pageData, heroData);
```
# Rocket Site
This starter is rendered with Rocket's Atlas hero layout.
````
Then run:
```bash
npm start
npm run build
```
The build writes static output to `dist/`:
```txt
dist/
|-- index.html
`-- assets/
```
Follow the [Manual Quick Start](https://rocket.modern-web.dev/setup/manual-quick-start/) when you
want to create the smallest working project by hand.
## When to use Rocket
Use Rocket for:
- content-first static sites
- documentation sites
- Web Component and design-system docs
- AI-generated sites you want to own afterward
- pages that should ship as HTML before JavaScript
Do not use Rocket for:
- SPA products with complex client-side routing
- backend applications
- projects that need a large plugin ecosystem today
- teams that specifically want React, Astro, Eleventy, or VitePress conventions
## Package and dependency philosophy
Rocket optimizes the generated site output, not the npm dependency count. A Rocket project installs
`@rocket/js` and gets the build pipeline, Markdown processing, dev server, Lit-based server
rendering, and docs-layout affordances in one package. Visitor pages stay static by default, and
browser JavaScript is only emitted for loading strategies you choose.
## Status and docs
Rocket is currently in **public alpha** at `0.1.x`. APIs can change before `1.0.0`;
breaking changes are documented through changesets and release notes.
- [Start With AI](https://rocket.modern-web.dev/setup/build-with-ai/)
- [Manual Quick Start](https://rocket.modern-web.dev/setup/manual-quick-start/)
- [Build a Site](https://rocket.modern-web.dev/tutorials/acme-ui-docs)
- [Examples](https://rocket.modern-web.dev/examples)
- [Reference](https://rocket.modern-web.dev/reference)
- [Known Limitations](https://rocket.modern-web.dev/help/known-limitations)
- [Roadmap](./ROADMAP.md)
Rocket is part of the [Modern Web Family](https://modern-web.dev/discover/about/).
## Working on this repo
```bash
npm ci
npm start
npm run types
npm test
npm run lint
```
`npm start` runs the Rocket docs site. `npm test` runs the Node test suite.
## 🤝 Contributing
We are always looking for contributors of all skill levels! If you're looking to ease your way into the project, try out a [good first issue](https://github.com/modernweb-dev/rocket/issues?q=is%3Aissue+is%3Aopen+label%3A%22good+first+issue%22).
If you are interested in helping contribute to Modern Web, please take a look at our [Contributing Guide](https://github.com/modernweb-dev/rocket/blob/main/CONTRIBUTING.md). Also, feel free to drop into [Discord](https://rocket.modern-web.dev/chat) and say hi. 👋
### Financial Contributors
Become a financial contributor and help us sustain our community. [[Contribute](https://opencollective.com/modern-web/contribute)]
## License
Rocket is released under the [MIT License](./LICENSE).