guides: Add instructions for multiple SSG tools (#122)

* guides: Add static structure and Hugo instructions

Update hugo.md

* guides: Add Astro instructions

* guides: Add Lume (Deno) instructions

* guides: Add 11ty instructions

* guides: Add Hexo instructions

* guides: Add Docusaurus instructions

* guides: Add MkDocs instructions

* guides: Add Nuxt instructions

* guides: Add mdBook instructions

* Move files and change paths

* Remove static cards partial

---------

Co-authored-by: David LEGRAND <[email protected]>
Co-authored-by: Julia March <[email protected]>

content/guides/_index.md

@@ -36,6 +36,25 @@ comments: false
 
 {{< /cards >}}
 
+## Static Site Generator (SSG)
+
+<br>
+<div class="mb-12">
+{{< hextra/hero-subtitle >}}
+  Use Clever Cloud as a runner to build an efficient static website and host it in minutes!&nbsp;<br class="sm:block hidden" />
+{{< /hextra/hero-subtitle >}}
+</div>{{< cards >}}
+ {{< card link="/guides/astro" title="Astro" subtitle= "Build and deploy a static Astro based website on Clever Cloud" icon="astro" >}}
+  {{< card link="/guides/docusaurus" title="Docusaurus" subtitle= "Build and deploy a static Docusaurus based website on Clever Cloud" icon="docusaurus" >}}
+  {{< card link="/guides/eleventy" title="Eleventy (11ty)" subtitle= "Build and deploy a static Eleventy (11ty) based website on Clever Cloud" icon="11ty" >}}
+ {{< card link="/guides/hexo" title="Hexo" subtitle= "Build and deploy a static Hexo based website on Clever Cloud" icon="hexo" >}}
+ {{< card link="/guides/hugo" title="Hugo" subtitle= "Build and deploy a static Hugo based website on Clever Cloud" icon="hugo" >}}
+  {{< card link="/guides/lume-deno" title="Lume (Deno)" subtitle= "Build and deploy a static Lume (Deno) based website on Clever Cloud" icon="deno" >}}
+  {{< card link="/guides/mkdocs" title="MkDocs" subtitle= "Build and deploy a static MkDocs based website on Clever Cloud" icon="docs" >}}
+  {{< card link="/guides/mdbook" title="mdBook" subtitle= "Build and deploy a static mbBook based website on Clever Cloud" icon="mdbook" >}}
+  {{< card link="/guides/nuxt" title="Nuxt" subtitle= "Build and deploy a static Nuxt based website on Clever Cloud" icon="nuxt" >}}
+{{< /cards >}}
+
 ## Starter Tutorials
 
 <br>

content/guides/astro.md

@@ -0,0 +1,39 @@
+---
+title: Astro
+description: Build your website with the Astro Static Site Generator (SSG) and host it on Clever Cloud. No dedicated runner needed.
+tags:
+- guides
+keywords:
+- astro 
+- nodejs
+- static
+- ssg
+- html
+- js
+- css
+- website
+type: "docs"
+comments: false
+draft: false
+---
+If you need an example source code, get [Astrowind](https://github.com/onwidget/astrowind) (you'll need [git](https://git-scm.com/book/en/v2/Getting-Started-Installing-Git) and [Node.js](https://nodejs.org/en/learn/getting-started/how-to-install-nodejs)):
+```bash
+git clone https://github.com/onwidget/astrowind myStaticApp
+```
+
+{{< readfile file="guides/create-static.md" >}}
+
+## Configure environment variables
+Next, we configure the application with a medium build instance to quickly generate static files. The host instance is nano-sized, enough for a simple website. As Clever Cloud is based on standards, you only need to define a few variables:
+```bash
+clever scale --build-flavor M
+clever scale --flavor nano
+
+clever env set CC_NODE_VERSION "20"
+clever env set CC_WEBROOT "/dist"
+clever env set CC_OVERRIDE_BUILDCACHE "/dist"
+clever env set CC_PRE_BUILD_HOOK "npm install && npm run astro telemetry disable"
+clever env set CC_POST_BUILD_HOOK "npm run build"
+```
+
+{{< readfile file="guides/git-push.md" >}}

content/guides/docusaurus.md

@@ -0,0 +1,39 @@
+---
+title: Docusaurus
+description: Build your website with the Docusaurus Static Site Generator (SSG) and host it on Clever Cloud. No dedicated runner needed.
+tags:
+- guides
+keywords:
+- docusaurus
+- nodejs
+- static
+- ssg
+- html
+- js
+- css
+- website
+type: "docs"
+comments: false
+draft: false
+---
+If you need an example source code, init a new project (you'll need [git](https://git-scm.com/book/en/v2/Getting-Started-Installing-Git) and [Node.js](https://nodejs.org/en/learn/getting-started/how-to-install-nodejs)): 
+```bash
+npx create-docusaurus@latest myStaticApp classic
+```
+
+{{< readfile file="guides/create-static.md" >}}
+
+## Configure environment variables
+Next, we configure the application with a medium build instance to quickly generate static files. The host instance is nano-sized, enough for a simple website. As Clever Cloud is based on standards, you only need to define a few variables:
+```bash
+clever scale --build-flavor M
+clever scale --flavor nano
+
+clever env set CC_NODE_VERSION "20"
+clever env set CC_WEBROOT "/build"
+clever env set CC_OVERRIDE_BUILDCACHE "/build"
+clever env set CC_PRE_BUILD_HOOK "npm install"
+clever env set CC_POST_BUILD_HOOK "npx docusaurus build"
+```
+
+{{< readfile file="guides/git-push.md" >}}

content/guides/eleventy.md

@@ -0,0 +1,40 @@
+---
+title: Eleventy (11ty)
+description: Build your website with the Eleventy (11ty) Static Site Generator (SSG) and host it on Clever Cloud. No dedicated runner needed.
+tags:
+- guides
+keywords:
+- Eleventy
+- 11ty
+- nodejs
+- static
+- ssg
+- html
+- js
+- css
+- website
+type: "docs"
+comments: false
+draft: false
+---
+If you need an example source code, get [11ty base blog](https://github.com/11ty/eleventy-base-blog) (you'll need [git](https://git-scm.com/book/en/v2/Getting-Started-Installing-Git) and [Node.js](https://nodejs.org/en/learn/getting-started/how-to-install-nodejs)):
+```bash
+git clone https://github.com/11ty/eleventy-base-blog myStaticApp
+```
+
+{{< readfile file="guides/create-static.md" >}}
+
+## Configure environment variables
+Next, we configure the application with a medium build instance to quickly generate static files. The host instance is nano-sized, enough for a simple website. As Clever Cloud is based on standards, you only need to define a few variables:
+```bash
+clever scale --build-flavor M
+clever scale --flavor nano
+
+clever env set CC_NODE_VERSION "20"
+clever env set CC_WEBROOT "/_site"
+clever env set CC_OVERRIDE_BUILDCACHE "/_site"
+clever env set CC_PRE_BUILD_HOOK "npm install"
+clever env set CC_POST_BUILD_HOOK "npx @11ty/eleventy"
+```
+
+{{< readfile file="guides/git-push.md" >}}

content/guides/hexo.md

@@ -0,0 +1,44 @@
+---
+title: Hexo
+description: Build your website with the Hexo Static Site Generator (SSG) and host it on Clever Cloud. No dedicated runner needed.
+tags:
+- guides
+keywords:
+- hexo
+- nodejs
+- static
+- ssg
+- html
+- js
+- css
+- website
+type: "docs"
+comments: false
+draft: false
+---
+If you need an example source code, get [Cactus](https://github.com/probberechts/hexo-theme-cactus) (you'll need [git](https://git-scm.com/book/en/v2/Getting-Started-Installing-Git) and [Node.js](https://nodejs.org/en/learn/getting-started/how-to-install-nodejs)):
+```bash
+git clone https://github.com/probberechts/hexo-theme-cactus myStaticApp
+```
+
+For this project to work, don't import the theme with `git clone` but as a submodule: 
+```bash
+git submodule add https://github.com/probberechts/hexo-theme-cactus.git themes/cactus 
+```
+
+{{< readfile file="guides/create-static.md" >}}
+
+## Configure environment variables
+Next, we configure the application with a medium build instance to quickly generate static files. The host instance is nano-sized, enough for a simple website. As Clever Cloud is based on standards, you only need to define a few variables:
+```bash
+clever scale --build-flavor M
+clever scale --flavor nano
+
+clever env set CC_NODE_VERSION "20"
+clever env set CC_WEBROOT "/public"
+clever env set CC_OVERRIDE_BUILDCACHE "/public"
+clever env set CC_PRE_BUILD_HOOK "npm i -g hexo && npm install"
+clever enc set CC_POST_BUILD_HOOK "hexo generate"
+```
+
+{{< readfile file="guides/git-push.md" >}}

content/guides/hugo.md

@@ -0,0 +1,49 @@
+---
+title: Hugo
+description: Build your website with the Hugo Static Site Generator (SSG) and host it on Clever Cloud. No dedicated runner needed.
+tags:
+- guides
+keywords:
+- hugo
+- static
+- ssg
+- html
+- js
+- css
+- website
+type: "docs"
+comments: false
+draft: false
+---
+If you need an example source code, use [Theme mini](https://github.com/nodejh/hugo-theme-mini) (you'll need [git](https://git-scm.com/book/en/v2/Getting-Started-Installing-Git) and [Hugo](https://gohugo.io/installation/)):
+```bash
+git clone https://github.com/nodejh/hugo-theme-mini myStaticApp
+```
+{{< readfile file="guides/create-static.md" >}}
+
+## Configure environment variables and deploy script
+Next, configure the application with a medium build instance to quickly generate static files. The host instance is nano-sized, enough for a simple website. As Clever Cloud is based on standards, you only need to define a few variables:
+```bash
+clever scale --build-flavor M
+clever scale --flavor nano
+
+clever env set CC_WEBROOT "/public"
+clever env set CC_OVERRIDE_BUILDCACHE "/public"
+clever env set CC_PRE_BUILD_HOOK "bash setup_hugo.sh"
+clever env set CC_POST_BUILD_HOOK "hugo --minify --gc"
+```
+Edit the deploy script (`setup_hugo.sh`) with this content:
+```bash
+HUGO_VERSION="0.121.1"
+HUGO_URL="https://github.com/gohugoio/hugo/releases/download/v${HUGO_VERSION}/hugo_extended_${HUGO_VERSION}_linux-amd64.tar.gz"
+DEST_BIN="${HOME}/.local/bin"
+FILENAME="hugo.tar.gz"
+
+# Download Hugo Extended and place it in a folder in the $PATH
+curl --create-dirs -s -L -o ${DEST_BIN}/${FILENAME} ${HUGO_URL}
+cd ${DEST_BIN}
+tar xvf ${FILENAME} -C ${DEST_BIN}
+rm ${FILENAME}
+```
+
+{{< readfile file="guides/git-push.md" >}}

content/guides/lume-deno.md

@@ -0,0 +1,50 @@
+---
+title: Lume (Deno)
+description: Build your website with Lume Static Site Generator (SSG) using Deno and host it on Clever Cloud. No dedicated runner needed.
+tags:
+- guides
+keywords:
+- deno
+- lume
+- static
+- ssg
+- html
+- js
+- css
+- website
+type: "docs"
+comments: false
+draft: false
+---
+If you need an example source code, use [Lume website](https://github.com/lumeland/lume.land) (you'll need [git](https://git-scm.com/book/en/v2/Getting-Started-Installing-Git) and [Deno](https://docs.deno.com/runtime/manual#install-deno)):
+```bash
+git clone https://github.com/lumeland/lume.land myStaticApp
+```
+{{< readfile file="guides/create-static.md" >}}
+
+## Configure environment variables and deploy script
+Next, configure the application with a medium build instance to quickly generate static files. The host instance is nano-sized, enough for a simple website. As Clever Cloud is based on standards, you only need to define a few variables:
+```bash
+clever scale --build-flavor M
+clever scale --flavor nano
+
+clever env set CC_WEBROOT "/_site"
+clever env set CC_OVERRIDE_BUILDCACHE "/_site"
+clever env set CC_PRE_BUILD_HOOK "bash setup_deno.sh"
+clever env set CC_POST_BUILD_HOOK "deno task lume"
+```
+Edit the deploy script (`setup_deno.sh`) with this content:
+```bash
+DENO_VERSION="1.39.1"
+DENO_URL="https://github.com/denoland/deno/releases/download/v${DENO_VERSION}/deno-x86_64-unknown-linux-gnu.zip"
+DEST_BIN="${HOME}/.local/bin"
+FILENAME="deno.zip"
+
+# Download Deno and place it in a folder in the $PATH
+curl --create-dirs -s -L -o ${DEST_BIN}/${FILENAME} ${DENO_URL}
+cd ${DEST_BIN}
+unzip ${FILENAME} -d ${DEST_BIN}
+rm ${FILENAME}
+```
+
+{{< readfile file="guides/git-push.md" >}}

content/guides/mdbook.md

@@ -0,0 +1,39 @@
+---
+title: mdBook
+description: Build your website with the mdBook Static Site Generator (SSG) and host it on Clever Cloud. No dedicated runner needed.
+tags:
+- guides
+keywords:
+- mdbook
+- rust
+- static
+- ssg
+- html
+- js
+- css
+- website
+type: "docs"
+comments: false
+draft: false
+---
+If you need an example source code, init a new project (you'll need [git](https://git-scm.com/book/en/v2/Getting-Started-Installing-Git) and [Rust](https://www.rust-lang.org/tools/install)): 
+```bash
+cargo install mdbook
+mdbook init myStaticApp --title="my mdBook" --ignore=git
+```
+
+{{< readfile file="guides/create-static.md" >}}
+
+## Configure environment variables
+Next, we configure the application with a medium build instance to quickly generate static files. The host instance is nano-sized, enough for a simple website. As Clever Cloud is based on standards, you only need to define a few variables:
+```bash
+clever scale --build-flavor M
+clever scale --flavor nano
+
+clever env set CC_WEBROOT "/book"
+clever env set CC_OVERRIDE_BUILDCACHE "/book"
+clever env set CC_PRE_BUILD_HOOK "cargo install mdbook"
+clever env set CC_POST_BUILD_HOOK "/home/bas/.cargo/bin/mdbook build"
+```
+
+{{< readfile file="guides/git-push.md" >}}

content/guides/mkdocs.md

@@ -0,0 +1,40 @@
+---
+title: MkDocs
+description: Build your website with the MkDocs Static Site Generator (SSG) and host it on Clever Cloud. No dedicated runner needed.
+tags:
+- guides
+keywords:
+- mkdocs
+- python
+- static
+- ssg
+- html
+- js
+- css
+- website
+type: "docs"
+comments: false
+draft: false
+---
+If you need an example source code, init a new project (you'll need [git](https://git-scm.com/book/en/v2/Getting-Started-Installing-Git), [Python](https://wiki.python.org/moin/BeginnersGuide/Download) and [pip](https://pip.pypa.io/en/stable/installation/)): 
+```bash
+# Use pip or pip3 depending on your system
+pip install mkdocs 
+mkdocs new myStaticApp
+```
+
+{{< readfile file="guides/create-static.md" >}}
+
+## Configure environment variables
+Next, we configure the application with a medium build instance to quickly generate static files. The host instance is nano-sized, enough for a simple website. As Clever Cloud is based on standards, you only need to define a few variables:
+```bash
+clever scale --build-flavor M
+clever scale --flavor nano
+
+clever env set CC_WEBROOT "/site"
+clever env set CC_OVERRIDE_BUILDCACHE "/site"
+clever env set CC_PRE_BUILD_HOOK "python3 -m ensurepip --upgrade && pip3 install mkdocs"
+clever env set CC_POST_BUILD_HOOK "mkdocs build"
+```
+
+{{< readfile file="guides/git-push.md" >}}