If you haven't yet checkout out Netlify, you definitely should!
While Netlify has direct integration with Github, Bitbucket and the managed Gitlab service, things get confusing if you have your own Gitlab instance. This post is to help out anyone wanting to write a Gitlab pipeline to deploy their website directly to Netlify from Gitlab's CI/CD tool.
Step 1: Get your Netlify Personal Access
Head over to User Settings > Applications > Personal Access Token and generate a new access token. You put "Gitlab CD" as the description of your token. Once generated, make sure you copy and keep the access token in a file or in an active editor window.
Step 2: Get your Netlify Site API ID
Next, go to your site's setting page in Netlify Dashboard can copy the value of API ID
.
Step 3: Add the variables to your Gitlab CI/CD settings
Open the repo on your self-hosted Gitlab instance and go to Settings > CI/CD.
- Add the access token from step 1 under the variable name
NETLIFY_AUTH_TOKEN
- Add the API ID from step 2 under the variable name
NETLIFY_SITE_ID
.
Step 4: Add a .gitlab-ci.yml
file to your repo
Add the Gitlab CI file to your repo. Following is a basic template to start you off:
stages:
- deploy
deploy:
stage: deploy
environment:
name: production
url: https://your.website.com
only:
- master
script:
- npm i
# your build command
- npm run build
- npx netlify-cli deploy --site $NETLIFY_SITE_ID --auth $NETLIFY_AUTH_TOKEN --prod
Step 5: Add a file named netlify.toml
to your repo
This file contains the directory which needs to be pushed to Netlify (the directory where your project is built). It's usually named build
or dist
.
[build]
publish = "build"
That's it! Now just commit these changes and push to master
and see your website get deployed on Netlify :)
Top comments (8)
Nice article!
Just quick note for those whom this CI config is failing, you might need to add
image: node:latest
at the top.Hi
Do u have any idea for a site which is not created on netlify and than deploy it from gitlab.xyz.com to netlify
my company has there own gitlab , the repo is there in companys gitlab
when i m going on netlify > Sites > new Site from Git > than deploy it from gitlab it is opening gitlab.com so how can i conect my companys gitlab to ntelify
Hi
found the solution , it was forceful from netlify side , i have to buy the enterprise version of netlify hosting to put the app secret and aonr more credential to open that popup as gitlab enterprise login.
appreciate ur guyz efforts
Appreciate your efforts to come back and comment the solution you found.
I tried it and it works thanks bro
Did they change something ? I didn't have to do that in the past.
Its for if you have a self hosted Gitlab. If you use gitlab.com, Netlify can directly request access to your repos
Hi, please, could u tell me if I am using GitLab.com with Netlify, i dont need to configure .gitlab-ci.yml and .gitlab-cd.yml ? is no longer necessary? Thanks.