Assignment 2 : Project Management

Task to do-Git Tutorial & own website development

In this week of "Project managment I Started working on my website development and I open Gitlab account before 3 days of fabacademy.so I am explaining here how I made my website and how I used git to push it on Fabcloud

Website development

Now most important part of Fab academy starts i.e.Website design because this is a first impression to our allover journey of Fab academy. so,for my website devlopment I tried no.of text editor like notepad ++ ,Bracket,sublime but finally I choose Bracket because I found it user friendly .

For website devlopment I used downloaded html template for my website named as "Devpolio" I edited the whole format of this template


Web page

I am totally new to this language I dont used this before so this task was little difficult for me,but I refered web devolopment tutorial from W3 school and mobile app Sololearn
This are some example I tried on W3 school

W3 school example


W3 school

while editing and knowing more about programming languages I understand that HTML (Hyper Text Mark Up Language) is the language of web browsers – what websites are made with. CSS (Cascading Style Sheets) makes them look cool and better than those awful sites from the early days of the web,so I learn css ,html langauge

There are number of languages like html,javscript,python but I am new to all this webdevlopment I found html & css is easy to learn in short time.I am intrested to learn Python and Javacript I will do it after I will get time.
More about HTML and CSS

General syntax of html is

Html syntax

The text between and describes the web page, and the text between and is the visible page content. The markup text This is a title defines the browser page title. The Document Type Declaration is for HTML5. If a declaration is not included, various browsers will revert to "quirks mode" for rendering.

Headings: HTML headings are defined with the h1 to h6 tags:

Heading

About Paragraph


Problem I faced!

As I am Electronics and telecommunication engineer ,till date I never used any web developing language like Html,Java,bootstrap,etc.but I used languages like c,C++ .so while editing this template I was very curious how all instruction worksin this web developing languages,after going through W3 school I realise that all programming languages have one similarity that number of open brackets should be equal to number of closing bracket in html we used"<>" as open bracket,and ""as closing bracket,just syntax and instructions are different in each language. At the starting it seems difficult but now,I can understand the significance and features .

Error and Solution

Error

While editing this template I rearranged my data to make the site look good but still I am stucked at problem of scrolling at "Assignments"navbar still I am unable to fixed it.

I used code overflow: scroll;etc but its not working

Hope I will fixed it soon.


Git Tutorial

After designing website now time to publish it but for that we have to know no,of things like what is Git,what is Fabcloud and many more terminology so for that I refere this git tutorials

Git is a distributed version-control system for tracking changes in source code during software development. It is designed for coordinating work among programmers, but it can be used to track changes in any set of files. Its goals include speed, data integrity,and support for distributed, non-linear workflows.(source wikipedia)


Version Control

Version control is a system that records changes to a file or set of files over time so that you can recall specific versions later.

Git is a free and open source distributed version control system designed to handle everything from small to very large projects with speed and efficiency.

Step wise description for how I use GIT for my Fab Academy-2019 project Version control

Step 1:Before staring actual process browse fablabs.io ,and then create the account on

Fab cloudit is a online services for the Fab Lab Network used to collect all the project at one place

Git login

Step 2:Then Install Git on windows operating system.Downloaded git.exe file on Gitbash

Here is my git profile

Git Profile

Step 3: Now install Gitbash setup in your system,After downloading gitbash setup.Then Run gitbash. After opening of the gitbash window we can find one command line.for further process and acess to fabcloud we need one authentic SSH key SSH keys allow you to establish a secure connection between your computer and GitLab,for generation of ssh key we have to enter command

SSH Key setting

1. I run this cammand
ssh-keygen -t rsa -C "aditikharade1361994@gmail.com"


Without SSH Key you can only use the web interfaceSSH keys allow you to use the GIT repository securely,without requiring a password every time

2.I used Second Cammand.this cammand is for copy my SSH key to git server


$ cat ~/.ssh/id_rsa.pub | clip


Then copy generated SSH key in "SSH key Setting" in gitlab fabcloud window and click on add key button ,here our SSH key is generated and stored.


Notification setting

After setting my profile at gitlab I changed my notification setting from Global to Watch as per below image for recieving of all notification.

Notification setting

Step 4: Now, time to know whether our account created was actually dony7e or not for that use command
ssh -T git@gitlab.fabcloud.org command


Step 4: So,right now I confirm my gitserver Account.after confirmation I run third Command which is git clone.
git@gitlab.fabcloud.org:academany/fabacademy/2019/labs/vigyanashram/students/aaditi-kharade.git

this cammand download the folder from Git to our system for further editing process.We can chosse at what folder ,where to store this cloned folder I choose Document folder for it.


Step 5: After Downloading the clone folder from git we can add our website files in the folder. Before using git with gitlab we need to globalise about our user name and email. I used following commands:
$ git config --global user.name "Aaditikharade13"
$ git config --global user.aditikharade1361994@gmail.com"


here is our remote git setup finish.

For push ,pull operation we need to enter below command

  • $ git pull
  • $ git add --all
  • $ git commit -m "Your comment"
  • $ git push
  • But for avoiding the entry of every command after every editing I use

    Source Tree to minimize the command.

    SourceTree is a free Mercurial and Git Client for Windows and Mac platforms. It provides a graphical interface for repositories, between users and Git, in which simplifies its use for beginners, who haven't mastered Git, and experts, who can be more productive focusing solely on the code.(source internet)

    After the editing of my first assignment I used source for pushing my data on fabcloud, Whatever data we edited changes is done in clone folder,is by default comes in stack of source tree then I stage it using stage all button on screen

    Source tree

    then I in commit window we can write notes or messages regarding our project after commiting I pushed my all data to fab cloud using Source tree

    Source tree

    This is first look for my first push of assignment1

    Assignment 1

    Here is Gitbash editor where I used all commands for my another first project

    Git bash command window

    first Git Project

    About first push on Fabcloud

    Then in commit box I comment what changens I did then I commit data and then my website gets pushed on fabcloud ,number of times my data looks invisible then I pressed referesh then it works.

    Whatever data you edited is by default comes in stack of source tree,then I stage it using stage all button on screen

    In recitation conducted on 28/1/2019 by Fiore Basile many concepts like issue tracker,milestone are explained still I don't used this.


    Project planning using Gantt Chart
    Gantt Chart:

    A Gantt chart is a type of bar chart that illustrates a project schedule. This chart lists the tasks to be performed on the vertical axis, and time intervals on the horizontal axis. The width of the horizontal bars in the graph shows the duration of each activity.

    I made "Gantt chart" on Gantter.com for final project planning,Here are some screen shot




    Summary

    After doing this assignment ,I learnt Html,css,javascript,bootsrap.Now,I am familiar with Git,version control.now I know the significance of related command.


    Assignment 1 Assignment 3