loading...
Cover image for Self Hosted Gitlab Continuous Deployment to Netlify

Self Hosted Gitlab Continuous Deployment to Netlify

sidhantpanda profile image Sidhant Panda ・2 min read

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.

Screenshot-2019-08-27-at-1-39-36-AM

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 :)

Discussion

pic
Editor guide
Collapse
lepinekong profile image
lepinekong

Did they change something ? I didn't have to do that in the past.

Collapse
sidhantpanda profile image
Sidhant Panda Author

Its for if you have a self hosted Gitlab. If you use gitlab.com, Netlify can directly request access to your repos

Collapse
lizzymendivil profile image
Lizzy Mendivil

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.

Collapse
kingdavidmiles profile image
david miles

I tried it and it works thanks bro