Je website automatisch deployen met GitHub Actions

Met GitHub Actions kun je automatisch je website naar je Oni.nl webruimte deployen zodra je wijzigingen naar GitHub pusht. Dit bespaart tijd en voorkomt handmatige fouten.

Hoe werkt het?

Wanneer je code naar je GitHub repository pusht, start GitHub Actions automatisch een workflow. Deze workflow bouwt je website en synchroniseert de bestanden via rsync naar je webruimte bij Oni. Hiervoor is een SSH-verbinding tussen GitHub en Oni nodig.

Stap 1: SSH toegang bij Oni activeren

Genereer een nieuw SSH keypair op je computer bedoelt voor de koppeling tussen GitHub en Oni.

$ ssh-keygen -C "your_email@example.com"

De public key hiervan moet eerst bij Oni.nl aan je domein worden toegevoegd:

1. Log in op Mijn account
2. Ga naar Domeinen > jouwdomein.nl > Toegang
3. Scroll naar SSH toegang en druk op de Public key toevoegen knop
4. Plak de public key (inhoud van id_rsa.pub of id_ed25519.pub) in het SSH key veld
5. Klik op Opslaan

Een public key ziet er ongeveer zo uit:

ssh-ed25519 AAAAC3NzaC1lZDI1NTE5AAAAIOL4kcyys4BIV4PATuI112YQ3nrirQt+6N0kWDaTMiQu your_email@example.com

Stap 2: Deploy key toevoegen aan GitHub

De private key moet veilig worden opgeslagen in GitHub:

1. Open je repository op GitHub
2. Ga naar Settings > Secrets and variables > Actions
3. Klik op New repository secret
4. Gebruik als naam: DEPLOY_KEY
5. Plak de volledige inhoud van je private key (id_rsa of id_ed25519)
6. Klik op Add secret

Een private key ziet er ongeveer zo uit:

-----BEGIN OPENSSH PRIVATE KEY-----
b3BlbnNzaC1rZXktdjEAAAAABG5vbmUAAAAEbm9uZQAAAAAAAAABAAAAMwAAAAtzc2gtZW
QyNTUxOQAAACDi+JHMsrOASFeDwE7iNddmEN564q0LfujdJFg2kzIkLgAAAKBawbrWWsG6
1gAAAAtzc2gtZWQyNTUxOQAAACDi+JHMsrOASFeDwE7iNddmEN564q0LfujdJFg2kzIkLg
AAAEAjKwVdGuQxUZkdVZOoK0KhqBcjJ/su9jpsWXHxIV5lR+L4kcyys4BIV4PATuI112YQ
3nrirQt+6N0kWDaTMiQuAAAAFnlvdXJfZW1haWxAZXhhbXBsZS5jb20BAgMEBQYH
-----END OPENSSH PRIVATE KEY-----

Om te testen of de SSH sleutel werkt, kun je volgende commando uitvoeren in een terminal:

$ ssh -i ~/.ssh/id_rsa jouwdomeinnl234@ssh.oni.nl

Stap 3: GitHub Actions workflow aanmaken

Maak in je repository een bestand aan: .github/workflows/deploy.yml

name: Deploy naar Oni

on:
  push:
    branches:
      - 'main'
  workflow_dispatch:

jobs:
  deploy:
    runs-on: ubuntu-latest
    steps:
      - uses: actions/checkout@v4

      # optioneel: voeg hier extra stappen toe die je website bouwt ...

      - name: Deploy via rsync
        uses: Burnett01/rsync-deployments@4.1
        with:
          switches: -avzr --delete
          path: dist/
          remote_path: ~/DOMAIN/HTML/
          remote_host: ssh.oni.nl
          remote_user: jouwdomeinnl234
          remote_key: ${{ secrets.DEPLOY_KEY }}

Pas de volgende waarden aan naar jouw situatie:

• path - De map in de repository waar de gebouwde website in staat
• remote_path - De remote map waar de bestanden geplaatst dienen te worden
• remote_user - De SSH/SFTP gebruikersnaam van jouw account

Let op: de --delete switch verwijdert bestanden op de server die niet (meer) in je repository staan. Verwijder deze switch als je dat niet wilt.

Stap 4: Deployment testen

Commit en push de workflow naar GitHub:

$ git add .github/workflows/deploy.yml
$ git commit -m "GitHub Actions deployment toegevoegd"
$ git push

De deployment start automatisch. Volg de voortgang via Actions tabblad in je GitHub repository. Na enkele minuten is je website bijgewerkt op je Oni.nl webruimte.

Je kunt een deployment ook handmatig starten via de Actions tab in GitHub door op Run workflow te klikken.