Module 5: Continuous Deployment Setup

Overview

Stop deploying manually! Connect GitHub to Netlify once, and every push automatically updates your live site. This module transforms you from manual deployer to automation master, implementing professional continuous deployment in minutes.

What You'll Learn

Connecting GitHub to Netlify
Automatic deployment on every push
Branch deployment strategies
Understanding CI/CD pipelines
Professional deployment workflows

Prerequisites

Completed Modules 1-4
GitHub repository with website
Netlify site deployed at least once
Ready to embrace automation
35 minutes for setup

Why Continuous Deployment?

The Manual Problem

Current workflow:

Make changes
Commit to Git
Push to GitHub
Remember to deploy
Run Netlify command
Wait and verify

Often forget step 4-6!

The Automated Solution

With continuous deployment:

Make changes
Commit to Git
Push to GitHub
✨ Magic happens ✨
Site updates automatically!

Professional Benefits

No forgotten deployments
Instant updates
Team collaboration
Deployment history
Easy rollbacks

Connecting GitHub to Netlify

The Integration Process

Ask Claude:

⚡ I want to connect my GitHub repository to Netlify for 
automatic deployments. Guide me through it.

Two approaches:

Via Netlify CLI (recommended)
Via Netlify web interface

CLI Connection Method

⚡ Show me how to connect GitHub to Netlify using the CLI.

Claude guides:

# In your project directory
netlify init

# Choose: "Link this directory to an existing site"
# Authorize GitHub when prompted

Understanding the Connection

⚡ What permissions is Netlify asking for on GitHub? 
Is this safe?

Claude explains:

Repository access (read)
Webhook creation
Deployment triggers
Security considerations

Configuring Auto-Deploy

Default Behavior

Once connected:

Push to main/master → Production deploy
Push to other branches → Preview deploy
Pull requests → Deploy previews

Build Settings

⚡ Check and explain my Netlify build settings. 
What happens during each deployment?

Claude shows:

netlify open:admin
# Navigate to Site settings → Build & deploy

Build Configuration

⚡ My site is just HTML/CSS/JS. Do I need build commands?

For static sites:

Build command: (leave empty)
Publish directory: .
No build step needed!

Testing Continuous Deployment

Your First Auto-Deploy

Let's test it:

⚡ Help me test continuous deployment:
1. Make a visible change to my site
2. Commit and push to GitHub
3. Monitor the deployment

Claude guides:

Edit your site
Git add, commit, push
Watch Netlify dashboard
See automatic deployment!

Monitoring Deployments

⚡ Show me how to monitor my deployments in real-time.

Options:

Netlify dashboard
CLI status command
GitHub commit status
Email notifications

Branch Deployments

Feature Branch Workflow

⚡ I want to test new features without affecting my live site. 
Show me how to use branch deployments.

Claude demonstrates:

# Create feature branch
git checkout -b add-blog-section

# Make changes
# Commit and push
git push -u origin add-blog-section

Result: Preview URL for testing!

Branch Deploy URLs

⚡ How do I find the URL for my branch deployment?

Branch deploys available at: https://[branch-name]--[site-name].netlify.app

Production Protection

⚡ How do I ensure only tested code reaches production?

Learn about:

Protected branches
Deploy contexts
Merge strategies
Review workflows

Deploy Previews

Pull Request Previews

⚡ Explain deploy previews. When would I use them?

Deploy previews create:

Unique URL per PR
Full site preview
Shareable for review
Automatic cleanup

Creating a Pull Request

⚡ Walk me through creating a pull request and seeing 
its deploy preview.

Full workflow:

Create branch
Make changes
Push to GitHub
Open pull request
See deploy preview
Share for feedback

Environment Management

Production vs Development

⚡ How can I have different settings for production and 
development deployments?

Claude explains:

Environment variables
Deploy contexts
Build commands
Configuration files

Deploy Contexts

# netlify.toml
[context.production]
  environment = { NODE_ENV = "production" }

[context.deploy-preview]
  environment = { NODE_ENV = "development" }

[context.branch-deploy]
  environment = { NODE_ENV = "staging" }

Deployment Notifications

Staying Informed

⚡ Set up notifications so I know when deployments succeed or fail.

Notification options:

Email alerts
Slack integration
GitHub commit status
Webhook endpoints

Commit Status Checks

⚡ I see green checkmarks on my GitHub commits. What are those?

Understand:

Deploy status
Build success/failure
Preview URLs
CI/CD feedback

Advanced Workflows

Deployment Strategies

⚡ What deployment strategies do professional teams use?

Learn about:

Feature flags
Blue-green deployments
Canary releases
A/B testing

Build Optimization

⚡ How can I make my deployments faster?

Optimization tips:

Cache dependencies
Minimize build steps
Use build plugins
Optimize assets

Rollback Strategies

When Things Go Wrong

⚡ I pushed broken code to production! How do I quickly rollback?

Three methods:

Netlify dashboard rollback
Git revert and push
Deploy previous build

Deployment History

⚡ Show me how to view my deployment history and restore 
a previous version.

Every deploy saved:

Unique URL
Timestamp
Git commit
One-click restore

CI/CD Best Practices

Deployment Hygiene

Good practices:

Test locally first
Use descriptive commits
Deploy frequently
Monitor results
Document changes

Team Workflows

⚡ How would a team use this setup for collaboration?

Team patterns:

Feature branches
Code reviews
Deploy previews
Merge to main
Auto-deployment

Troubleshooting

Common Issues

"Build failed"

⚡ My automatic deployment failed. How do I debug it?

"Not deploying"

⚡ I pushed to GitHub but Netlify isn't deploying. 
What should I check?

"Wrong branch deploying"

⚡ Netlify is deploying from the wrong branch. How do I fix it?

Monitoring and Logs

Build Logs

⚡ Where can I see detailed logs of what happens during deployment?

Access logs via:

Netlify dashboard
CLI commands
Direct links
Real-time streaming

Performance Monitoring

⚡ How can I monitor my site's performance after deployment?

Tools available:

Netlify Analytics
Lighthouse scores
Speed testing
Uptime monitoring

Checkpoint Task

Your Mission

Implement complete continuous deployment:

GitHub-Netlify Connection
- Connect repository to Netlify
- Verify permissions
- Configure build settings
- Test connection
Automatic Deployment Test
- Make visible change
- Commit with clear message
- Push to GitHub
- Watch automatic deploy
- Verify live update
Branch Deployment
- Create feature branch
- Make experimental change
- Push branch to GitHub
- Access preview URL
- Test without affecting production
Advanced Configuration
- Create netlify.toml
- Set up deploy contexts
- Configure notifications
- Add build optimizations
Documentation
- Update README with:
  - Deployment status badge
  - Deployment instructions
  - Branch strategy
  - Team workflow

Success Criteria

✅ GitHub connected to Netlify
✅ Pushes trigger auto-deploy
✅ Branch previews working
✅ Can rollback if needed
✅ Professional CI/CD pipeline

Celebrating Automation

You're a DevOps Engineer!

You've implemented:

Continuous Integration
Continuous Deployment
Professional workflows
Team-ready setup

No more manual deployments!

What This Enables

Focus on coding
Instant feedback
Safe experimentation
Team collaboration
Professional workflow

Next Steps

You've mastered the basics! Module 6 will show you:

Advanced deployment strategies
Custom domains and HTTPS
Performance optimization
Monitoring and analytics
Scaling techniques

Preparation for Module 6

CI/CD pipeline working
Comfortable with workflow
Ready for advanced features
Excited to optimize

Ready for advanced techniques? Module 6 takes you pro!

Continuous Deployment Setup and Automation

Prerequisites

Next Steps

Your Progress