2. Project management¶

Website building:¶

I learnt basics of HTML, CSS and Bootstrap. I have been continuously working on improving website through the diploma. The home page has been designed using HTML and CSS. Yet for the weekly projects I have documented in MKDocs which has been linked to the HTML Home page.
A. Template Used:Glint
B. Editor Used: Sublime

Steps for website building:¶

1. Saving File:¶

Saved file on Editor with .html .Once file is saved it becomes easy to make changes as tags get different colour.

2. Pragraph & Heading:¶

Used the “p” and “h” tags for paragraphs and heading respectively. In the website both these tags have been used in describing “About Me” section.

3. Cards:¶

I have designed responsive CSS cards using a “div” tag with “class=card”. Further, “h” tag was used for describing main heading and project name. Every card has image highlighting the main part of the weekly project.

4. List:¶

Used “unordered list(ul)” tag for proper alignment of cards. Moreover,unordered list has 20 list items for each weekly project built using “li” tag.

5.Buttons:¶

The button tag is for viewer to “read more” all the weekly projects individually.Further, these button tags have “anchor(a)” tags which redirect the user to the detailed page of the weekly project.

6.Nav Bar:¶

The navigation bar at the top has links to Home, About Me, Weekly Projects, Final Project and Contact using anchor(a) tag. Navigation bar is responsive which turns into “Hamburger Menu” on smaller devices.

7.Footer:¶

Footer has all my contact details. The Instagram, Linkedin, Twitter and Facebook have been linked with my account using anchor(a) tag. Further, have used inline CSS to style social media icons.

8.Animation:¶

After a thorough search on internet, I came acroos a pleasing animation of birds. It is built using 3D and webGL javascript animation library vanta,js.

Learning outcomes: Coming from Chemical Engineering background I have no background of programming. I learned the basics of HTML5 from Coursera by University of Michigan from professor Colleen van Lent and Charles Severance.Coursera HTML5 and Introduction to CSS3 by the same university. Coursera is an online learning platform.
Moreover, I also used W3Schools Websiteto learn commands of HTML. I learned various elements, tags and attributes of the HTML, styling the content using CSS3 and animation in Javascript.

Version control: GitLab¶

Version control in GitLab helps our development team share, collaborate and maximize productivity with world class source code management (SCM).Open source, distributed version control system Git, GitLab makes developers more efficient, effective and responsive. Source code management is a critical part of the DevOPs lifecycle, allowing teams to manage their work with a single source of truth.It helps-
A.Collaborate:Share code, enable re-use and ‘innersourcing’.
B. Accelerate:Branch code, make changes and then quickly merge code.
C. Compliant and Secure: Review, track and approve code changes with powerful merge requests.

1.Account:Made an account on GitLab and signed in to see 2 active projects:
A. Fab Academy 2019 class
B. Fab Academy 2019 personal folder by my name

2.Set Global Notification Level: Under settings section, further in notification turned the Global Notification to Watch. This way I will receive all the notifications.

3.Generated the SSH key:Under user settings, found the option to generate SSH keys. Used Git to create keys and paste it on fabcloud. SSH keys were added for authentication.

SSH Keys: SSH keys allow you to establish a secure connection between your computer and GitLab.

4. Git Clone: used clone command in Git and found the folder under home directory.

5. Setting up:Configured the Git, using the username and the email id that I had used in the first step to sign up into the account. Made the required changes in ‘tushar-kukreja’.

6. Git Add: The git add command adds a change in the working directory to the staging area. It tells Git that we want to include updates to a particular file in the next commit. 7. Git Commit:A commit is a set of one or more changes to a file(or a set of files). Every time we save, it creates a unique ID(“hash”) which helps it keep track of the history. 8. Git Push:The git push command is used to upload local repository content to a remote repository. Pushing is how we transfer commits from our local repository to a remote repo.

Concepts and terminology¶

1. Repository: A Git Repository, or a repo, is a folder that you’ve told Git to help you track file changes.

2. Branch: A branch is an independent line of development. You can think of it as a brand new working directory.

3. Fork: A fork is a personal copy of another user’s repository that lives on your account.

4. Clone: A clone is simply a copy of a repository that lives on your computer instead of on a server.

5. Commit: A commit is a set of one or more changes to a file(or a set of files). Every time you save, it creates a unique ID(“hash”) which helps it keep track of the history.

6. Master: The default development branch. Whenever you create a git repo, a branch named “master” is created which becomes the default active branch.

7. Git & Git Hub:Git is Version Control System and GitHub is a hosting service for Git Repositories.On Git you can work locally but you can also share or “push” your changes to other servers.

Learnings and Conclusion¶

In this assignment I understood the terms,concepts and working of distribued version control. The features of GitLab and how I am going to use it for next 6 months to upload the changes I will be making regularly.
Git Lab is an amazing platform to collaborate, backup, revert and merge changes by different people from different places. Understood and practiced tags, commit, pull, push, repository , branches etc.

Refernces¶

1.Git-and-Github
2.Gitlab-blog
3.Understanding Git Repository
4.Git Lab Basics