Week 01. Principles and Practices / Project Management
The first week of Fab Academy! I did a sketch of my project and added it to the Final Project page.
Assignments for this week
- plan and sketch a potential final project
- work through a git tutorial
- build a personal site in the class archive describing you and your final project
What I've done this week
- Setting up PC enviroments
- Visual Studio Code (VScode)
- Git
- MkDocs
- Create a website
- Sign up Student Agreements
- Plan a final project
1. Setting up PC enviroments
The First thing I did this week was Setting up my PC enviroment.
Here are the version of tools I use.
- MacBook Air (M1, 2020)
- macOS Monterey 12.3.1
- VSCode 1.74.3
- zsh 5.8 (x86_64-apple-darwin21.0)
- Homebrew 3.6.20
- python 3.10.8 / pip 22.3.1
- git 2.39.1
- mkdocs 1.4.2
I changed my mac screenshot setting from the default(PNG) to JPG with the following command.
defaults write com.apple.screencapture type jpg
Choose Text Editor
Text Editors are software where you write your codes in.
I chose VScode for my text editor.
VScode has wide range of extensions that help you code, debug and visualise your work. Here are the extensions I installed for Fab Academy:
- Git History
- HTML CSS Support
- Markdown All in One
Getting started with Git
I followed this tutorial of Git.
Step 1. Download Git.
brew install git
Step 2. Identify user.
git config --global user.name "sosuke"
git config --global user.email "sosuke.kanegae@mat.eng.osaka-u.ac.jp"
Step 3. Check if there is any SSH-Key existing. If not generate SSH-Key.
(check)
cat ~/.ssh/id_rsa.pub
(generate)
ssh-keygen -t rsa -C "sosuke.kaneage@mat.eng.osaka-u.ac.jp"
Step 4. Check the public key you just created.
cat ~/.ssh/id_rsa.pub
Clone my repository from GitLab to a local workspace
Now so that I got Git ready, I prepaired a new directory to store everything I do with Fab Academy.
cd ~/FabAcademy/
mkdir workspace
In new workspace, I first cloned my repo on GitLab
git clone https://gitlab.fabcloud.org/academany/fabacademy/2023/labs/kitakagaya/students/sosuke-kanegae.git
Now, I have a newly cloned directory "sosuke-kaneage" in my workspace. And, I am ready to edit my website.
Setting up MkDocs
Using MkDocs, you can easily create documentatoin websites. You will have to code in HTML, CSS and JavaScript to create a website. However, in MkDocs all you have to edit is Markdowns, which is easy to use.
Step 1. Install MkDocs.
pip install mkdocs
Step 2. Create new Mkdocs project in workspace
cd ~/FabAcademy/workspace
mkdocs new fabacademy-docs
Step 3. Launch test server
mkdocs serve
Now, I have a MkDocs project with the default settings in ~/FabAcademy/workspace/fabacademy-docs. And, I can check how the website will look in my browser(http://127.0.0.1:8000/).
Build, Commit and Push
After editing MkDocs project, I have to convert the markdowns to HTML files.
cd ~/FabAcademy/workspace/fabacademy-docs
mkdocs build
The build commmand creates HTML files in ~/FabAcademy/workspace/fabacademy-docs/site/
To build directly into the git directory, add the following line to ~/FabAcademy/workspace/fabacademy-docs/mkdocs.yml
% mkdocs.yml
site_dir: ../sosuke-kanegae/public/
Finaly commit changes in local git repo and push to remote GitLab repo.
git add .
git commit -m 'Comments about changes'
git push
Instead of commit and push in the command line, you can also commit and push from the Git tab in VScode.