Skip to content

1. Project management

This week I learned how to setup my website on GitLab and how to use atom Editor to change and edit additionally, it allows teams to collaborate and build better software.

GitLab helps teams reduce product lifecycles and increase productivity, which in turn creates value for customers. The application doesn’t require users to manage authorizations for each tool. If permissions are set once, then everyone in the organization has access to every component.

Using GitLab website

For this section I was given a website template on Gitlab that is written in markdown.

I signined into Gitlab.he website code offline and in more easy way.

GitLab

GitLab is a web-based Git repository that provides free open and private repositories, issue-following capabilities, and wikis. It is a complete DevOps platform that enables professionals to perform all the tasks in a project—from project planning and source code management to monitoring and security.

I clicked on the project i had

Here are all the files that pertain to the website. To customize our website we need to edit the mkdocs.yml file. To find it go to your website repository and click mkdocs.yml.

mkdocs

MkDocs is a fast, simple and downright gorgeous static site generator that’s geared towards building project documentation. Documentation source files are written in Markdown, and configured with a single YAML configuration file. Start by reading the introductory tutorial, then check the User Guide for more information.

The first section of the mkdocs file contains the site header and footer(top and bottom titles of a website) and under it are links to social media accounts.

Here’s what changed on the website.

Changing Colors

The Second section controls the colors of the website.

Scheme¶ Scheme controls the background color of the website.

It can be set to Default for a white background.

Primary¶ Primary controls the colors of the top navigation bar.

Here are all the available colors you can choose from.

If we change the primary color to blue the colors of buttons and the header change.

Accent¶ The Accent color controls the colors of all the interactable elements such as hovered links, buttons and scrollbars. Here are all the available colors you can choose from.

Notice that if we try to click the buttons on the side of the page it turns pink. This is because the accent color is set to pink.

Changing Font

The third section controls the font of the website. Mkdocs supports all fonts from the Google Fonts website.

You can search for any font you like on the google fonts website.

As an example i will choose the Philosopher font. Then Typing the name of the font you chose after the text: value.

To edit the website code offline

First install the softwares

Atom A great editor with integrated git push.

Git bash Terminal for git commands - you can run all git commands through it.

Step 1: Clone the website

Step 2:Open a new folder > right click > Git bash here

Step 3: Write Git clone and paste the URL link here then Enter My GitLab username and password

If everything worked fine you should have a folder that contains the same files that are on your repository

Step 4: Open Atom and Editing the codes

Write any changes in a Commit Message and push it ,This will update your changes on GitLab

Gitlab

Mcdocs

Markdown


Last update: September 7, 2022