Home page for UTMIST.
Get familiar with the following language/framework/toolchain:
Yarnfor node package management.
npmas a prerequisite for
cdinto the root.
.pugtemplates in watch mode, run
One simple page/component
.pugfile in the repository root
.htmlfile with the same name as the
.pugfile is a component, include it in the existing
.pugfiles and compile
.pugand will get overwritten daily
Self-contained sub directory
localhost\new_site\, because Github will serve the page with
assets\: static assets such as images, video, large text
common\: components used to stitch together a web page
Fonts\,Log\: website branding
database\: JSON copies of UTMIST data, fetched from Google Sheets, used by Travis to generate the site. It is not really a database, but acts as the source of “business data”.
files\: files referenced by the
index.css,index.html,index.pug: entry point when users visit utmist.github.io
node_modules\: packages downloaded by npm or yarn. Not tracked by git.
.nojekyll: Github by default tries to build the repository with Jekyll, but our site is totally static, turning it off speeds up deployment (almost instant)
.travis.yml: configures how Travis builds the site, please put security tokens in Travis environment variables instead of here
compile.js: load in data from
database and compiles
watch.js: compile on file change, useful for development
fetch.js,fetch.ts: grabs info from Google Sheet and Google Drive and dump into
files\, used by Travis
package.json,yarn.lock: file used by yarn/npm to track dependencies
tsconfig.json: tells TypeScript how to check and compile
The build process is designed to minimize the manual house-keeping of the developer. For frequent changes such as adding events and adding members, Google Sheet API & Google Drive API pull the changes into the repository automatically. This process is run by Travis.
graph TD; Daily --> Google Dev("Commit to dev branch") --> Google Google("Google Drive & Sheet") --fetch.js--> Repo("dumped in database, files") Google --fail to fetch--> Nochange("Not built") Repo --compile.js--> Built("Generated HTML&CSS") Repo --fail to compile--> Nochange Built --> Github("Github Pages")
Remember to put Google API tokens and Github tokens in Travis environment variables, not in plain text anywhere in the repository.