Scribd
Upload
44 views

Session 1: Introduction To Github

This document provides an introduction to full stack web application development. It defines a web application as a client-server software application that runs in a web browser. It describes the client-server architecture and the model-view-controller pattern commonly used. It also discusses responsive design, version control with Git/GitHub, and provides instructions for getting started with basic Git commands like cloning, committing, pushing, and collaborating on repositories.

Uploaded by

Dattaprasad Ekavade
Copyright
© © All Rights Reserved
Available Formats
Download as PDF, TXT or read online on Scribd
44 views

Session 1: Introduction To Github

This document provides an introduction to full stack web application development. It defines a web application as a client-server software application that runs in a web browser. It describes the client-server architecture and the model-view-controller pattern commonly used. It also discusses responsive design, version control with Git/GitHub, and provides instructions for getting started with basic Git commands like cloning, committing, pushing, and collaborating on repositories.

Uploaded by

Dattaprasad Ekavade
Copyright
© © All Rights Reserved
Available Formats
Download as PDF, TXT or read online on Scribd
You are on page 1/ 20

FULL STACK WEB APPLICATION

DEVELOPMENT
INTRODUCTION
CONTENTS

WHAT IS AN WEB APPLICATION?


THE CLIENT-SERVER ARCHITECTURE
WHAT IS MODEL, VIEW AND CONTROLLER?
NEED FOR RESPONSIVE DESIGN
INTRODUCTION TO GIT/GITHUB
HANDS-ON
WEB APPLICATION

A WEB APPLICATION OR WEB APP IS A CLIENTSERVER SOFTWARE APPLICATION IN WHICH


THE CLIENT (OR USER INTERFACE) RUNS IN A WEB BROWSER.
THE DISTINCTION BETWEEN A DYNAMIC WEB PAGE AND A "WEB APPLICATION" IS UNCLEAR.
WEB SITES REFERRED TO AS "WEB APPLICATIONS" HAVE SIMILAR FUNCTIONALITY TO A
DESKTOP SOFTWARE APPLICATION, OR TO A MOBILE APP.
SINGLE-PAGE APPLICATIONS REJECT THE MORE TYPICAL WEB PARADIGM OF MOVING
BETWEEN DISTINCT PAGES WITH DIFFERENT URLS. SINGLE-PAGE FRAMEWORKS LIKE SENCHA
TOUCH AND AngularJS ARE USED TO SPEED DEVELOPMENT OF SUCH A WEB APP FOR A
MOBILE PLATFORM.
CLIENT-SERVER ARCHITECHTURE

THE CLIENT-SERVER MODEL IS A DISTRIBUTED


APPLICATION STRUCTURE THAT PARTITIONS
TASKS OR WORKLOADS BETWEEN THE
PROVIDERS OF A RESOURCE OR SERVICE,
CALLED SERVERS, AND SERVICE REQUESTERS,
CALLED CLIENTS.
THE SERVER COMPONENT PROVIDES A
FUNCTION OR SERVICE TO ONE OR MANY
CLIENTS, WHICH INITIATE REQUESTS FOR
SUCH SERVICES. Pic credits: en.wikipedia.org
MODEL, VIEW AND CONTROLLER

Pic Credits: www.waqar.me


RESPONSIVE DESIGN

Pic Credits: www.sfamarketing.com Pic Credits: www. envisionitagency.com


WHAT IS GIT/GITHUB?

GIT IS THE MOST WIDELY USED MODERN VERSION CONTROL SYSTEM


GIT WAS ORIGINALLY DEVELOPED IN 2005 BY LINUS TORVALDS, THE FAMOUS CREATOR OF
THE LINUX OPERATING SYSTEM KERNEL.
VERSION CONTROL PROTECTS SOURCE CODE FROM BOTH CATASTROPHE AND THE CASUAL
DEGRADATION OF HUMAN ERROR AND UNINTENDED CONSEQUENCES.
VERSION CONTROL HELPS TEAMS SOLVE PROBLEMS BY TRACKING EVERY INDIVIDUAL CHANGE
BY EACH CONTRIBUTOR AND HELPING PREVENT CONCURRENT WORK FROM CONFLICTING.
ADVANTAGES OF GIT

WORKING ON MULTIPLE EACH DEVELOPER HAS FULL


FEATURES REPOSITORY

Pic Credits: www.atlassian.com


GETTING STARTED

OPEN COMMAND PROMPT OR GIT BASH AND ENTER FOLLOWING COMMANDS REPLACING
DETAILS WITH YOUR OWN.

git config --global user.name Your Name"


git config --global user.email yourEmail@example.com"

CREATE A GITHUB ACCOUNT


WWW.GITHUB.COM
PLEASE GIVE YOUR USERNAME TO VOLUNTEERS SO THAT WE CAN ASSIGN DIFFERENT PROJECTS TO YOU
SETTING UP A REPOSITORY

METHOD 1: GIT INIT


USAGE

git init
git init <directory>

TRANSFORM THE DIRECTORY INTO A GIT REPOSITORY. THIS ADDS A .git FOLDER TO THE CURRENT
DIRECTORY AND MAKES IT POSSIBLE TO START RECORDING REVISIONS OF THE PROJECT.
YOU HAVE TO MANUALLY ADD A REMOTE

git remote add origin https://github.com/user/repo.git


SETTING UP A REPOSITORY

METHOD 2: GIT CLONE


CREATE A NEW REPOSITORY ON GITHUB (OR VISIT THE REPOSITORY YOU WANT TO WORK ON),
CLICK ON CLONE OR DOWNLOAD AND COPY REPOSITORY ADDRESS.
USAGE

git clone <repo>


git clone <repo> <directory>

CLONE THE REPOSITORY LOCATED AT <REPO> ONTO THE LOCAL MACHINE. THE ORIGINAL
REPOSITORY CAN BE LOCATED ON THE LOCAL FILESYSTEM YOU ARE CURRENTLY IN.
INSPECTING A REPOSITORY

COMMAND1: GIT STATUS


USAGE

git status

LIST WHICH FILES ARE STAGED, UNSTAGED, AND UNTRACKED


# On branch master changes in working directory)
# Changes to be committed: #
# (use "git reset HEAD <file>..." to unstage) #modified: main.py
# #
#modified: hello.py # Untracked files:
# # (use "git add <file>..." to include in what will
# Changes not staged for commit: be committed)
# (use "git add <file>..." to update what will #
be committed) #hello.pyc
# (use "git checkout -- <file>..." to discard
INSPECTING A REPOSITORY

COMMAND2: GIT LOG


USAGE

git log

THE GIT LOG COMMAND IS GIT'S BASIC TOOL FOR EXPLORING A REPOSITORYS HISTORY. ITS
WHAT YOU USE WHEN YOU NEED TO FIND A SPECIFIC VERSION OF A PROJECT OR FIGURE OUT
WHAT CHANGES WILL BE INTRODUCED BY MERGING IN A FEATURE BRANCH.

commit 3157ee3718e180a9476bf2e5cab8e3f1e78a73b7
Author: John Smith
SAVING CHANGES

COMMAND1: GIT ADD


USAGE

git add <file>


git add <directory>
THE GIT ADD COMMAND ADDS A CHANGE IN THE WORKING DIRECTORY TO THE STAGING AREA. IT
TELLS GIT THAT YOU WANT TO INCLUDE UPDATES TO A PARTICULAR FILE IN THE NEXT COMMIT.
SAVING CHANGES

COMMAND2: GIT COMMIT


USAGE

git commit
git commit a
git commit a m commit message

THE GIT COMMIT COMMAND COMMITS THE STAGED SNAPSHOT TO THE PROJECT HISTORY.
COMMITTED SNAPSHOTS CAN BE THOUGHT OF AS SAFE VERSIONS OF A PROJECTGIT WILL
NEVER CHANGE THEM UNLESS YOU EXPLICITY ASK IT TO.
SAVING CHANGES

COMMAND3: GIT STASH


USAGE

git stash
git stash apply

GIT STASH TEMPORARILY SHELVES (OR STASHES) CHANGES YOU'VE MADE TO YOUR WORKING COPY SO
YOU CAN WORK ON SOMETHING ELSE, AND THEN COME BACK AND RE-APPLY THEM LATER ON.
STASHING IS HANDY IF YOU NEED TO QUICKLY SWITCH CONTEXT AND WORK ON SOMETHING ELSE, BUT
YOU'RE MID-WAY THROUGH A CODE CHANGE AND AREN'T QUITE READY TO COMMIT.
COLLABORATION

COMMAND1: GIT PULL


USAGE

git pull <remote>

MERGING UPSTREAM CHANGES INTO YOUR LOCAL REPOSITORY IS A COMMON TASK IN GIT-BASED
COLLABORATION WORKFLOWS. WE FETCH THE SPECIFIED REMOTES COPY OF THE CURRENT
BRANCH AND IMMEDIATELY MERGE IT INTO THE LOCAL COPY.
COLLABORATION

COMMAND2: GIT PUSH


USAGE

git push <remote> <branch>


git push <remote> --all

PUSHING IS HOW YOU TRANSFER COMMITS FROM YOUR LOCAL REPOSITORY TO A REMOTE REPO.
PUSHING EXPORTS COMMITS TO REMOTE BRANCHES. THIS HAS THE POTENTIAL TO OVERWRITE
CHANGES, SO YOU NEED TO BE CAREFUL HOW YOU USE IT.
AND A LOT MORE

GIT ALLOWS YOU TO CREATE BRANCHES AND WORK ON VARIOUS VERSIONS OF THE CODE
IT CAN ALLOW YOU TO GO TO ANY PREVIOUS COMMITTED VERSION OF THE CODE
IT ALSO ALLOWS YOU TO COLLABORATE WITH YOUR PEERS WHILE WORKING ON ANY
PROJECT
FOR MORE DETAILS AND TUTORIALS ON GIT VISIT
HTTPS://WWW.ATLASSIAN.COM/GIT/TUTORIALS/LEARN-GIT-WITH-BITBUCKET-CLOUD
HTTPS://GIT-SCM.COM/DOCS/
NEXT STEPS

CREATE YOUR ACCOUNT ON GITHUB AND GIVE US YOUR USERNAME


YOU WILL BE ASSIGNED A PROJECT AND A TEAM
CLONE THE REPOSITORY ON YOUR LOCAL MACHINE
CREATE A FOLDER AUTHOR. INSIDE AUTHOR, CREATE A TEXT FILE WITH YOUR NAME, ADD YOUR
BIO-DATA TO IT AND PUSH IT ON THE ACCOUNT.
EVERYONE SHOULD UPDATE THEIR REPOSITORIES SO THAT ALL THE FILES ARE PRESENT ON
EACH PERSONS LOCAL MACHINE

You might also like

pFad - Phonifier reborn

Pfad - The Proxy pFad of © 2024 Garber Painting. All rights reserved.

Note: This service is not intended for secure transactions such as banking, social media, email, or purchasing. Use at your own risk. We assume no liability whatsoever for broken pages.


Alternative Proxies:

Alternative Proxy

pFad Proxy

pFad v3 Proxy

pFad v4 Proxy