create-mcfly
v0.3.13
Published
Create a new McFly app
Downloads
8
Readme
npm create mcfly@latest
Features
The time has come for vanilla Web tech. 🎉
✅ Create web apps with vanilla custom elements ✅ Write real .HTML files ✅ Have no frameworks or reactivity libraries on the browser ✅ Use server-side rendering ✅ Deploy anywhere
Special directories
1. ./src/pages/
- file-based routing for
.html
files - directly use custom elements & static fragments (no imports or registry maintenance needed)
- use
<script server:setup>
to define logic that runs on the server, which then gets stripped away
2. ./src/components/
- custom element constructor files (only
.js
files for now) - all components are automatically registered using their file names; a
hello-world.js
component can be used as<hello-world>
- static
.html
fragments; amy-header.html
fragment can be directly used as<my-header>
3. ./routes/api/
- file-based routing for REST API endpoints
- e.g.,
./routes/api/users.ts
can be accessed viahttp://<domain>/api/users
- TypeScript or JavaScript welcome!
McFly config
To tell McFly you want to use components, pass the mode (only "js"
for now) to the components
prop mcfly.config.ts
import defineConfig from "./packages/define-config";
export default defineConfig({
components: "js",
});
More info
This framework is a result of an exploration for using Nitro and vanilla JS custom elements using a minimal Web Component Base class.
Nitro is the same production-grade web server powering Nuxt
Just keep building A project by Ayo Ayco