Roadmap
🎉 DONE
- Set up
rollup
+babel
build step- transpile, uglify ES6+ (prod only), copy
index.html
- transpile, uglify ES6+ (prod only), copy
- Wire up
preact
+preact-router
h
pragma inbabel
, initial routes, 404 fallback
- Add
bulma
+rollup
CSS plugin- concat into static
styles.css
only, not runtime
- concat into static
- Convert Markdown to HTML in JSON
unified
libs + script to loop files, generatehtml
, & embed injson
- Fetch JSON & inject HTML for each route
- page component, either fetch
[/path].json
or rendercomponent
prop - loading state; render
<Error />
if failed to load or404
- page component, either fetch
- Set up pre-rendering (
react-snapshot
)- crawl all pages & generate static HTML, then hydrate on FE
- Enable nested routes, e.g.
/blog/how-i-build-this-site
- loop recursively & mirror tree structure & filenames
- Generate
index.json
listing for each subdir (/blog
,/series
)- should include embed metadata in
md
- title, published at (Unix timestamp), tags, img URL
- posts should be ordered by publish date (desc)
- should include embed metadata in
- Only pull in required Bulma modules (
saas
)- customizing vars (need rollup saas plugin)
- Add subtle loading effect (
nanobar
)
🏗️ TODO
- Markdown themes (e.g. GitHub), code snippets highlight
- Embed
[hash]
in assets filename (rollup
plugin) - Load
/build/img/*.png
assets + minify withimagemin
- allow embeding img in
md
files? (raw<img />
HTML)
- allow embeding img in
- Set up unit tests with
jest
-
.editorconfig
file -
sitemap.xml
,robots.txt
(ignorejson
?) - GA signup + add script
- Don't (re-)generate json if MD didn't change?
-
es
(type='module')
andiife
(nomodule
, IE 11?) bundles (see this)⚠️ blocked byrollup-plugin-terser
- scripts can be executable binaries (see this)
- Set up a build pipeline (lint, test, build)
- Deploy to static host (Now / Surge) + domain
🚀 POC
- replace
preact
withinferno
+inferno-router
- compare bundle size, load time benchmarks, composition vs inheritance
- email contact form + reCAPTCHA
- disqus comments for each blog post / video