Martins Krebs - Fab Academy 2018

- MĀRTIŅŠ KRĒBS -

Fab Academy - 2018

Week 2: Project Management

Description:

Tasks:
- Build a personal site describing you and your final project.
- Upload to the class archives.
- Develop Git Profile and upload first entries to Git.

Building a Personal Website

Before starting to build a Website, I had to learn both the HTML and CSS languages. I watched the the incredibly informative video from Fab Academy 2015. Through this video, I was introduced to the w3schools webpage; a simple and intuitive resource for web design I used throughout making this site. HTML is formed from different congruent elements, represented by tags, that describe the structure of Web pages and thier elements.

Establishing the type of document <!DOCTYPE>

Root element of the Web page <html>

Information of the document <head>

<body> is the element that contains all the contents of the HTML document visible to the visitor/viewer.

The majority of the time, when you open a tag in HTML <p> you have to close it with a twin tag prefaced with a "/" </p>

I started creating my page through the Brackets program. Once installed, I began writing as I watched and followed along with the video; First, starting with the basic structure of an HTML (Doctype, html, head, titles and body), and slowly including more and more as the video progressed.

CSS: Giving HTML some style

CSS is a style sheet language that describes how the HTML elements are going to look to the viewer of the site. To modify an aspect of the page you've created, you can either add and attach a <style> tag to each and every element in your HTML, or create an external stylesheet that will modify all your files at the same time. This second option is much easier and more efficient. CSS works with selectors that refer to the HTML elements that you want to modify. We have different types:

What I Struggled With

During this process, I struggled with many different aspects. I have never done any coding of any kind prior to this, and the tasks seemed daunting at first. With the help from previous Fab Academy video walk-throughs, and by checking the documentation in w3schools website, I was able to solve most issues I came across. Things I had the most trouble with were:

Wrapping my head around the logic behind the code and why things were in the order they were in

Understanding what CSS was and how it interacted with html

Breaking down what elements others used on their websites to get desired effects

Working through a -Git- tutorial

Step 1: Download GIT
Step 2: GIT Tutorial

Going through the GIT tutorial, it all looked like another language that is even harder to understand than html was. Looking for a previous Fab Academy video on it, I started looking through 2016 and here's what I found:

Video from 2016

Also this walk-through website.

Once Git was downloaded, I found the Git program file and opened Git Bash.

Generated a new SSH-Key using PuTTYgen

Enter for location to store file

Enter a unique passcode

Show public key: cat ~/.ssh/id_rsa.pub

Copy key: clip ~/.ssh/id_rsa.pub

Go to Fab Academy GitLab

Use your log in

Add your SSH Key in "profile settings" on the left hand side; Name your key

Go back to Git Bash

Clone the repository: git clone
git@git.fabacademy.org/fabacademy2018/fablablccc.git

Find repository where you saved it in
Ex: C:\Users\Martins\Desktop\Git FLA\FabLabLCCC\students\389

Drag all your webpage files and referenced materials into this folder

All files (html) should be in that folder (in the index)

Css, images & js folders should all be here

Go back to Git Bash and enter: cd fablablccc

git add .

git commit –m test

git push

Enter your passphrase to complete the push

[When working with multiple people in the same archive (if you have other classmates in your lab) you will need to use git pull (to become the branch master again) and then git push to post to the repository]