After traveling through some Covid-19 protocols, on january 27th, I reached Wheaton College in Massachusetts where my lab is located. After getting initiated through some prep meetings, I felt that it was necessary to get situated with Git and Gitlab. When first signing into my gitlab account, my repository contained these files.
These initial files would build me a pretty generic website where I could fill in information where needed, but it was up to me to change things up. One good thing I found out about Gitlab was that it tracked and recorded deletions and additions in the commits tab so that I could always see what changes were made. Also, I think it will be very important to learn how branches work so I will test that out when I take a look at Git.
After downloading Git, as well as Gitbash, the first thing I needed to set up was my SSH key. The SSH key will act as an encrypted credential that will be used so that I can securely edit my repository on Gitlab. I first entered these commands into Gitbsh:
ssh-keygen -t rsa -C "myemail@gmail,com"
You can change the directory but hitting enter will send it to the default place (/c/Users/NAME/.ssh/id_rsa). Make sure as to not save it with any passphrase. Next I saw this:
Next I enterd this command:
This showed me my key and I copied and went to my Gitlab page where I pasted it in the space below in my profile settings page.
Following the tutorials on the fabacademy website I first checked both the Atom and Sublime software and ended up downloading Atom. Next, because I have no experience with HTML and CSS, I followed some of the simple tasks on the fabacademy webpage then furthered my learning on w3schools.com to get a better understanding of the things I wanted to do. I then got to work. Before I pushed anything to my repository I used this command:
py -m http.server
This allowed my to use http://localhost:8000 on my browser in order to get a preview of what my webpage looks like. I decided I wanted to create some things on my own while also using a template on w3schools.com to round out my website. The theme I ended up using was the Startup Template.
HTML stands for Hypertext Markup Language and is the standard markup language that is used to build websites. When using html, html elements will be used to create the structure and each element can have HTML attributes that change the elements behaviour.
<a href="index.html" class="class1"> Text </a>
Here we have the element <a> </a> being changed by the attributes href and class.
Here are some important HTML elements:
Defines HTML document
Defines documents body
Defines documents header
Defines documents footer
<h1> </h1> to <h6> </h6>
Creates a link
CSS stands for Cascading Style Sheets which can be written in order to stye a document written in a markup language. When I used CSS it allowed to to change the colors, layout, fonts and the general style of my webpage to a much further degree.
Above is the general format in order to use CSS. You can either have it in the <style> </style> section or save it as a CSS file.
<link rel="stylesheet" href="style.css">
Is a command to load in a CSS file.
When I found my changes to my liking, it was time to commit to my changes. First, I cloned my repository to my computer:
git clone firstname.lastname@example.org:academany/fabacademy/2021/info.git
Selecting the "clone" button on the project overview page will let you copy the path on Gitlab. Next I need to go to the command line and change directory to the master branch.
After coding the changes that I wanted, it was time for me to commit my changes
git add index.html
git add week1.html
When I was lazy I could type:
git add .
Which would just add everything in the directory.
git commit -m "Update Message"
These were the final commands needed to push all my work to the repository.
To create a new branch I typed:
git Branch "Branch Name"
Anytime you want to switch to a given branch you type:
git checkout "Branch Name"
With this you have created and switched to a new branch. This feature is a really important in Git as it allows you to test and create new feature while maintaining the stability of the master branch.
Using this command:
git branch -a
I can now see that I have successfuly created a second branch. I can now switch over and and make changes and commits without affecting the master branch. Once you are done with you changes, you can type the command:
git merge "branch name"
after this, you can type these commands if you want to delete your branch:
git branch -d "branch name"
For a branch that has been merged.
git branch -D "branch name"
For a branch that has not been merged.