Assignment 1
Brief
- Work through a git tutorial.
- Build a personal website describing you and your final project. Refer to the lecture material for examples.
- Upload all of the above to the archive
- Plan and sketch a potential final project
Work through a Git tutorial
Git is an amazing tool with amazing features to help us with maintaining a project:
- A public facing file storage where we can share our project
- Version Control - tracks changes and allows us to revert to an older working iteration
- For more advanced users we can split the project into branches where an individual feature is being implemented and tested
Installation process
- Install GitBash (it was already installed and logged in with my work GitHub account)
- Generated checked if I had a SSH Key already, use the command:
cat ~/.ssh/id_rsa.pub - Then copied and pasted it into the Fab Academy GitLab SSH Keys (Windows method)
clip < ~/.ssh/id_rsa.pub - To get access on the PC we have to clone the Repo:
git clone git@git.fabacademy.org:fabacademy2017/yourlabname/yourstudentnumber.git - Observe the Repo now in your folder of choice
some text here please
Git commands
To 'upload' or commit files to the web the following commands can be used:
Add all files in the folder to send
git add .
Add them to a commit
git commit -m "commit description"
Actually send the files to the web
git push
Get the latest copy of the files (useful if working on multiple computers or in a team)
git pull
Before committing to the repo:
After committing to the repo:
Resources - Git
- I followed the Fab Academy Simple Cheat sheet to install git on this PC I also recommend GitHub and GitHub desktop to use a GUI interface
Build a personal website
Now that we have our Repo set up we can create a website to display our project and documentation.
I used MkDocs as recommended by our instructor Claire from Lake Mac FabLab.
I followed the official instructions to get a local website running before moving it to the repo.
- Install MkDocs
pip install mkdocs - Create a new project/website
mkdocs new my-projectcd my-project- Steps into the folder that was just created - Inspect the current state of the website locally
mkdocs serve
Changes to the site 'yml'
The site title was changed to:
Liam's Fab Academy 2024 Docs
with the following change:
site_name: Liam's Fab Academy 2024 Docs
The Material theme was used by adding:
theme:
name: material
pip install mkdocs-material
I ran into an issue here where my Python version was not up to date, upon re-installing it I was able to install the theme.
To match my project theme around plants I wanted to change the theme to a green colour instead of dark Blue:
theme:
name: material
palette:
primary: green
Final MkDocs yml file
Here is the resulting mkdocs.yml file (with some inclusions that I found scrolling through the setup section):
site_name: Liam's Fab Academy 2024 Docs
nav:
- Home: index.md
- Index: links.md
- Assignments: assignments.md
- About Me: aboutme.md
theme:
name: material
palette:
primary: green
features:
- navigation.tabs
- navigation.tabs.sticky
- navigation.path
- navigation.sections
site_dir: _site
Creating a new page
Copy an existing .md file and rename to the new page name.
Writing content on a page
I already have some experience with markdown from doing projects on GitHub so a light cheat sheet was used as a reference. Notepad++ was used alongside the Markdown Preview plugin to edit the pages.
Resources - Website
Upload all of the above
Using the Git Commit process we can publish the website with some additions so that GitLab automatically builds the website.
Generating the website
This file spools up a pipeline to rebuild the website on each push, the .gitlab-ci.yml file has all of the instructions for building the website and requirements.txt
Before viewing the website we need to wait for the Pipeline to finish, once complete it is best to view in a Private window to ensure nothing is cached.
.gitlab-ci.yml
image: python:3.8-buster
before_script:
- pip install -r requirements.txt
pages:
script:
- mkdocs build
- mv _site public
artifacts:
paths:
- public
only:
- main
requirements.txt
# Documentation static site generator & deployment tool
mkdocs>=1.1.2
# Add your custom theme if not inside a theme_dir
# (https://github.com/mkdocs/mkdocs/wiki/MkDocs-Themes)
# Install the Material Theme
mkdocs-material>=5.4.0
Resources - GitLab Pages
Compressing and uploading photos
To edit photos I use paint.net, when saving/editing options are provided for:
- Output file format -
.jpg,.png,.bmp - Compression amount
- Resolution
Which are all essential for reducing the file size for web content.
Tools used to capture images and videos
Here are some of my favourite tools to capture content while making projects:
Lightshot
A quick and handy tool for capturing screenshots and allowing annotations to be added Lightshot Homepage
OBS
An Open source video capture software, used for screen recording and streaming OBS Homepage
Phone Camera
Most people/Makers carry a phone at all times and they have pretty good cameras! Snap a photo of your project or a process to document it (make sure to remove meta-data somehow!) Good lighting goes a long way in taking good photos as well.
Plan and sketch a potential final project
With a good amount of experience behind me I was able to draft out a sketch along with some technologies and parts that I might be able to get started with.
What the project will do?
The project manages the watering of a garden plot, each of the nodes can manage a zone of plants or a couple of pot plants. The hub then waters plants with a range of pumps and/or solenoids. These water controlling outputs could be used to refil a reservoir through a tap, or route water to the plants that need it most.
Who will use it?
The main use case would be small at home gardeners or even farmers with a full field of crops. My Mum also requested I make something like this for her plants in the back garden.