Getting started overview
Getting started with Netlify primarily involves connecting a Git repository, configuring build settings, and initiating the deployment of a web project. Netlify specializes in automating the deployment process for modern web applications, particularly those built with static site generators or frontend frameworks. This approach supports continuous deployment workflows, where changes pushed to a Git branch automatically trigger a new build and deployment to Netlify's global content delivery network (CDN) Netlify build and deploy overview. The platform also supports serverless functions, allowing developers to add dynamic backend capabilities without managing servers.
The typical workflow progresses from creating a Netlify account to linking your project's Git repository (e.g., GitHub, GitLab, Bitbucket), defining the build command and publish directory, and then deploying the site. Subsequent updates to the connected Git branch will automatically trigger new deployments, providing a streamlined developer experience. Netlify's free Starter plan provides resources for personal and small projects, including bandwidth, build minutes, and serverless function invocations Netlify pricing plans.
Create an account and get keys
To begin using Netlify, you need to create an account. Netlify supports several sign-up methods, primarily through existing Git providers, which simplifies the process of connecting your repositories later. Follow these steps:
- Navigate to Netlify's website: Go to the Netlify homepage.
- Sign Up: Click the "Sign up" button. You will be presented with options to sign up using your GitHub, GitLab, Bitbucket, or email address. Using a Git provider is recommended as it integrates directly with your code repositories.
- Authorize Netlify: If you choose a Git provider, you will be redirected to that provider's authorization page. Grant Netlify the necessary permissions to access your repositories. This allows Netlify to list your repositories and set up webhooks for continuous deployment.
- Access the Dashboard: Once authorized, you will be redirected to your Netlify dashboard.
Personal Access Tokens (PATs)
While direct API keys for deployment are not the primary method for getting started with Netlify's continuous deployment, Personal Access Tokens (PATs) are essential for interacting with the Netlify API programmatically or via the Netlify CLI. To generate a PAT:
- Go to User Settings: In your Netlify dashboard, click on your avatar in the top right corner and select "User settings."
- Access Applications: Navigate to the "Applications" section.
- Generate New Token: Under "Personal access tokens," click "New access token."
- Name and Create: Give your token a descriptive name (e.g., "CLI Access") and click "Generate token."
- Save Token: Copy the generated token immediately. It will only be shown once. Treat this token like a password, as it grants access to your Netlify account and projects.
These tokens are crucial for automated workflows, such as deploying from CI/CD pipelines not directly integrated with Netlify's Git-based deployment, or for managing sites and functions via scripts Netlify CLI setup guide.
Your first request
The "first request" in Netlify's context typically refers to your first successful site deployment and its subsequent availability via a URL. This involves connecting a Git repository and allowing Netlify to build and deploy your project automatically. Here's how to deploy your first site:
- From your Netlify dashboard, click "Add new site" then "Import an existing project."
- Connect to Git Provider: Choose your Git provider (GitHub, GitLab, or Bitbucket) and authorize Netlify if you haven't already.
- Pick a Repository: Select the repository containing your web project. Netlify will list repositories accessible to your connected Git account.
- Configure Build Settings: Netlify often auto-detects common frameworks (e.g., React, Vue, Hugo, Jekyll) and suggests appropriate build commands and publish directories. You may need to adjust these based on your project's specific setup. For example:
- Build command:
npm run buildoryarn build(for Node.js projects),hugo(for Hugo sites),jekyll build(for Jekyll sites). - Publish directory:
build,dist,public, or_site. This is the folder containing the compiled static assets that Netlify should serve. - Branch to deploy: Usually
mainormaster.
- Build command:
- Deploy Site: Click "Deploy site." Netlify will clone your repository, run the build command, and deploy the output to its CDN.
- Access Your Site: Once the deployment is complete, Netlify provides a unique URL (e.g.,
https://your-random-name.netlify.app) where your site is live. You can also configure a custom domain later.
Example: Deploying a simple HTML site
If you have a repository with just an index.html file and some CSS/JS, the build settings would be minimal:
- Build command: (leave empty, as there's no build step)
- Publish directory:
/(or leave empty, Netlify will default to the root)
Netlify will then directly serve the files from your repository's root.
Using the Netlify CLI (for direct deployment)
For more control or deploying local folders without a Git repository, the Netlify CLI can be used:
npm install -g netlify-cli
netlify login
netlify deploy --prod --dir=./path/to/your/site
The netlify login command will prompt you to open a browser to authenticate your account. The --dir flag specifies the directory to deploy, and --prod deploys to your live production URL. This method is useful for quick tests or deploying projects not managed by Git Netlify CLI manual deploys.
Common next steps
After successfully deploying your first site, several common steps enhance your Netlify experience:
- Custom Domains: Connect your own domain name to your Netlify site. This involves adding the domain in your Netlify dashboard and configuring your DNS records at your domain registrar to point to Netlify's name servers or CNAME records Netlify custom domain configuration.
- HTTPS/SSL: Netlify automatically provisions and renews SSL certificates (via Let's Encrypt) for custom domains, ensuring your site is served securely over HTTPS.
- Environment Variables: Configure environment variables for your build process or serverless functions. This is crucial for securely managing API keys, database credentials, or other sensitive information that should not be committed to your repository.
- Netlify Functions: Add serverless functions to your project to handle dynamic tasks, API routes, or backend logic without managing servers. These functions can be written in JavaScript, Go, or other supported languages and are deployed alongside your frontend code Netlify Functions documentation.
- Build Hooks: Trigger deployments from external services using build hooks. This is useful for content management systems (CMS) that need to rebuild your site when content changes.
- Redirects and Rewrites: Configure
_redirectsfile ornetlify.tomlto manage URL redirects, rewrites, and proxy requests, which is essential for SEO and user experience. - Forms: Utilize Netlify Forms to easily collect submissions from your static site without needing a separate backend service.
- Analytics: Integrate Netlify Analytics to gain insights into your site's traffic and performance.
- Collaboration: Invite team members to your Netlify account to collaborate on projects, managing roles and permissions.
- Explore Edge Functions: For advanced use cases, explore Netlify Edge Functions, which allow you to run code at the edge of Netlify's network for faster response times and personalized content delivery. These are built on WebAssembly and run in a Deno environment Netlify Edge Functions overview.
These features expand the capabilities of your web project, moving beyond static content to include dynamic interactions, secure data handling, and optimized delivery.
Troubleshooting the first call
When your initial Netlify deployment doesn't go as expected, or your site doesn't appear correctly, here are common issues and troubleshooting steps:
| Step | What to do | Where |
|---|---|---|
| Check Build Logs | Review the build logs in your Netlify dashboard for errors during the build process. Look for failed commands, missing dependencies, or syntax errors. | Netlify Dashboard > Site > Deploys > Specific Deploy > Build log |
| Verify Build Command | Ensure your build command is correct for your project's framework (e.g., npm run build, hugo). A common mistake is an incorrect command or missing a required script in package.json. |
Netlify Dashboard > Site settings > Build & deploy > Build settings |
| Confirm Publish Directory | The "Publish directory" must point to the folder containing your compiled static assets (e.g., build, dist, public). If incorrect, Netlify won't find the files to serve. |
Netlify Dashboard > Site settings > Build & deploy > Build settings |
| Inspect Deployed Files | After a successful build, you can inspect the deployed files directly in the Netlify dashboard to confirm the correct assets are present. | Netlify Dashboard > Site > Deploys > Specific Deploy > Published deploy > Files tab |
| Environment Variables | If your build or functions rely on environment variables, ensure they are correctly set in Netlify. Missing or incorrect variables can cause build failures or runtime errors. | Netlify Dashboard > Site settings > Build & deploy > Environment |
| Git Repository Connection | Verify that Netlify has the necessary permissions to access your Git repository and that the correct branch is being monitored for deployments. Re-linking the repository can sometimes resolve permission issues. | Netlify Dashboard > Site settings > Build & deploy > Continuous Deployment |
| Clear Cache & Redeploy | Sometimes, cached build artifacts can cause issues. Try clearing the build cache and redeploying. | Netlify Dashboard > Site > Deploys > Trigger deploy > Deploy site with clear cache |
| Check DNS Settings (if using custom domain) | If your custom domain isn't working, verify that your DNS records (CNAME or A records) are correctly configured to point to Netlify. Use a tool like dig or online DNS checkers to confirm propagation. Cloudflare's DNS checker Cloudflare DNS troubleshooting guide can be helpful. |
Your DNS registrar's control panel and Netlify Dashboard > Site settings > Domain management |
| Local vs. Netlify Build Differences | Ensure your local build environment closely matches Netlify's build environment (e.g., Node.js version, dependency versions). Discrepancies can lead to successful local builds but failed Netlify builds. Specify Node.js version in netlify.toml or package.json. |
Your project's package.json or netlify.toml file, and Netlify documentation on build environment. |
By systematically checking these areas, you can identify and resolve most common deployment issues on Netlify.