Repository
This week I worked on making my webpage where I will be documenting the course activities. To save the changes of my web page I used Git and Gitlab to upload my changes. I also worked on defining ideas for my final project.
To access my repository, you can do it by clicking on the following link.
Tools
- Visual Studio Code as code editor
- Git for version control for tracking changes
- GitLab as the web-based platform for managing Git repositories
Development
First, I logged in to GitLab. Then I copied the link to my repository to clone it on my computer.
Next, I created a directory called "FabAcademy" using the "mkdir" command. When finished I navigated to my new directory using the "cd" command.
Then, I navigated to my "erick-guevara" directory
After that, I navigated to my "public" directory
To install the GitLab project we use "git clone" to save the project on our computer.
Git tools
- clone: copy repository
- add: stage changes
- commit: save changes
- push: upload changes
I used a template provided to us because it had the structure almost ready. Also, the design of the page looks great.
Below, I will present some images of the template provided to us:
However, I made some changes to give more originality to the page.
First of all, I changed the color of the main titles from red to green using "background" in my css file.
This is how it looked on my page: :
Then, I changed the way I present the information. I made a rectangle and added shadows and border to create a floating rectangle.. For this I created a div and gave it an id called "main-container": :
Then I went to my css file to modify the styles of the rectangle:
The result is shown in the image below:
On the home page I changed the color of the boxes where I access all the weeks. Before, they were of different colors, and I decided to change them to green colors, for that I used ChatGPT to generate a palette of colors with green tones. Then, I added the colors to my css file:
The following image represents the result. I liked it because the colors range from a light green to a darker green:
For the use of images, I used the "center" tag to center the images:
After making some changes to the template (change titles, whitespace, put some images, etc)
I uploaded all my files to my repository.
First I used the "git add" command to add all the modifications I made.
Then, I used the "git commit" command to save the changes to the Git repository.
Finally, I uploaded the local changes to my repository in GitLab usign "git push" command.