Kendi VPS Sunucuma Next.js Uygulaması Kurulum Notlarım

Bir süredir hobi projemi Vercel'de host ediyordum. Başlangıçta gayet yeterliydi ama zamanla ücretsiz planın kısıtlamaları can sıkmaya başladı. En sonunda hesap suspend olunca "madem öyle" deyip kendi VPS sunucuma geçmeye karar verdim. Aşağıda bu süreci nasıl yönettiğimi adım adım kendi notlarım olarak paylaşıyorum. Bir rehberden çok, "ben böyle yaptım" yazısı gibi düşünebilirsiniz.

1. VPS Sunucusunu Ayarlama

İlk iş olarak uygun fiyatlı bir VPS kiraladım. Test amaçlı olduğu için çok güçlü bir şeye gerek duymadım. Kullandığım sunucu:

• 1 vCPU
• 1 GB RAM
• 40 GB SSD
• Ubuntu 22.04 LTS

Kendi alışkanlıklarıma göre Ubuntu'yu tercih ettim, siz başka bir şeyle de ilerleyebilirsiniz.

SSH ile bağlandım:

ssh root@your-server-ip

Sunucuyu güncellemek ve temel araçları kurmak için:

sudo apt update && sudo apt upgrade -y
sudo apt install -y build-essential curl git

Sonrasında Node.js'i kurdum. Şu an 20.x sürümünü kullandım:

curl -fsSL https://deb.nodesource.com/setup_20.x | sudo -E bash -
sudo apt install -y nodejs

Kurulum sonrası bir kontrol:

node -v
npm -v

2. Uygulamayı Sunucuya Taşımak

Projemi Github’a pushlamıştım. O yüzden direkt sunucuya klonladım:

git clone https://github.com/kendi-repon.git
cd proje-klasoru
npm install

Ortam değişkenleri için .env dosyasını oluşturup içerisine ihtiyacım olanları ekledim:

touch .env

Örnek:

NEXT_PUBLIC_API_URL=https://api.example.com
NEXT_PUBLIC_API_KEY=your_api_key

3. Uygulamayı Çalıştırmak

Uygulamayı çalıştırmak için klasik build/start:

npm run build
npm start

Sunucunun IP’sini tarayıcıda :3000 portuyla açarak kontrol ettim. Her şey yolundaysa sayfa geliyor.

4. Arka Planda Çalıştırmak (pm2)

Uygulamanın kapanmaması için pm2 kullandım:

sudo npm install -g pm2
pm2 start npm --name "my-next-app" -- start

Durum kontrolü için:

pm2 status

Yeniden başlatmak gerekirse:

pm2 restart my-next-app

5. Nginx ile Reverse Proxy

Tarayıcıda sürekli :3000 yazmak istemediğimden Nginx’i devreye aldım:

sudo apt install -y nginx

Varsayılan site dosyasını açtım:

sudo nano /etc/nginx/sites-available/default

Şu yapılandırmayı ekledim:

server {
    listen 80;
    server_name your-domain.com;

    location / {
        proxy_pass http://localhost:3000;
        proxy_http_version 1.1;
        proxy_set_header Upgrade $http_upgrade;
        proxy_set_header Connection 'upgrade';
        proxy_set_header Host $host;
        proxy_cache_bypass $http_upgrade;
    }
}

Yapılandırmayı test edip:

sudo nginx -t

Her şey yolundaysa:

sudo systemctl restart nginx

Artık uygulama alan adı üzerinden erişilebilir durumda.

6. SSL Sertifikası Kurulumu (Let's Encrypt)

HTTPS olmazsa olmaz. Let's Encrypt ile hallettim:

sudo apt install -y certbot python3-certbot-nginx
sudo certbot --nginx -d your-domain.com

Kurulumdan sonra:

sudo systemctl restart nginx

Tarayıcıdan https://your-domain.com üzerinden erişip kontrol ettim.

7. Github Actions ile Otomatik Deploy

Her seferinde SSH ile uğraşmamak için Github Actions setup’ı yaptım. .github/workflows/deploy.yml dosyasını oluşturdum:

name: Deploy to VPS

on:
  push:
    branches:
      - main

jobs:
  deploy:
    runs-on: ubuntu-latest

    steps:
      - name: Checkout repository
        uses: actions/checkout@v2

      - name: SSH into VPS and deploy
        uses: appleboy/ssh-action@v0.1.5
        with:
          host: ${{ secrets.VPS_HOST }}
          username: ${{ secrets.VPS_USER }}
          key: ${{ secrets.VPS_PRIVATE_KEY }}
          port: ${{ secrets.VPS_PORT }}
          script: |
            cd project-directory
            git pull origin main
            npm install
            npm run build
            pm2 restart my-next-app

Sunucu bilgilerini Github Secrets’a eklemeyi unutmayın (VPS_HOST, VPS_USER, VPS_PRIVATE_KEY, vs.)

Kapanış

Benim için bu süreç güzel bir deneyim oldu. Hem VPS yönetimiyle pratik kazandım hem de uygulamayı kendi kontrolümde bir ortamda çalıştırmak güzel hissettirdi. Bu yazı da tamamen kendi notlarım, umarım benzer bir şey yapmak isteyenlere faydası dokunur.