Deployment
From Local to Live
Chapter 7: Making It Live - Deployment Without Tears
The Moment of Truth
You’ve built something. It works on your computer. Now comes the terrifying question: “How do I make this live so other people can actually see it?”
I remember staring at my completed cleaning business website, genuinely confused about this exact question. The AI had helped me build a beautiful site, but there was a gap between “works on my machine” and “anyone can visit this at a real URL.”
This chapter closes that gap. Not with technical jargon about servers and DNS, but with the specific prompts and choices that take your project from local files to live website.
The Two Types of “Live”
First, let’s clarify what “making it live” actually means because there are two very different scenarios:
Static Sites (No backend database, no user accounts, no server processing)
- Landing pages
- Portfolio sites
- Basic business sites
- Informational pages
These are the easiest to deploy. My cleaning business site and directory site both fall into this category.
Dynamic Sites (Requires database, user accounts, or server processing)
- Apps with user login
- Sites that process payments
- Anything storing user data
- Real-time features
These require more infrastructure. My Pomodoro timer could be static, but if I wanted to save users’ sessions, it would need to be dynamic.
Your AI agent built your site in one of these categories. Knowing which one determines your deployment path.
The Deployment Vocabulary
You need to know these six terms. That’s it.
Domain: Your site’s address (like cleaningpros.com) Hosting: Where your site’s files actually live Deployment: The process of putting your files on the host DNS: The system connecting your domain to your hosting SSL/HTTPS: The “secure” padlock in the browser bar Build: The process of preparing your code for deployment
When your AI talks about deployment, it’s using these concepts. Now you know what they mean.
Static Site Deployment: The Easy Path
Choosing Your Host
For static sites, I recommend Netlify or Vercel. Here’s why: they’re free for basic projects, deploy in minutes, and handle the technical stuff automatically.
The Hosting Setup Prompt:
I have a static website built with [your framework/technology].
I want to deploy it to [Netlify/Vercel].
Guide me through:
1. What files I need to prepare for deployment
2. How to organize them for upload
3. What settings to configure on [chosen platform]
4. How to verify it deployed correctly
Keep explanations beginner-friendly.
The One-Click Deploy
Here’s what shocked me: deploying my cleaning business site took 5 minutes. Not because I’m technical, but because modern platforms make it stupidly simple.
The Deployment Prompt:
Walk me through deploying this to [Netlify/Vercel] step by step.
For each step, tell me:
- What button to click or command to run
- What I should see happening
- How to know if it worked
- What to do if I see an error
Assume I've never deployed anything before.
The AI will give you a literal play-by-play. Follow it exactly.
Real Example: My Cleaning Business Deploy
Here’s what the actual deployment looked like:
- Created free Netlify account (2 minutes)
- Clicked “Add new site” → “Deploy manually”
- Dragged my project folder into the upload zone
- Waited 30 seconds
- Got a live URL: random-name-12345.netlify.app
That was it. The site was live. Anyone could visit it.
But it had a ugly URL. Here’s how I fixed that:
I deployed to Netlify and got the URL: random-name-12345.netlify.app
I want to change this to a custom domain: cleaningprosnc.com
Walk me through:
1. How to purchase/configure the domain
2. How to connect it to my Netlify site
3. What DNS settings to change
4. How long before it works
Explain each step like I've never done this.
The AI explained domain purchasing (I used Namecheap for $12/year), then provided the exact DNS settings to enter. 24 hours later, cleaningprosnc.com was live.
Dynamic Site Deployment: The Platform Approach
Dynamic sites need more infrastructure, but modern platforms handle most of the complexity.
Choosing Your Platform
For dynamic apps, I use Railway or Render. They’re beginner-friendly and have generous free tiers.
The Platform Setup Prompt:
My app is built with [your technology] and needs:
- Database for [describe what data]
- User authentication
- [any other backend features]
I want to deploy to [Railway/Render].
Explain:
1. What additional configuration my app needs
2. How to set up the database
3. What environment variables I need
4. Security settings I should configure
Guide me through each piece separately.
The Environment Variables Mystery
This confused me for hours on my first deploy. The AI kept saying “add your API keys to environment variables” but I didn’t know what that meant.
Here’s the simple version: Environment variables are secret configuration settings (like API keys, database passwords) that your app needs but shouldn’t be visible in your code.
The Environment Config Prompt:
My app needs these API keys and secrets:
[list what you're using - email API, payment API, database, etc.]
For [deployment platform]:
1. Show me exactly where to add these secrets
2. What to name each variable
3. How my app will access them
4. How to verify they're working
Provide screenshots or exact navigation steps.
Database Setup That Makes Sense
Most AI agents default to recommending databases like PostgreSQL or MongoDB. These are powerful but overkill for most first projects.
The Database Choice Prompt:
My app needs to store:
[describe your data - user profiles, blog posts, etc.]
Estimated users: [your realistic estimate]
Recommend the simplest database option that will:
1. Work with my current code
2. Have a free tier adequate for my scale
3. Be easy to set up on [your platform]
Then guide me through connecting it.
For my directory site, the AI suggested Airtable as the database because it’s visual, has a generous free tier, and doesn’t require SQL knowledge. Perfect choice.
The Pre-Launch Checklist
Before you make anything public, run through this. I learned these the hard way:
The Final Check Prompt:
Before I make this live, verify:
Functionality:
□ All links work and go to correct pages
□ Forms submit properly
□ Search/filter features function
□ Mobile version works correctly
Security:
□ HTTPS/SSL is enabled
□ API keys are in environment variables (not code)
□ No sensitive data is exposed
□ User data (if any) is properly protected
Performance:
□ Images are optimized
□ Page loads in under 3 seconds
□ No console errors
□ Works in Chrome, Safari, Firefox
Walk me through testing each of these and fixing any issues found.
Domain Configuration Deep Dive
Connecting a custom domain is where most people get stuck. The terminology is confusing and the settings are buried in different places.
The Domain Connection Prompt:
I purchased the domain [yoursite.com] from [Namecheap/GoDaddy/etc.].
I deployed my site to [Netlify/Vercel/Railway/etc.].
Provide two complete guides:
1. What settings to change in my domain registrar:
- Exact DNS records to add/modify
- What values to enter
- What to delete/ignore
2. What settings to change in my hosting platform:
- Where to add my custom domain
- What verification steps to complete
- How to enable SSL
Include screenshots or specific navigation paths.
The AI will give you the exact DNS records. It looks like this:
A Record: @ → 75.2.60.5
CNAME Record: www → your-site.netlify.app
You don’t need to understand what those mean. Just copy them exactly into the DNS settings.
Common Deployment Disasters (And Fixes)
“My Site Shows 404 Not Found”
The Debug Prompt:
My deployment completed successfully but visiting [URL] shows "404 Not Found"
Diagnose:
1. Is the issue with the hosting platform or domain configuration?
2. What specific setting is likely wrong?
3. How to verify where the domain is actually pointing?
4. Step-by-step fix for this error
Check the most common causes first.
Usually this means DNS settings aren’t correct or haven’t propagated yet. Takes 24-48 hours sometimes.
”Some Features Work Locally But Not Live”
This happened with my Pomodoro timer. The timer worked perfectly on my computer but broke when deployed.
The Environment Diagnosis Prompt:
Feature [describe feature] works locally but fails when deployed.
Error message (if any): [paste error]
Debug:
1. What typically causes this local vs. production difference?
2. What environment-specific settings might be missing?
3. How to test this on the live site safely?
4. What logs or errors should I check?
Focus on the most likely causes for beginners.
In my case, the issue was API endpoints - the code was pointing to “localhost” instead of the actual deployed URL. Simple fix once I knew what to look for.
”Site is Slow After Deploying”
The Performance Optimization Prompt:
My deployed site is noticeably slower than local version.
Load time issues:
- [specific pages that are slow]
- [features that lag]
Optimize by:
1. Identifying the biggest performance bottlenecks
2. Compressing images without quality loss
3. Enabling caching where appropriate
4. Removing unnecessary code
Provide specific file changes or platform configurations.
Usually it’s unoptimized images. The AI can help you compress them or set up lazy loading.
The Post-Deploy Workflow
Once your site is live, changes work differently. Here’s the workflow that makes sense:
The Update Strategy Prompt:
My site is live at [URL]. I want to make changes to [describe changes].
Before I deploy these changes:
1. How can I test them without affecting the live site?
2. What's the safest way to deploy updates?
3. How can I rollback if something breaks?
4. Should I create a staging environment?
Recommend the simplest workflow for a beginner.
For my sites, I use Netlify’s deploy previews - changes go to a temporary URL first, I test them, then deploy to production if they work. The AI can set this up for you.
The Staging Site Strategy
As your project grows, you need a “test version” where you can break things without affecting your live site.
The Staging Setup Prompt:
Set up a staging environment where I can test changes before deploying to my live site at [yoursite.com]
I need:
1. A separate URL for testing (staging.yoursite.com or similar)
2. Same configuration as production but separate data
3. Easy way to promote changes from staging to production
Guide me through setting this up on [your platform].
This seems advanced but it’s actually simple on platforms like Netlify - just a different branch deployment.
Monitoring Your Live Site
How do you know if your site breaks for users? You need basic monitoring.
The Monitoring Setup Prompt:
My site is live at [URL]. I want to know if/when it goes down or has errors.
Set up basic monitoring:
1. Free uptime monitoring service
2. Error tracking for JavaScript issues
3. Simple analytics to see visitor count
4. How to receive alerts if something breaks
Recommend beginner-friendly tools only.
I use UptimeRobot (free, sends email if site goes down) and Sentry (catches JavaScript errors). Both have simple setup prompts the AI can walk you through.
The Platform Comparison Guide
When the AI recommends a hosting platform, ask for context:
The Platform Comparison Prompt:
Compare these deployment platforms for my [static/dynamic] site:
Consider:
- Free tier limitations
- Ease of use for beginners
- Deployment speed
- Custom domain setup
- Performance/reliability
- When I'd need to upgrade
Recommend the best fit for: [describe your project and expected traffic]
This gives you context instead of just following the AI’s first suggestion.
Real World Deploy: The Directory Site
Let me walk you through the actual deployment of my directory site:
Initial Deploy:
- Built site locally with AI’s help
- Used this prompt: “Guide me through deploying this to Netlify step by step”
- Followed AI’s instructions: created account, connected GitHub repo
- Got temporary URL: project-directory-8473.netlify.app
- Tested everything: worked perfectly
Custom Domain: 6. Asked: “How do I connect my domain designdirectory.io to this Netlify site?” 7. Purchased domain on Namecheap ($14/year) 8. Added DNS records AI specified 9. Waited 24 hours for DNS propagation 10. Site live at designdirectory.io
Post-Launch Update: 11. Wanted to add new feature (filter by category) 12. Built locally, tested, worked great 13. Pushed changes to GitHub 14. Netlify auto-deployed (set this up initially) 15. New feature live in 2 minutes
Total deployment time: about 30 minutes of actual work spread over 2 days (waiting for DNS).
What This Chapter Gives You
You now have:
- Understanding of static vs dynamic deployment
- Specific prompts for major hosting platforms
- Domain connection strategies that work
- Common deployment problems and their fixes
- A post-deployment workflow
- Real examples from actual projects
Deployment isn’t mysterious. It’s just following steps in the right order and knowing what prompts to use when you get stuck.
Next up: Chapter 8 covers what happens after launch - the tools and prompts for maintaining, updating, and improving your live site.