Deploying to Netlify
After this, you'll be able to deploy your HTML portfolio to a live URL using Netlify drop, and update it later without starting over.
Before you start
Complete Embedding Your Showreel first; this lesson deploys the HTML file you built.
The idea
Netlify drop is the fastest path from an HTML file to a live URL. You drag your index.html file onto a box at netlify.com/drop, Netlify prompts you to create a free account (email and password, no credit card, under 60 seconds), and your site is live at a .netlify.app URL anyone in the world can open. The whole process, from dragging the file to having a shareable URL, takes under two minutes. That URL is the real URL, not a preview. You can share it with clients immediately.
Here is the before and after: Without knowing the update workflow, people re-drag their file to netlify.com/drop when they make changes, which creates a brand new site with a new URL, breaking any links they have already shared. With the correct workflow, they go to the Deploys tab on their existing Netlify site, drag the updated file there, and the original URL is updated instantly. Same URL, new content, no broken links.
Now try it: drag your index.html file (or folder if you have local images) to netlify.com/drop, create the free account when prompted, and open your .netlify.app URL in an incognito window to confirm it is publicly visible. Share the URL with at least one other person before moving to the domain lesson. If someone else can open it, it is live.
Try it (8 min)
Watch out for
- Dragging the wrong thing. If you have a folder structure, drag the folder, not just the HTML file; dragging only the HTML file when images are in a subfolder produces broken image links
- Forgetting to test in incognito before sharing. What looks correct when you built it locally may have a broken embed or missing image
- Skipping the free account setup. Netlify prompts you to create one when you deploy; it takes under 60 seconds and keeps your site live permanently; do not close the tab before completing it
- Sharing the link before checking the mobile view. Open it on your actual phone before sending to clients
- Re-dragging to netlify.com/drop instead of the Deploys tab when updating. The drop zone creates a new site with a new URL; the Deploys tab on your existing site is where you push updates without changing your URL
Paste this into Claude
I want to deploy my portfolio HTML file to Netlify using Netlify Drop. Walk me through the exact steps. My situation: [choose one] - I have a single index.html file with no separate image files - I have an index.html file and a folder of images - I have multiple HTML files (more than one page) Questions I have: 1. Do I need to create a Netlify account first, or after? 2. What exactly do I drag onto the drop zone: the file, or a folder? 3. How long does my site stay live? 4. Can I update the site later if I change my HTML file, and will my URL stay the same? 5. Where in Netlify do I go to deploy an updated version? Please walk me through it step by step assuming I have never used Netlify before.
What good looks like
- You have a live .netlify.app URL that opens your portfolio in a browser
- The URL works when you open it in incognito (confirming it is public, not just local)
- Your showreel section loads and the video plays
- You can share the URL with someone right now and they would see your portfolio
- You know where in Netlify to go when you want to deploy an updated version
When this breaks
- Breaks when the portfolio shows broken image boxes after deploying. This means Claude used local image paths instead of hosted URLs. Ask Claude: 'Replace any local images with neutral color blocks using the project name as a label, so the site deploys cleanly'
- Breaks when the site is deployed but looks broken because it was never tested locally first. Always open the HTML file in a browser before deploying
AI can help with this
Use Claude or your build tool to help you you can deploy your HTML portfolio to a live URL using Netlify drop, and update it later without starting over. Start with the exercise prompt and your real input. Ask for one draft, then check it against this proof: You have a live .netlify.app URL that opens your portfolio in a browser. Accept only the version you can verify yourself.
You can now
You have a live .netlify.app URL that opens your portfolio in a browser
- The URL works when you open it in incognito (confirming it is public, not just local)
- Your showreel section loads and the video plays
- You can share the URL with someone right now and they would see your portfolio
- You know where in Netlify to go when you want to deploy an updated version
Key takeaways
Netlify drop turns an HTML file into a live URL in under two minutes. To update later: go to Netlify Deploys tab, drag the new file. Your URL stays the same. Test in incognito before sharing.
- Netlify drop: drag your file or folder onto netlify.com/drop, create a free account (under 2 minutes total), live URL.
- Updates go to the Deploys tab on your existing site, not back to netlify.com/drop, which creates a new URL.
- The free Netlify account keeps your site live permanently. No credit card, no cost.
- Test in incognito before sharing. A deploy does not fix a broken embed.
- Mobile check before sharing. Open on your actual phone, not a browser resize.