Skip to content
Photography Portfolio

Deploy to Netlify

This guide walks you through deploying your Photography Portfolio to Netlify, the default deployment platform for this template.

Why Netlify?

  • Pre-configured adapter
  • Automatic SSL certificates
  • Continuous deployment from Git
  • Built-in form handling
  • Generous free tier

Prerequisites

  • A Netlify account
  • Your project pushed to a Git repository (GitHub, GitLab, or Bitbucket)
  • Node.js 18 or higher

Deployment Steps

1. Connect Your Repository

  1. Log in to Netlify
  2. Click “Add new site” → “Import an existing project”
  3. Connect to your Git provider
  4. Select your photography portfolio repository

2. Configure Build Settings

Netlify should auto-detect these settings, but verify they match:

Terminal window
Build command: npm run build
Publish directory: dist
Node version: 18 (or higher)

3. Set Environment Variables

In Netlify dashboard:

  1. Go to Site settings → Environment variables
  2. Add your .env variables:
    Terminal window
    SANITY_TOKEN=your_sanity_api_token
    SANITY_PROJECT_ID=your_sanity_project_id
    SANITY_DATASET= production
    SANITY_STUDIO_PREVIEW_URL= #name of your website
    PUBLIC_SANITY_VISUAL_EDITING_ENABLED=true
    NOTIFICATION_EMAIL= #your email
    RESEND_API_KEY=your_resend_api_key

4. Deploy

  1. Click “Deploy site”
  2. Wait for the initial build to complete
  3. Your site will be live at [your-site-name].netlify.app

Custom Domain (Optional)

To add your custom domain:

  1. Go to Site settings → Domain management
  2. Click “Add custom domain”
  3. Follow Netlify’s DNS configuration instructions

Continuous Deployment

Netlify automatically:

  • Deploys when you push to your main branch
  • Creates preview deployments for pull requests
  • Handles SSL certificate renewal

Troubleshooting

Build Failures

  • Check your Node.js version in package.json
  • Verify all dependencies are installed
  • Review build logs in Netlify dashboard

Runtime Errors

  • Ensure environment variables are set correctly
  • Check Sanity project permissions
  • Verify SSR configuration in astro.config.mjs

Join our Telegram support group here.