Compare commits
1 commit
main
...
new-conten
| Author | SHA1 | Date | |
|---|---|---|---|
| ce4c2a0716 |
6 changed files with 126 additions and 1 deletions
1
.urlview
Normal file
1
.urlview
Normal file
|
|
@ -0,0 +1 @@
|
||||||
|
BROWSER=firefox
|
||||||
21
packages/content/LICENSE
Normal file
21
packages/content/LICENSE
Normal file
|
|
@ -0,0 +1,21 @@
|
||||||
|
MIT License
|
||||||
|
|
||||||
|
Copyright (c) 2023 Ayo Ayco
|
||||||
|
|
||||||
|
Permission is hereby granted, free of charge, to any person obtaining a copy
|
||||||
|
of this software and associated documentation files (the "Software"), to deal
|
||||||
|
in the Software without restriction, including without limitation the rights
|
||||||
|
to use, copy, modify, merge, publish, distribute, sublicense, and/or sell
|
||||||
|
copies of the Software, and to permit persons to whom the Software is
|
||||||
|
furnished to do so, subject to the following conditions:
|
||||||
|
|
||||||
|
The above copyright notice and this permission notice shall be included in all
|
||||||
|
copies or substantial portions of the Software.
|
||||||
|
|
||||||
|
THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
|
||||||
|
IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
|
||||||
|
FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE
|
||||||
|
AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER
|
||||||
|
LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,
|
||||||
|
OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE
|
||||||
|
SOFTWARE.
|
||||||
88
packages/content/README.md
Normal file
88
packages/content/README.md
Normal file
|
|
@ -0,0 +1,88 @@
|
||||||
|
<p align="center">
|
||||||
|
<img width="250" src="https://git.sr.ht/~ayoayco/mcfly/blob/main/assets/mcfly-logo-sm.png" alt="rRick & Morty cartoon" />
|
||||||
|
</p>
|
||||||
|
|
||||||
|
<h1 align="center">McFly Content</h1>
|
||||||
|
|
||||||
|
<p align="center"><strong>McFly</strong> is a no-framework metaframework<br />that assists in building on the Web</p>
|
||||||
|
|
||||||
|
<p align="center">
|
||||||
|
<img src="https://img.shields.io/badge/from-the_future-blue?style=flat" />
|
||||||
|
<img src="https://img.shields.io/badge/status-legit-purple?style=flat" />
|
||||||
|
<a href="https://mcfly.js.org/demo" target="_blank"><img src="https://img.shields.io/badge/see-the_demo_↗️-blue?style=flat&colorB=28CF8D" /></a>
|
||||||
|
</p>
|
||||||
|
|
||||||
|
## Why
|
||||||
|
|
||||||
|
I often wonder what it would look like to build sites & apps knowing just the basics.
|
||||||
|
|
||||||
|
I thought:
|
||||||
|
|
||||||
|
- What if I knew how to write [HTML](https://developer.mozilla.org/en-US/docs/Web/HTML) and I can have a dynamic web page from that?
|
||||||
|
- What if I knew how to build [custom elements](https://developer.mozilla.org/en-US/docs/Web/API/Web_components/Using_custom_elements) and that's all the component system I needed?
|
||||||
|
- What if I can write [HTML fragments](https://developer.mozilla.org/en-US/docs/Web/API/DocumentFragment) and [assemble them](https://developer.mozilla.org/en-US/docs/Web/API/Web_components/Using_shadow_DOM) easily in a page?
|
||||||
|
- What if I did not have to worry about the [ever-growing number of ways to have a place on the Web](https://ayos.blog/places-in-the-web/)?
|
||||||
|
|
||||||
|
**McFly** is my reimagination of web development: Back to the basics. Into the future.
|
||||||
|
|
||||||
|
## Project Status
|
||||||
|
|
||||||
|
We are currently in a Proof of Concept phase. All parts are subject to breaking changes in minor releases.
|
||||||
|
|
||||||
|
## Try it today
|
||||||
|
|
||||||
|
Run the following to generate a McFly starter project.
|
||||||
|
|
||||||
|
```
|
||||||
|
npm create mcfly@latest
|
||||||
|
```
|
||||||
|
|
||||||
|
## Features
|
||||||
|
|
||||||
|
✅ Use vanilla custom elements (or sugar-coated web components)<br>
|
||||||
|
✅ Write server-powered .html pages<br>
|
||||||
|
✅ "Use the Platform™" on both server runtimes & browsers<br>
|
||||||
|
✅ Use server-side rendering<br>
|
||||||
|
✅ Deploy anywhere, even the Edge<br>
|
||||||
|
|
||||||
|
## 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; a `my-header.html` fragment can be directly used as `<my-header>`
|
||||||
|
|
||||||
|
**3. `./src/api/`**
|
||||||
|
|
||||||
|
- file-based routing for REST API endpoints
|
||||||
|
- e.g., `./src/api/users.ts` can be accessed via `http://<domain>/api/users`
|
||||||
|
- TypeScript or JavaScript welcome!
|
||||||
|
|
||||||
|
## Packages
|
||||||
|
|
||||||
|
The following are the project packages published on the NPM registry:
|
||||||
|
|
||||||
|
| Package | Description | Version |
|
||||||
|
| ------------------------------------------------------ | -------------------------------------------- | ---------------------------------------------------------------- |
|
||||||
|
| [`@mcflyjs/cli`](https://ayco.io/n/@mcflyjs/cli) | The McFly CLI tooling |  |
|
||||||
|
| [`@mcflyjs/config`](https://ayco.io/n/@mcflyjs/config) | Nitro server config for McFly projects |  |
|
||||||
|
| [`@mcflyjs/core`](https://ayco.io/n/@mcflyjs/core) | Route event and config handlers |  |
|
||||||
|
| [`create-mcfly`](https://ayco.io/n/create-mcfly) | Script for scaffolding a new McFly workspace |  |
|
||||||
|
|
||||||
|
## More info
|
||||||
|
|
||||||
|
This framework is a result of [an exploration](https://social.ayco.io/@ayo/111195315785886977) for using [Nitro](https://nitro.unjs.io) and vanilla JS custom elements using a minimal [Web Component Base](https://WebComponent.io) class.
|
||||||
|
|
||||||
|
**Nitro** is the same production-grade web server powering [Nuxt](https://nuxt.com/)
|
||||||
|
|
||||||
|
---
|
||||||
|
|
||||||
|
_Just keep building_<br />
|
||||||
|
_A project by [Ayo](https://ayco.io)_
|
||||||
3
packages/content/index.js
Normal file
3
packages/content/index.js
Normal file
|
|
@ -0,0 +1,3 @@
|
||||||
|
export default () => {
|
||||||
|
console.log('>>> content plugin')
|
||||||
|
}
|
||||||
11
packages/content/package.json
Normal file
11
packages/content/package.json
Normal file
|
|
@ -0,0 +1,11 @@
|
||||||
|
{
|
||||||
|
"name": "@mcflyjs/content",
|
||||||
|
"version": "0.0.1",
|
||||||
|
"description": "McFly plugin for static content generation",
|
||||||
|
"main": "index.js",
|
||||||
|
"scripts": {
|
||||||
|
"test": "echo \"Error: no test specified\" && exit 1"
|
||||||
|
},
|
||||||
|
"author": "Ayo Ayco",
|
||||||
|
"license": "MIT"
|
||||||
|
}
|
||||||
|
|
@ -1,10 +1,11 @@
|
||||||
// @ts-check
|
// @ts-check
|
||||||
import { defineMcFlyConfig } from '@mcflyjs/config'
|
import { defineMcFlyConfig } from '@mcflyjs/config'
|
||||||
// import testPlugin from './test-plugin.mjs'
|
// import testPlugin from './test-plugin.mjs'
|
||||||
|
// import content from '@mcflyjs/content'
|
||||||
|
|
||||||
export default defineMcFlyConfig({
|
export default defineMcFlyConfig({
|
||||||
components: 'js',
|
components: 'js',
|
||||||
// plugins: [testPlugin()],
|
// plugins: [testPlugin(), content()],
|
||||||
nitro: {
|
nitro: {
|
||||||
preset: 'netlify',
|
preset: 'netlify',
|
||||||
devServer: {
|
devServer: {
|
||||||
|
|
|
||||||
Loading…
Reference in a new issue