Automatyzacja procesów developerskich to kluczowy element sukcesu projektów IT. Jednym z najpotężniejszych narzędzi w tym obszarze jest GitHub Actions. Dzięki niemu możesz kodowo sterować budowaniem, testowaniem i wdrażaniem swoich aplikacji.

Ale czym tak naprawdę jest GitHub Actions, jak może pomóc Twojemu projektowi, a nawet... poprawić SEO?

Czym jest GitHub Actions?

GitHub Actions to natywne narzędzie GitHuba umożliwiające automatyzację dowolnego procesu, który zaczyna się od konkretnego zdarzenia w repozytorium. Najczęściej są to:

• Push kodu
• Otworzenie pull requesta
• Stworzenie nowego issue
• Tagowanie wersji
• Inne akcje (np. ręczne wywołanie workflow)

Pozwala ono stworzyć workflows – czyli pliki .yml, które dokładnie definiują, co ma się dziać po określonym zdarzeniu. Możesz:

• automatycznie budować aplikacje,
• przeprowadzać testy jednostkowe,
• publikować aplikację na serwerze lub w chmurze,
• generować dokumentację,
• wysyłać raporty na Slacka,
• aktualizować dane SEO (np. sitemap.xml, robots.txt) przy każdej publikacji!

To naprawdę ogromna moc zamknięta w prostych, przejrzystych konfiguracjach.

Dlaczego Github Actions może być dobrym sposobem na automatyzację procesów SEO?

Automatyzacja zadań związanych z SEO oznacza, że żaden ważny krok nie zostanie pominięty. Dzięki GitHub Actions można:

• Szybsza indeksacja nowych stron dzięki automatycznemu wysyłaniu prośby o indeksację przez Google Search Console.
• Lepsza wydajność stron dzięki kompresji i optymalizacji obrazów w każdym wdrożeniu – mniejszy czas ładowania to wyższy ranking w PageSpeed Insights.
• Ciągła weryfikacja testowanie czy strona na serwerze odpowiada.
• Spójne wdrożenia – build i deployment zawsze przechodzą przez te same kroki, co minimalizuje ryzyko pomyłek i nietrafionych commitów na produkcji.

Możemy również skorzystać z narzędzia Lighthouse CI dla Github Actions dzięki któremu wykonamy prosty Audyt SEO podczas procesu automatyzacji.

Przykład: Deploy statycznej strony z Next.js na FTP (ręczne wywołanie w GitHub Actions)

name: Deploy Next.js to FTP
 
on:
  workflow_dispatch:
 
jobs:
  build_and_deploy:
    runs-on: ubuntu-latest
    steps:
      - name: Checkout repo
        uses: actions/checkout@v4
 
      - name: Setup Node.js
        uses: actions/setup-node@v3
        with:
          node-version: 18
 
      - name: Install dependencies
        run: npm ci
 
      - name: Replace next.config.mjs
        run: cp _next-static-html.config.mjs next.config.mjs
 
      - name: Build project
        run: npm run build
 
      - name: Deploy to FTP
        uses: samkirkland/ftp-deploy-action@v4.0.0
        with:
          server: ${{ secrets.FTP_HOST }}
          username: ${{ secrets.FTP_USERNAME }}
          password: ${{ secrets.FTP_PASSWORD }}
          protocol: ftp
          local-dir: ./out/
          server-dir: /example-domain/public_html/
          exclude: |
            .git
            .github
            .gitignore
        env:
          FTP_DEPLOY_TIMEOUT: 99900000

Powyższy workflow zakłada, że w Twoim projekcie Next.js wykorzystujesz w next.config.mjs właściwość:

// next.config.mjs
export default {
  output: 'export',
  // ...inne opcje
}

Dzięki output: 'export' Next.js generuje w pełni statyczne strony HTML w katalogu out/. Taki serwis:

• Ładuje się błyskawicznie – brak konieczności uruchamiania Node.js przy każdym żądaniu.
• Ma świetne wyniki w PageSpeed Insights – mniejsze pliki, szybsze czasy odpowiedzi.
• Jest przyjazny dla botów wyszukiwarek – treść jest od razu dostępna w HTML, bez konieczności wykonywania JavaScriptu.

Następnie wystarczy ręcznie wywołać workflow w zakładce Actions → Deploy Next.js to FTP na GitHubie, aby:

1. Zbudować projekt (npm run build).
2. Wyeksportować statyczne pliki do out/.
3. Przesłać je na Twój serwer FTP, dzięki czemu nowa wersja strony od razu pojawi się w public_html.

Cały proces sprowadza się do jednego kliknięcia — i gotowe: Twoja strona jest online, szybka i w pełni zoptymalizowana pod SEO!

Wszystkie dane wrażliwe - czyli w naszym wypadku dane do serwera FTP (FTP_HOST, FTP_USERNAME, FTP_PASSWORD) przechowujemy w GitHub Secrets

Masz pytania odnośnie GitHub Actions, Next.js lub SEO? Napisz do nas — chętnie pomożemy wdrożyć najlepsze praktyki! 🚀