Skip to content

week1. Principles and project management

Assignment

  • plan and sketch a potential final project
  • read, sign the student/instructor/lab agreements, and commit to your repos
  • work through a git tutorial
  • build a personal site in the class archive describing you and your final project

Git

PC working environment

  • PC:MacBook Air 15inch、M2、2023
  • OS:macOS Ventura 13.5

git config

Since it was already installed because I use it for work, I only implemented the configuration change.

git config --global user.name "yuya-tokuyama"
git config --global user.email "yuya.tokuyama@xxxxx.com"

SSH Keys

Create an SSH key to register with GitLab.

ssh-keygen -t ed25519 -C "ssh-for-fabcloud"

Set gitlab.fabcloud.org to use the SSH key created above in vi ~/.ssh/config.

Host gitlab.fabcloud.org
 HostName gitlab.fabcloud.org
 IdentityFile ~/.ssh/id_ed25519

Copy the public key from the created SSH key to the clipboard.

tr -d '\n' < ~/.ssh/id_ed25519.pub | pbcopy

Register the public key copied to the clipboard to GitLab. ssh_key.jpg

git clone

Clone the repository from GitLab.

git clone git@gitlab.fabcloud.org:academany/fabacademy/2025/labs/kannai/students/yuya-tokuyama.git

Add the signed Student Agreement and commit & push.

git add students.md
git status
git commit -m "【ADD】Fab Academy Student Agreement added."
git push

Install VitePress

installation error

When I tried to install the static site generator VitePress, I got an error message that the Node.js version was too old to install.

npm add -D vitepress
(node:54714) UnhandledPromiseRejectionWarning: SyntaxError: Unexpected token '??='
    at Loader.moduleStrategy (internal/modules/esm/translators.js:145:18)
(Use `node --trace-warnings ...` to show where the warning was created)
(node:54714) UnhandledPromiseRejectionWarning: Unhandled promise rejection. This error originated either by throwing inside of an async function without a catch block, or by rejecting a promise which was not handled with .catch(). To terminate the node process on unhandled promise rejection, use the CLI flag `--unhandled-rejections=strict` (see https://nodejs.org/api/cli.html#cli_unhandled_rejections_mode). (rejection id: 1)
(node:54714) [DEP0018] DeprecationWarning: Unhandled promise rejections are deprecated. In the future, promise rejections that are not handled will terminate the Node.js process with a non-zero exit code.

Node.js Installation

Check the Node.js version with node -v. VitePress requires Node.js version 18 or higher, which is much lower.

node -v
v14.17.3

Install Node.js using this URL: https://nodejs.org/ja/download.

# Download and install nvm
curl -o- https://raw.githubusercontent.com/nvm-sh/nvm/v0.40.1/install.sh | bash

# Set nvm environment variables
export NVM_DIR="$HOME/.nvm"
[ -s "$NVM_DIR/nvm.sh" ] && \. "$NVM_DIR/nvm.sh"  # This loads nvm
[ -s "$NVM_DIR/bash_completion" ] && \. "$NVM_DIR/bash_completion"  # This loads nvm bash_completion

# Download and install Node.js
nvm install 22

# Check the Node.js version
node -v
v22.13.1

nvm current
v22.13.1

# Check npm version
npm -v
10.9.2

Install VitePress again

Installed VitePress again. This time the installation completed without problems.

npm add -D vitepress

Initial configuration of VitePress

Initial configuration of VitePress.

npx vitepress init
┌  Welcome to VitePress!

◇  Where should VitePress initialize the config?
│  ./docs

◇  Site title:
│  Yuya Tokuyama

◇  Site description:
│  Yuya Tokuyma Fab Academy site!

◇  Theme:
│  Default Theme

◇  Use TypeScript for config and theme files?
│  Yes

◇  Add VitePress npm scripts to package.json?
│  Yes

└  Done! Now run npm run docs:dev and start writing.

Start local development server.

npm run docs:dev

Build and test locally.

npm run docs:build

Once built, preview locally by running the following command.

npm run docs:preview
http://localhost:4173/

Add to .gitignore file

I tried to commit the changes so far, but I got too many arguments (4389) -- limit is 4096, Add the following directory to the .gitignore file

docs/.vitepress/cache
docs/.vitepress/dist
node_modules/

I left the node_modules directory and removed it from Git's control. This time I was able to commit without any problem.

git rm -r --cached node_modules

Configuring GitLab CI

When I git pushed, GitLab CI had an error, so I fixed .gitlab-ci.yml and docs/.vitepress/config.mts. After fixing them, I tried git push again and deployed it with CI without any problem.

.gitlab-ci.yml

image: node:18
pages:
  cache:
    paths:
      - node_modules/
  script:
    - npm install
    - npm run docs:build
  artifacts:
    paths:
      - public
  rules:
    - if: $CI_COMMIT_BRANCH == $CI_DEFAULT_BRANCH

docs/.vitepress/config.mts

export default defineConfig({
    title: "Yuya Tokuyama",  
    description: "Yuya Tokuym
    base: base: '/2025/labs/kannai/students/yuya-tokuyama/',
    outDir: '../public',

WARNING

To make VitePress compatible with GitLab CI, set the base path to /xxxxx in https://fabacademy.org/xxxxx, outDir to . /public.

My personal sitessh_key.jpg

About Me page

Final project plan