Merge pull request #149 from w3c/docusaurus-env

Environment Variables for Tutorial Website

.github/workflows/whatiswot-deploy.yml

@@ -11,6 +11,8 @@ jobs:
   deploy:
     name: Deploy to GitHub Pages
     runs-on: ubuntu-latest
+    env:
+      baseurl: "/wot-cg/tutorials/whatiswot/"
     steps:
       - uses: actions/checkout@v3
       - uses: actions/setup-node@v3

.gitignore

@@ -2,3 +2,4 @@
 node_modules
 Tutorials/whatiswot/website/deploy
 .idea/
+Tutorials/whatiswot/website/.env

Tutorials/whatiswot/README.md

@@ -1,6 +1,6 @@
 # What is WoT? - Tutorial series
 
 In this folder,  you can find all the resources for the `What is WoT?` tutorial series.
-These include the videos, slidesets for the animation, video scripts and organization information.
+These include the videos, slide sets for the animation, video scripts, and organization information.
 
-The videos are going to be published to YouTube and the website is available at https://w3c.github.io/wot-cg/tutorials/whatiswot/
+The videos are going to be published on YouTube and the website is available at <https://w3c.github.io/wot-cg/tutorials/whatiswot/>

Tutorials/whatiswot/website/README.md

@@ -0,0 +1,8 @@
+# What is WoT Tutorial Website
+
+## How to build
+
+- Install dependencies `npm install`
+- Set your environment variable for the base URL by creating a file called `.env` with the contents of `baseurl="/"`. This environment variable is set differently by GitHub actions and Netlify.
+- Run `npm run start` during development to create a live version of the website
+- Run `npm run build` to create the static files to be used in production environments

Tutorials/whatiswot/website/docusaurus.config.js

@@ -3,6 +3,7 @@
 
 const lightCodeTheme = require("prism-react-renderer/themes/github");
 const darkCodeTheme = require("prism-react-renderer/themes/dracula");
+require("dotenv").config();
 
 /** @type {import('@docusaurus/types').Config} */
 const config = {
@@ -15,7 +16,9 @@ const config = {
   url: "https://w3c.github.io",
   // Set the /<baseUrl>/ pathname under which your site is served
   // For GitHub pages deployment , it is often '/<projectName>/'
-  baseUrl: "/wot-cg/tutorials/whatiswot/",
+
+  // @ts-ignore
+  baseUrl: process.env.baseurl,
 
   // GitHub pages deployment config.
   // If you aren't using GitHub pages, you don't need these.