Docusaurus v2

Samsung · Feb 10, 2022 · c4e7076 · c4e7076
1 parent 4d82c13
commit c4e7076
Show file tree

Hide file tree

Showing 30 changed files with 4,900 additions and 8,237 deletions.
diff --git a/.github/workflows/website.yml b/.github/workflows/website.yml
@@ -1,79 +1,37 @@
----
-# https://v2.docusaurus.io/docs/deployment#triggering-deployment-with-github-actions
-name: Website
+name: Deploy to GitHub Pages
 
 on:
   push:
     branches: [master]
-  pull_request:
-    branches: [master]
-
+    paths: [website/**]
 
 jobs:
-  checks:
-    if: github.event_name != 'push'
-    runs-on: ubuntu-latest
-    steps:
-      - uses: actions/checkout@v1
-      - name: Get yarn cache directory path
-        id: yarn-cache-dir-path
-        run: echo "::set-output name=dir::$(yarn cache dir)"
-      - uses: actions/cache@v2
-        # check for `cache-hit` (`steps.yarn-cache.outputs.cache-hit != 'true'`)
-        id: yarn-cache
-        with:
-          path: ${{ steps.yarn-cache-dir-path.outputs.dir }}
-          key: ${{ runner.os }}-yarn-${{ hashFiles('website/yarn.lock') }}
-          restore-keys: ${{ runner.os }}-yarn-
-      - uses: actions/setup-node@v1
-        with:
-          node-version: '12.x'
-          run: |
-            cd website
-            yarn install
-            yarn build
-            # npm ci
-            # npm run build
-  gh-release:
-    if: github.event_name != 'pull_request'
+  deploy:
+    name: Deploy to GitHub Pages
     runs-on: ubuntu-latest
     steps:
-      - uses: actions/checkout@v1
-      - name: Get yarn cache directory path
-        id: yarn-cache-dir-path
-        run: echo "::set-output name=dir::$(yarn cache dir)"
-      - uses: actions/cache@v2
-        id: yarn-cache
-        with:
-          path: ${{ steps.yarn-cache-dir-path.outputs.dir }}
-          key: ${{ runner.os }}-yarn-${{ hashFiles('website/yarn.lock') }}
-          restore-keys: ${{ runner.os }}-yarn-
-      - uses: actions/setup-node@v1
+      - uses: actions/checkout@v2
+      - uses: actions/setup-node@v2
         with:
-          node-version: '12.x'
-      - name: Add key to allow access to repository
-        env:
-          SSH_AUTH_SOCK: /tmp/ssh_agent.sock
-        run: |
-          mkdir -p ~/.ssh
-          ssh-keyscan github.com >> ~/.ssh/known_hosts
-          echo "${{ secrets.GH_PAGES_DEPLOY }}" > ~/.ssh/id_rsa
-          chmod 600 ~/.ssh/id_rsa
-          cat <<EOT >> ~/.ssh/config
-          Host github.com
-          HostName github.com
-          IdentityFile ~/.ssh/id_rsa
-          EOT
-      - name: Release to GitHub Pages
-        env:
-          USE_SSH: true
-          GIT_USER: git
-          PUBLISH: github_samsung_public
+          node-version: 14.x
+          cache: yarn
+      - name: Build website
+        working-directory: website
         run: |
-          git config --global user.email "[email protected]"
-          git config --global user.name "gh-actions"
-          cd website
-          yarn install
-          yarn deploy
-          # npm ci
-          # npx docusaurus deploy
+          yarn install --frozen-lockfile
+          yarn build
+
+      # Popular action to deploy to GitHub Pages:
+      # Docs: https://github.com/peaceiris/actions-gh-pages#%EF%B8%8F-docusaurus
+      - name: Deploy to GitHub Pages
+        uses: peaceiris/actions-gh-pages@v3
+        with:
+          github_token: ${{ secrets.GITHUB_TOKEN }}
+          # Build output to publish to the `gh-pages` branch:
+          publish_dir: ./website/build
+          # Assign commit authorship to the official GH-Actions bot for deploys to `gh-pages` branch:
+          # https://github.com/actions/checkout/issues/13#issuecomment-724415212
+          # The GH actions bot is used by default if you didn't specify the two fields.
+          # You can swap them out with your own user credentials.
+          user_name: github-actions[bot]
+          user_email: 41898282+github-actions[bot]@users.noreply.github.com
diff --git a/docker-compose.yml b/docker-compose.yml
@@ -123,6 +123,9 @@ services:
       cache_from: ["arthurflam/qaboard:website"]
       context: website
       shm_size: 4gb
+      # by default we assume you run the QA-Board on localhost, but will want to change this
+      args:
+        - QABOARD_URL=${QABOARD_URL:-http://localhost:5151}
     volumes:
     - website_builds:/builds
 

diff --git a/website/.gitignore b/website/.gitignore
@@ -1 +1,20 @@
-search-data.js
+# Dependencies
+/node_modules
+
+# Production
+/build
+
+# Generated files
+.docusaurus
+.cache-loader
+
+# Misc
+.DS_Store
+.env.local
+.env.development.local
+.env.test.local
+.env.production.local
+
+npm-debug.log*
+yarn-debug.log*
+yarn-error.log*
diff --git a/website/Dockerfile b/website/Dockerfile
@@ -1,4 +1,4 @@
-FROM node:lts
+FROM node:lts-alpine
 WORKDIR /website
 
 RUN apk update && apk add --no-cache \
@@ -11,7 +11,7 @@ RUN apk update && apk add --no-cache \
     && rm -rf /var/cache/apk/*
 
 ENV PATH /app/node_modules/.bin:$PATH
-RUN yarn config set strict-ssl false
+# RUN yarn config set strict-ssl false
 
 # RUN npm install -g yarn
 
@@ -23,7 +23,10 @@ COPY . ./
 
 # On the website we have algolia for the search, but the baseURL (/qaboard) is different than
 # when running from the application (/docs). So we don't use algolia for the app...
-RUN yarn run swizzle docusaurus-lunr-search SearchBar
+# RUN yarn run swizzle docusaurus-lunr-search SearchBar
+ENV QABOARD_DOCS_FOR_WEBAPP true
+ARG QABOARD_URL
+ENV QABOARD_URL=$QABOARD_URL
 RUN yarn build
 
 # When upgrading, we want to enable clients to continue using a previous bundle

diff --git a/website/README.md b/website/README.md
@@ -1,6 +1,6 @@
 # Website
 
-This website is built using [Docusaurus 2](https://v2.docusaurus.io/), a modern static website generator.
+This website is built using [Docusaurus 2](https://docusaurus.io/), a modern static website generator.
 
 ### Installation
 
@@ -14,7 +14,7 @@ $ yarn
 $ yarn start
 ```
 
-This command starts a local development server and open up a browser window. Most changes are reflected live without having to restart the server.
+This command starts a local development server and opens up a browser window. Most changes are reflected live without having to restart the server.
 
 ### Build
 
@@ -26,16 +26,16 @@ This command generates static content into the `build` directory and can be serv
 
 ### Deployment
 
+Using SSH:
+
 ```
-$ GIT_USER=<Your GitHub username> USE_SSH=true yarn deploy
+$ USE_SSH=true yarn deploy
 ```
 
-If you are using GitHub pages for hosting, this command is a convenient way to build the website and push to the `gh-pages` branch.
-
-### Continuous Integration
-
-Some common defaults for linting/formatting have been set for you. If you integrate your project with an open source Continuous Integration system (e.g. Travis CI, CircleCI), you may check for issues using the following command.
+Not using SSH:
 
 ```
-$ yarn ci
-```
+$ GIT_USER=<Your GitHub username> yarn deploy
+```
+
+If you are using GitHub pages for hosting, this command is a convenient way to build the website and push to the `gh-pages` branch.
diff --git a/website/babel.config.js b/website/babel.config.js
@@ -0,0 +1,3 @@
+module.exports = {
+  presets: [require.resolve('@docusaurus/core/lib/babel/preset')],
+};
diff --git a/website/blog/2020-06-24-flame-graphs.md b/website/blog/2020-06-24-flame-graphs.md
@@ -1,11 +1,9 @@
 ---
 title: Creating and viewing flame graphs with QA-Board
-author: Arthur Flam
-author_url: https://shapescience.xyz/
-author_title: Algo engineering at Samsung
-author_image_url: https://media-exp1.licdn.com/dms/image/C4D03AQFO_tBlzPZ4ug/profile-displayphoto-shrink_400_400/0?e=1602720000&v=beta&t=35CS2a0jRg32mhVbwpqbddP8HJsFp75hLeQJjAHQHCw
 tags: [performance, engineering, visualization]
 image: https://samsung.github.io/qaboard/img/slides/flame-graphs.jpg
+authors: [arthurf]
+hide_table_of_contents: false
 ---
 import useBaseUrl from '@docusaurus/useBaseUrl';
 
@@ -148,3 +146,4 @@ outputs:
 
 <img alt="Flame graph viewer" src={useBaseUrl('img/slides/flame-graphs.jpg')} />
 
+<img alt="Flame graph viewer" src="/img/slides/flame-graphs.jpg" />
diff --git a/website/blog/2020-08-10-introducing-QA-Board.md b/website/blog/2020-08-10-introducing-QA-Board.md
@@ -1,15 +1,12 @@
 ---
 title: Introducing QA-Board
-author: Arthur Flam
-author_url: https://shapescience.xyz/
-author_title: Algo engineering at Samsung
-author_image_url: https://media-exp1.licdn.com/dms/image/C4D03AQFO_tBlzPZ4ug/profile-displayphoto-shrink_400_400/0?e=1602720000&v=beta&t=35CS2a0jRg32mhVbwpqbddP8HJsFp75hLeQJjAHQHCw
+authors: [arthurf]
 tags: [qualityOps, engineering]
 # description: Some description
 # image: https://example.com/image.png
 ---
 
-We are happy to introduce [QA-Board](samsung.github.io/qaboard) ([source](https://github.com/samsung/qaboard)), a run-tracker with advanced visualizations for algorithm and software engineers.
+We are happy to introduce [QA-Board](https://samsung.github.io/qaboard) ([source](https://github.com/samsung/qaboard)), a run-tracker with advanced visualizations for algorithm and software engineers.
 
 <!--truncate-->
 
@@ -49,10 +46,10 @@ QA-Board has become a key collaborative tool. Our main use-cases are:
 - **Regression**: users can check the progress on various metrics, and when needed, identify which commit caused a regression.
 - **Performance engineering**: save [`rr`](https://rr-project.org/)/[`perf`](http://www.brendangregg.com/perf.html) recordings, view [flame graphs](http://www.brendangregg.com/flamegraphs.html), [benchmark drivers](https://github.com/arthur-flam/sysbench-qaboard), and track metrics for regressions.
 
-> Here are some screenshots:
+> Here are some screenshots (from slide 7):
 
 <figure class="video-container">
-  <iframe src="//www.slideshare.net/slideshow/embed_code/key/C3QrOdYHrRyB7d?startSlide=7" width="595" height="485" frameborder="0" marginwidth="0" marginheight="0" scrolling="no" style={{border: "1px solid #CCC", borderWidth: "1px", marginBottom: "5px", maxWidth: "100%"}} allowfullscreen></iframe>
+  <iframe src="//www.slideshare.net/slideshow/embed_code/key/C3QrOdYHrRyB7d" width="595" height="485" frameborder="0" marginwidth="0" marginheight="0" scrolling="no" style={{border: "1px solid #CCC", borderWidth: "1px", marginBottom: "5px", maxWidth: "100%"}} allowfullscreen></iframe>
 </figure>
 
 

diff --git a/website/blog/authors.yml b/website/blog/authors.yml
@@ -0,0 +1,5 @@
+arthurf:
+  name: Arthur Flam
+  title: Algo engineering at Samsung
+  url: https://shapescience.xyz/
+  image_url: https://avatars.githubusercontent.com/u/2649055
diff --git a/website/build-search-data.js b/website/build-search-data.js
diff --git a/website/docs/introduction.md b/website/docs/introduction.md
@@ -28,8 +28,9 @@ QA-Board has become a key collaborative tool at Samsung SIRC. Our main use-cases
 - **Regression**: users can check the progress on various metrics, and when needed, identify which commit caused a regression.
 - **Performance engineering**: save [`rr`](https://rr-project.org/)/[`perf`](http://www.brendangregg.com/perf.html) recordings, view [flame graphs](http://www.brendangregg.com/flamegraphs.html) and track metrics for regressions.
 
-> Here are some screenshots:
+> Here are some screenshots, from slide 7:
 
 <figure class="video-container">
-  <iframe src="//www.slideshare.net/slideshow/embed_code/key/C3QrOdYHrRyB7d?startSlide=7" width="595" height="485" frameborder="0" marginwidth="0" marginheight="0" scrolling="no" style={{border: "1px solid #CCC", borderWidth: "1px", marginBottom: "5px", maxWidth: "100%"}} allowfullscreen></iframe>
+<iframe src="//www.slideshare.net/slideshow/embed_code/key/C3QrOdYHrRyB7d?startSlide=1" width="595" height="485" frameborder="0" marginwidth="0" marginheight="0" scrolling="no" style={{border: "1px solid #CCC", borderWidth: "1px", marginBottom: "5px", maxWidth: "100%"}} allowfullscreen>
+</iframe>
 </figure>