Week 1: Project Management
January 1, 2024
Git, Github, HTML,CSS, Framework, Template, Markdawn, more failure time .)
Fail: Hugo and Gitology – A Race Against Time Adventure!
- Fail hours : +15
- Fail commits: 29
This week, I dived into Hugo and immediately realized how important time management is in our 20-week Fab Academy journey. Starting out, editing the Hugo template seemed easy, but as I got into it, I faced some challenges. Transferring what worked well locally to Fab Cloud took longer than I expected. In this process, I used tools like the Hugo framework, VSCode, Git, GitLab, and the terminal. I also benefited from the experiences of those who went through Fab Academy before me.
I did a lot of research to understand the structure of Hugo. I learned how HTML templates and web pages are created. I also learned a lot about Git, especially in the part I call “Gitology,” which was about much more than just code management.
After 15 hours and 29 failed commits, with the help of my mentor Kris, we finally found the error. Working with Kris was like being detectives. This process taught me patience, careful analysis, and especially the importance of time management. The guidance from my mentor was incredibly helpful.
In the end, this experience taught me a lot about the Hugo framework, web architecture, and git systems. This adventure strengthened me for future projects and showed me how critical time management is!
Learn
During my first week, I embarked on integrating my development environment with GitLab using VSCode 🛠️. Here’s a bit about what I learned from the experience:
Connecting VSCode to GitLab 🛠️
Initially, I attempted to connect my VSCode to my GitLab account. This process involves a specific link and the generation of an access token. My first try was using the direct link to my Fab Academy repository:
https://gitlab.fabcloud.org/academany/fabacademy/2024/labs/aalto/students/sedat-yalcin
However, attempting to enter the token here failed.
Switching strategies, I used the more general link to GitLab:
This time, entering the token worked seamlessly. This taught me the importance of using the correct URL for token authentication in VSCode 🛠️.
[npm run dev]
Paying Attention to Layouts 🌐
Working locally with Hugo on localhost posed no issues with layouts. The real challenge emerged when I uploaded my work to GitLab. I encountered layout or HTML problems, highlighting the critical nature of ensuring the correct HTML files are being referenced by the system. This required careful attention and the use of the page inspector tool to track down which HTML files the system was attempting to access.
[This required careful attention and the use of the page inspector tool 🔍 to track down which HTML files the system was attempting to access. ]
GitLab 101 📚
A quick guide to get started with GitLab for managing your projects:
-
Create a GitLab Repository:
- Log in to your GitLab account.
- Create a new project by selecting “New Project” or a similar option.
- Specify the project name, access level, and other necessary settings.
-
Root Directory of Your Project:
- Navigate to the directory where your website created with Hugo is located.
-
Git Initialization (Initial Setup):
- Open a terminal or command prompt.
- Navigate to your project directory:
cd path/to/your/project
- Initialize Git:
git init
-
Add Changes to Staging and Commit:
- Add all files to the staging area:
git add .
- Commit the changes with a commit message:
git commit -m "Initial commit"
- Add all files to the staging area:
-
Link with GitLab Repository:
- Add the GitLab repository URL to your project:
git remote add origin https://gitlab.fabcloud.org/academany/fabacademy/2024/labs/aalto/students/sedat-yalcin.git
- Replace the repository URL with your own if it’s different.
- Add the GitLab repository URL to your project:
-
Push to the Repository:
- Push your data to the main branch of the GitLab repository:
git push -u origin main
- Replace “master” with your main branch name if it’s different.
- Push your data to the main branch of the GitLab repository:
When needed, you can use the git pull
command to fetch updates from the repository.