Skip to content

1. Principles and practices & Project management

Weekly Summary

Fab Academy 2022 has started, and I have created my personal website using GitLab, Git for Bash, and VS code.

First of all, I learned the minimum necessary to follow the format, and I would like to gradually update it in the future.

The final project has been in the works since before the Academy began, and I hope to try my hand at completing it in future classes.


Assignments

Principles and practices - plan and sketch a potential final project

Project management - work through a git tutorial

  • build a personal site

  • describing you and your final project



Final project idea sketch


This is my poitential final project named Love Nose. The reason I thought of this project is because I am sensitive to smells. It is said that women, in particular, feel that a partner who has DNA that they do not have smells good (odorless). This allows them to leave behind a diversity of genes.

Therefore, I have heard that there is a Pheromone Party in London (odor matching party), and I thought that if I could find a partner who matches me on a DNA level, I would be able to live a happy life.

I think it is a very good device, especially for those who cannot find a good partner by themselves.


Research


In the town where I live now, the working-age population is decreasing year by year.

Reference: Kuriyama Town Management Planning Division (Census)


However, if you look at the number of singles and marriages, you will see that the number of people in their 30s decreases dramatically, but the possibility of meeting someone is still there.

Reference: Kuriyama Town Management Planning Division (Census)


If I can complete this device, I believe it will help alleviate the problem of declining birthrate and aging population in the town by increasing the number of couples and children.

Ultimately, I would like to be able to register some of your favorite smells and identify people who are close to those smells, but since odor sensors are still too expensive, I would like to use an ammonia sensor to create a device that can find people who have low ammonia levels in their sweat, in other words, people who don’t smell bad.

Sensor plan

  • Odor Sensor
  • Mq 137(Ammonia sensor)

Micro computer plan

  • Attytiny Mega

Material

  • Cotton for bag
  • Silicon for nose



Plan B

In the town where I live, the wind is strong, but there is no measurement data for the town.

I wanted to create a work that would help people notice the little things in the environment they live in and lead to bigger issues such as environmental problems.

In addition to measuring wind and collecting data, I would like to create a device that plays sound and a device that plays sound based on a person’s heart rate, and create a work that plays sound from two different materials.

Here is the example for playing sound with wind.

I believe that collaboration leads to knowing the other person deeply and taking an interest in them in order to know them.

Therefore, by listening to the sound that people make in collaboration with the wind, I aim to get people interested in the wind, which they usually do not pay attention to.



Setting up Git

First of all I started to download Git for Bash.

Learn Git tutorial

I followed the tutorials that is created by Fab Lab Kamakura.

Set the SSH key

Open Bash and type

ssh-keygen -t rsa -C "xxxxxxxx@xxxxx.com"

I typed my gmail address for “xxxxxxxx@xxxxx.com”.

I set the key but you can’t see what you type after colon(:) .

Enter file in which to save the key:

So make sure to type same kay again.

Enter same passphrase again;

You can see the fingerprint if it’s correct.


The SSH key will be stored in the .ssh folder. The .ssh folder is located directly under your home directory (C:\Users/username/.ssh.).

I checked the inside of id_rsa.pub.

cat ~/.ssh/id_rsa.pub

And I found the public key starting ssh-rsa to gmail address at the end.

I copied it.

ssh-rsa ~~~~

...

~~~  xxxxxxxx@xxxxx.com

Going to GitLab > User icon on the right top corner > Preference > SSH key on the left side

Paste the public key


Clone as follow (Just one first time );

git clone git@xxx.xxxxx

git@xxx~ came from main page of my GitLab, and copied it.

Enter the gmail address of the user.

git config --global user.email "xxxxxxxx@xxxxx.com"

And enter the name of the user.

git config --global user.name "Kurumi Shiowaki"

I actually changed the SSH key to non pass after that.

Because somehow it asked me the pass pretty much. it’s annoyed me.

I did the same thing until paste public key to GitLab.


Normal operation as follow;

1, Update the newest data to local

git pull

2, Check the add

git statas

3, Add the changes

git add .

Dot(.) means add to current repository.

4, Commit

git commit -m “XXX”

5, Update to Remote repository

git push


VS code

I found the folder on windows with “c:\Users/fabla”.

Download VS code and open the folder of “kurumi-shiowaki” on VS code.

You can separate the viewer for typing(on the left side) and preview(on the light side).

It’s easy to check how it looks like.

short cut for preview : shift + ctrl + V


MKdocs serve

I checked my website looking on mkdocs serve before git push.

But it didn’t work because I need download python for my windows.

I found the tutorial for this issue. so I followed it.

Type python on Bash > Enter

Windows app store opens > click “Get” > Download and Install done.

You can see the version with command “winpty python”.

Otherwise Bash will be a bug. (It’s not work any command.)

fabla@LAPTOP-5N7QP7IN MINGW64 ~
$ winpty python
Python 3.10.2 (tags/v3.10.2:a58ebcc, Jan 17 2022, 14:12:15) [MSC v.1929 64 bit (
AMD64)] on win32
Type "help", "copyright", "credits" or "license" for more information.

And make Python virtual environment as follow;

$ cd "kurumi-shiowaki"  //"<your local repository>"
$ cd ~/repo/gitlab_fab/tatsuro.homma/fabacademy
$ py -m venv env1

I always need this code when I use mkdocs serve!!

$ source env1/Scripts/activate
(env1)

Go to VS code and open “.gitignore” on the leftside.

And add “env1”.

Otherwise it would be pretty heavy data.

You can check installed library packages by:

$ pip list
Package                                   Version
----------------------------------------- -------
Babel                                     2.9.1
click                                     8.0.3
colorama                                  0.4.4
ghp-import                                2.0.2
gitdb                                     4.0.9
GitPython                                 3.1.26
importlib-metadata                        4.10.1
Jinja2                                    3.0.3
Markdown                                  3.3.6
MarkupSafe                                2.0.1
mergedeep                                 1.3.4
mkdocs                                    1.2.3
mkdocs-git-revision-date-localized-plugin 0.11.1
mkdocs-material                           8.1.8
mkdocs-material-extensions                1.0.3
packaging                                 21.3
Pygments                                  2.11.2
pymdown-extensions                        9.1
pyparsing                                 3.0.7
python-dateutil                           2.8.2
pytz                                      2021.3
PyYAML                                    6.0
pyyaml_env_tag                            0.1
six                                       1.16.0
smmap                                     5.0.0
watchdog                                  2.1.6
zipp                                      3.7.0

Finally I can see my website.

fabla@LAPTOP-5N7QP7IN MINGW64 ~
$ cd kurumi-shiowaki

fabla@LAPTOP-5N7QP7IN MINGW64 ~/kurumi-shiowaki (master)
$ source env1/Scripts/activate
(env1)
fabla@LAPTOP-5N7QP7IN MINGW64 ~/kurumi-shiowaki (master)
$ mkdocs serve
INFO     -  Building documentation...
INFO     -  Cleaning site directory
WARNING  -  Documentation file 'index.md' contains a link to 'images\week01\kslogo.jpg' which is not found in the documentation files.
INFO     -  Documentation built in 0.39 seconds
INFO     -  [14:14:06] Serving on http://127.0.0.1:8000/2022/labs/kamakura/students/kurumi-shiowaki/
INFO     -  [14:14:25] Browser connected: http://127.0.0.1:8000/2022/labs/kamakura/students/kurumi-shiowaki/

Copy and paste “http://~” on your browser.

Just make sure your image name without space and capitals.

It didn’t show up correctly on the website.

But the night after I updated, logo image didn’t show up again. So I changed the folder from week01 to images and deleted ./ from front.

![](./images/week01/kslogo.jpg#center)

![](images/kslogo.jpg#center)

Now I can see it!!

And I added plugin of collecting center.

First, add to mkdocs.yml

extra_css:
  - css/extra.css

And I made the folder(css) and file(extra.css) in docs.

and add the code

img[src*='#center'] { 
    display: block;
    margin: auto;
}

after that, I just add #center after image name.

![](../images/week01/centerplugin.jpg#center)


I wanted to change the color. So I add the code in css file too.

:root {

    /* Primary color shades */
    --md-primary-fg-color: #861f41;
    --md-primary-fg-color--light: #861f4194;
    --md-primary-fg-color--dark: #ac325a;
    --md-primary-bg-color: hsla(0, 0%, 100%, 1);
    --md-primary-bg-color--light: hsla(0, 0%, 100%, 0.7);
    --md-text-link-color: hsla(231, 48%, 48%, 1);

    /* Accent color shades */
    --md-accent-fg-color: rgb(98, 18, 189);
    --md-accent-fg-color--transparent: hsla(189, 100%, 37%, 0.1);
    --md-accent-bg-color: hsla(0, 0%, 100%, 1);
    --md-accent-bg-color--light: hsla(0, 0%, 100%, 0.7);
  }

  :root > * {

    /* Code block color shades */
    --md-code-bg-color: hsla(0, 0%, 96%, 1);
    --md-code-fg-color: hsla(200, 18%, 26%, 1);

    /* Footer */
    --md-footer-bg-color: #861f41;
    --md-footer-bg-color--dark: hsla(0, 0%, 0%, 0.32);
    --md-footer-fg-color: hsla(0, 0%, 100%, 1);
    --md-footer-fg-color--light: hsla(0, 0%, 100%, 0.7);
    --md-footer-fg-color--lighter: hsla(0, 0%, 100%, 0.3);
  }

And done!!


Appendix


Last update: January 31, 2022