Static sites

Static sites are used in two context at Nasqueron:

1. Information static sites. Sites with only static content
2. JavaScript front-end clients. Sites with dynamic back-end: the HTML site uses JS to communicate with the back-end through a REST API.

Static site template

We build the first sites from the Foundation CSS framework ZURB template.

This approach works well for pure static sites, or for JS clients to query an API like we do in infra-www.

Your site is composed of two parts:

• a src/ folder with your site assets (JS, CSS), pages and data
• a build mechanism driven by Gulp

This is perfect to quickly assemble a site, especially as we can do it on Jenkins for CD.

If you use frameworks like React/Vue and want to make them manage your site routing and structure, don't use this template.

Create a site in 2023

To get the build mechanism right, as of 2023-05-28, take it from the join and infra-www:

   git clone ...
   cd ...
   rm -rf src/ .git

You'll then get a folder with a correct build mechanism, and can create from there your own repository:

   git init .
   $EDITOR .babelrc .browserslistrc config.yml gulpfile.babel.js package.json readme.md
   git add .
   git commit -m "Build a new static site"

Then, copy a fresh src/ folder from the foundation/foundation-zurb-template repository.

Follow your README instructions to build your site: yarn install then yarn install and you're ready to work on it and build your site :)

Upsection

We need to maintain dependencies for the Gulp/handlebars site builder across several repositories. The dependencies are brittle, security issues will require to upgrade to a version of a package invoked by gulp-<feature>, but gulp-<feature> will be abandoned and unmaintained. That's the usual scenario. When it's maintained, the way to load the library in JS has changed.

That hard maintenance problem requires an unified solution, to be able to do it one for all the sites. Upsection is the name of this ongoing effort to maintain, and provide a tool to populate the dependencies and build the site with a simple `make`. Proof of concept lives in upsection.

A second advantage is the current repository creation process is a little bit cumbersome, as highlighted by the previous sections instructions to fetch the build mechanism and the src/ folder in two different sources.

Upsection repository contains our full usable template in ONE place.

As of 2023-05, Upsection dependencies aren't up-to-date, so you'll need if you use it to upgrade Node packages to the one used in join or infra-www.

Build Vue.js application

Nidal uses another strategy for servpulse: Vue.js provides a CLI tool to bootstrap a web site, and Foundation is added afterwards:

npm init vue@latest