2. Project management¶
Assignment
work through a git tutorial
build a personal site in the class archive describing you and your final project
Introduction¶
This week I started to getting used to the documentation process.
We have to work through a git tutorial, build a personal site in the class archive describing me and my final project.
I started like that :
 |
|---|
| How it looks in my brain |
Or like that :
 |
|---|
| Translation for children |
First step¶
First I discover what GitLab is.
I create an account and find my web project which was already created by the FabAcademy.
I look at others students documentation. They speak about GitBash and Mkdocs… So I download GitBash and find something black, unfriendly, with orders I don’t understand. Thanks to Helena Cardiel’s documentation, I find what to scribe on the GitBash window and I succeed to generate à key.
 |
|---|
| Gitbash screen with computer code to generate a key |
But what can I do with this fucking key...............
I call my mentor who gives me the help I need : Forget the key and click on Web IDE. We will see how to use the key later.
Customization online with Web IDE¶
I started to customize my website online thanks to Web IDE.
 |
|---|
| Web IDE button on the GitLab project |
Super ! I arrive in a place where I can customize my website. I can find all my folders with text, images and configuration.
I start to change the text in the index file.
 |
|---|
| Navigation and text customization in Web IDE |
Then I commit my job to merge my changes with the main project. So I commit my change by clicking on Commit button and then approve the change.
 |
|---|
| Commit changes |
 |
| Commit to master branch |
 |
| When the master is changed you will have a green mark |
After that I can go back on Web IDE to make other changes.
When it succeed I can see all the change I have done on my website.
Customization off-line with GitBash and Atom¶
SSH KEY registration¶
So Git Bash will be the interface, my command line, which I will use to communicate with my online repository in GitLab.
I have seen before how to generate a SSH key.
Now I have to add that key to my account in GitLab. account>settings>ssh-keys and copy my key there (that last huge string); and then click in add.
 |
|---|
| How to add the ssh key |
How to clone the web project on my computer¶
 |
|---|
| How to copy Clone with ssh |
 |
| How to copy Clone on my computer |
 |
| Here there are ! |
Customization with ATOM¶
I download ATOM as an interface to open and edit clone’s folders.
 |
|---|
| How to download Atom |
Now I can open my project with Atom.
File > Add Project Folder
I select my main project folder and it open like that :
 |
|---|
| Project opened on Atom |
Here can I change all what I want offline. Everything is on my computer.
Ctrl + S to save the changes.
How to look at the website’s changes offline¶
ATOM is an interface to edit the website. It looks like code. To look at the web site’s changes off-line I use gitbash.
 |
|---|
| How to go in the copy of folders |
 |
| instruction to generate the website off-line |
Nothing happened but I can scribe this address and have a view of the website off-line :
http://127.0.0.1:8000/2022/labs/digiscope/students/caroline-chaumeil/assignments/week02/#customization-offline-with-gitbash-and-atom
 |
|---|
| Website Preview off-line |
How to push the changes on-line¶
To push all the changes on-line, I use gitbash.
 |
|---|
| Instructions to push all the changes online |
 |
| When the master is changed you will have a green mark : Now the website is updated online ! |
Customization¶
My website was Navy blue and sad. Too sad for a site about children game. So I start to customize it. I use the mkdocs.yml to do that.
Colors¶
In the mkdocs.yml file I can change colors.
 |
|---|
| How to change colors |
Primary color : is the main color of the website.
Accent color : is the color of the text when you pass your computeur mouse above.
You can find all colors on the Mkdocs website.
 |
|---|
| List of colors |
Here is the result !
 |
|---|
| Orange website after changes |
Style of the text¶
In the mkdocs.yml file I can change the style of the text.
 |
|---|
| How to change the style of the text |
I use one style found on google fonts.
 |
|---|
| Google fonts |
Finally I use the Architects Daughter one but it seems to be too difficult to read it so I have to search an other one.