Web Development with Coding
Git & GitHub Mastery
In This Section, You Will Learn:
- • What Git is and why it's essential
- • Basic Git commands you'll use daily
- • GitHub – hosting and collaboration
- • Creating repositories and pushing code
- • Branching for safe experimentation
- • Building your developer portfolio
What is Git?
- Git is a version control system — it tracks changes to your code.
- Why Git is Essential:
- • Save 'checkpoints' of your code
- • Revert to previous versions if something breaks
- • Work on features without affecting main code
- • Collaborate with other developers
- • Required for EVERY developer job
- Without Git:
- • You break something, everything is lost
- • No history of changes
- • Impossible team collaboration
- With Git:
- • Code history is preserved
- • Safe experimentation
- • Professional workflow
Essential Git Commands
- Initialize Git:
- “`
- git init
- “`
- Check Status:
- “`
- git status
- “`
- Stage Changes:
- “`
- git add . // stage all files
- git add filename.js // stage specific file
- “`
- Commit (Save Checkpoint):
- “`
- git commit -m 'Add login feature'
- “`
- View History:
- “`
- git log
- “`
- Workflow: Edit files → git add → git commit → repeat
GitHub – Your Code Home
- GitHub hosts your Git repositories online.
- Benefits:
- • Backup your code in the cloud
- • Share code with others
- • Collaborate on projects
- • Showcase your work (portfolio)
- • Your 'green squares' show activity
- Setting Up:
- 1. Create account at github.com
- 2. Create a new repository
- 3. Connect local project:
- “`
- git remote add origin https://github.com/username/repo.git
- git push -u origin main
- “`
- Your GitHub profile = Your developer resume
Branching – Safe Experimentation
- Branches let you work on features without affecting main code.
- Create and Switch Branch:
- “`
- git checkout -b feature-login
- // Now you're on the 'feature-login' branch
- “`
- Switch Between Branches:
- “`
- git checkout main // go to main
- git checkout feature-login // go back to feature
- “`
- Merge Branch:
- “`
- git checkout main
- git merge feature-login
- “`
- Workflow:
- 1. Create branch for new feature
- 2. Build and test the feature
- 3. Merge back to main when done
- 4. Delete the feature branch
Writing Great READMEs
- README.md is the first thing people see on your repo.
- Good README Contains:
- • Project title and description
- • Screenshot or demo GIF
- • Technologies used
- • How to install and run
- • Features list
- • Contact information
- Template:
- “`markdown
- # Project Name
- A brief description of what this project does.
- ## Demo
- 
- ## Technologies
- – React
- – Node.js
- – MongoDB
- ## Installation
- “`npm install && npm run dev“`
- “`
- Quality READMEs impress employers.