• Static Site Generator
  • Docusaurus - React
• for Wiki
  • Sphinx - Python
    • Themes
    • Static Files
    • Table
    • Diagrams
  • MkDocs - Python
    • mkdocs.yml
• for Blogs
  • Pelican - Python
• Cloudflare Pages
• Github pages
  • Github Actions - SSR
  • Issue Blog
• Free Hosting
• Demos

Static Site Generator¶

• ISR (incremental static regeneration)
• CSR(client-side rendering)
• SSG (Static Site Generation)
• SSR (server-side rendering)

https://github.com/myles/awesome-static-generators

• Vite powered/Unused JavaScript: https://astro.build/
• Vite & Vue powered: https://github.com/vuejs/vitepress
• Jekyll theme with search : https://github.com/just-the-docs/just-the-docs
• Antora: multi repo into 1: https://docs.antora.org/antora/latest/
• Jupyter: https://curvenote.com/docs/web/notebooks
• RMarkdown: https://rmarkdown.rstudio.com/docs/reference/publish_site.html

Docusaurus - React¶

• https://opensource.fb.com/projects/docusaurus/
• https://docusaurus.io/docs/creating-pages
• Docs Only: https://docusaurus.io/docs/docs-introduction#docs-only-mode
• Blog Only: https://docusaurus.io/docs/blog#advanced-topics
• Offline Search: https://docusaurus.io/docs/search#using-local-search
• draw / mermaid: https://docusaurus.io/docs/markdown-features/diagrams

for Wiki¶

Sphinx - Python¶

reStructuredText -> HTML, PDF, plain text, EPUB, TeX - Start: https://www.sphinx-doc.org/en/master/tutorial/getting-started.html - toctree options: https://www.sphinx-doc.org/en/master/usage/restructuredtext/directives.html

GraphiQL: https://github.com/hasura/sphinx-graphiql

Themes¶

Builtin: https://www.sphinx-doc.org/en/master/usage/theming.html#builtin-themes - only the Alabaster and Scrolls themes are mobile-optimated

Templating/blocks: https://www.sphinx-doc.org/en/master/development/templating.html#blocks

Read the Docs theme with custom footer: https://github.com/readthedocs/sphinx_rtd_theme/blob/master/sphinx_rtd_theme/footer.html

html_show_sphinx = False # conf.py

# %templates_path%/footer.html    
{% extends "!footer.html" %}
{%- block extrafooter %}

{% endblock %}

Static Files¶

https://www.sphinx-doc.org/en/master/usage/configuration.html - html_static_path / html_css_files / html_js_files - html_additional_pages: .html files

Table¶

https://docs.espressif.com/projects/esp-docs/en/latest/writing-documentation/table.html - span: https://return42.github.io/linuxdoc/linuxdoc-howto/table-markup.html#flat-table

Diagrams¶

https://chiplicity.readthedocs.io/en/latest/Using_Sphinx/UsingGraphicsAndDiagramsInSphinx.html

MkDocs - Python¶

mkdocs.yml¶

• https://github.com/mkdocs/mkdocs/blob/master/mkdocs.yml
• https://github.com/mkdocs/mkdocs/blob/master/mkdocs/tests/integration/complicated_config/mkdocs.yml
• https://gitlab.liris.cnrs.fr/pagoda/tools/mkdocs_template/-/blob/develop/user_config/mkdocs.local.yml

for Blogs¶

Pelican - Python¶

Markdown, reStructuredText, and HTML - default theme -> blog : https://www.smashingmagazine.com/ - https://github.com/getpelican/pelican - https://docs.getpelican.com/en/latest/index.html#documentation

Cloudflare Pages¶

.pages.dev: https://developers.cloudflare.com/pages/platform/build-configuration/#framework-presets - Static: Framework presets = None - Vue 3: env NODE_VERSION>14.18

1 github repo => 1 cf project = 1 build kernel (ref)

Github pages¶

CNAME: .github.io

Gihub token: https://github.com/settings/tokens

Github Actions - SSR¶

https://docs.github.com/en/actions/quickstart

.github/workflows

check usage: https://github.com/settings/billing

Issue Blog¶

Vue + JS: https://github.com/Yidadaa/Issue-Blog-With-Github-Action

Free Hosting¶

Free	Storage	month
Github	500 MB	2000 min
Cloudflare	25MiB/site	500 times
vercel		100GB b/w
netlify	500 sites	100GB b/w(then $55 per 100GB)

Demos¶

• vite --template vue : https://github.com/fzinfz/test-vue3/tree/vite-js-quasar
• https://test-vue3.pages.dev/
• astro --template blog : https://github.com/fzinfz/test-pages/tree/astro.blog
• https://test-pages-7ku.pages.dev/