diff --git a/README.md b/README.md index f0811f3..9188d7d 100644 --- a/README.md +++ b/README.md @@ -23,7 +23,7 @@ npm install top-bun ## Usage -``` console +```console $ top-bun --help Usage: top-bun [options] @@ -95,6 +95,30 @@ The core idea of `top-bun` is that a `src` directory of markdown, html and js "i It ships with sane defaults so that you can point `top-bun` at a standard [markdown documented repository](https://docs.github.com/en/get-started/writing-on-github/getting-started-with-writing-and-formatting-on-github) and have it build a website with near-zero preparation. +## Examples + +A collection of examples can be found in the [`./examples`](./examples) folder. + +To run examples: + +```console +$ git clone git@github.com:bcomnes/top-bun.git +$ cd top-bun +$ npm i +$ npm run example:{example-name} +$ npm i +$ npm start +``` + +### Additional examples + +Here are some additional external examples of larger top-bun projects. +If you have an project that uses top-bun and could act as a nice example, please PR it to the list! + +- [Blog Example](https://github.com/bcomnes/bret.io/) +- [Isomorphic Static/Client App](https://github.com/hifiwi-fi/breadcrum.net/tree/master/packages/web/client) +- [Zero-Conf Markdown Docs](https://github.com/bcomnes/deploy-to-neocities/blob/70b264bcb37fca5b21e45d6cba9265f97f6bfa6f/package.json#L38) + ## Pages Pages are a named directories inside of `src`, with **one of** the following page files inside of it. diff --git a/examples/preact/src/README.md b/examples/preact/src/README.md index 413312c..d9c4051 100644 --- a/examples/preact/src/README.md +++ b/examples/preact/src/README.md @@ -1,3 +1,5 @@ # Preact example -This is a preact example. +This is a preact example. + +[Isomorphic Component Rendering](./isomorphic/) diff --git a/examples/preact/src/isomorphic/client.js b/examples/preact/src/isomorphic/client.js index 84e66e8..cbd8fed 100644 --- a/examples/preact/src/isomorphic/client.js +++ b/examples/preact/src/isomorphic/client.js @@ -44,7 +44,7 @@ class App extends Component { } export const page = () => html` - <${App}/> + <${App} page="Isomorphic"/> <${Footer}>footer content here <${Footer}>footer content here ` diff --git a/examples/preact/src/layouts/root.layout.js b/examples/preact/src/layouts/root.layout.js index 8f06a41..66f4e42 100644 --- a/examples/preact/src/layouts/root.layout.js +++ b/examples/preact/src/layouts/root.layout.js @@ -48,12 +48,10 @@ export default function defaultRootLayout ({ `)} ${render(html` -
- ${typeof children === 'string' - ? html`
` - : html`
${children}
` - } -
+ ${typeof children === 'string' + ? html`
` + : html`
${children}
` + } `)} diff --git a/package.json b/package.json index af161c1..b1aa407 100644 --- a/package.json +++ b/package.json @@ -96,6 +96,7 @@ "clean:public": "rm -rf public && mkdir -p public", "clean:declarations-top": "rm -rf $(find . -maxdepth 1 -type f -name '*.d.ts*')", "clean:declarations-lib": "rm -rf $(find lib -type f -name '*.d.ts*' ! -name '*-types.d.ts')", + "clean-node_modules": "rm -rf node_modules && rm -rf examples/*/node_modules", "build": "npm run clean && run-p build:*", "build:top-bun": "./bin.js --src . --ignore examples,test-cases,coverage,*.tsconfig.json", "build:declaration": "tsc -p declaration.tsconfig.json", @@ -105,7 +106,7 @@ "example:string-layouts": "cd examples/string-layouts && npm i --production && npm run build", "example:default-layout": "cd examples/default-layout && npm i --production && npm run build", "example:nested-dest": "cd examples/nested-dest && npm i --production && npm run build", - "example-skip:uhtml-isomorphic": "cd examples/nested-dest && npm i --production && npm run build", + "example:preact": "cd examples/preact && npm i --production && npm run build", "deps": "depcruise --exclude '^node_modules|^[a-zA-Z0-9\\_]+$' --output-type dot . | dot -T svg > dependencygraph.svg", "deps3d": "depcruise --exclude '^node_modules|^[a-zA-Z0-9\\_]+$' --output-type plugin:dependency-cruiser/sample-3d-reporter-plugin --output-to 3d-dependency-graph.html .", "start": "npm run watch"