Φιλοξενία του Next.js στον δικό σας server με deploy σε κάθε git push

Ο σύντομος τρόπος να φιλοξενήσετε το Next.js στον δικό σας server είναι να εγκαταστήσετε ένα πάνελ deploy όπως το Coolify και να συνδέσετε το repository σας στο GitHub. Μετά, κάθε git push χτίζει την εφαρμογή και βγάζει τη νέα έκδοση στον αέρα μέσω HTTPS. Σύμφωνα με την τεκμηρίωση του Next.js, όλα τα χαρακτηριστικά λειτουργούν όταν κάνετε deploy με server Node.js ή container Docker, άρα δεν είστε δεμένοι σε κάποια ειδική πλατφόρμα.

Ποια χαρακτηριστικά δουλεύουν στον δικό σας server;

Ο πίνακας στην επίσημη τεκμηρίωση είναι σύντομος: ένας server Node.js και το Docker υποστηρίζουν κάθε χαρακτηριστικό, ενώ το στατικό export είναι περιορισμένο. Σε έναν μόνο server, αυτό σημαίνει στην πράξη:

• Τα server components, οι διαδρομές API και οι απαντήσεις streaming δουλεύουν με το next start.
• Το next/image δεν χρειάζεται επιπλέον ρύθμιση και οι εικόνες επεξεργάζονται στον server.
• Το caching και η αυξητική στατική αναγέννηση (ISR) δουλεύουν μόνα τους σε έναν server με μόνιμο δίσκο. Αν τρέχετε πολλά αντίγραφα, πρέπει να μοιράσετε την cache μεταξύ τους.
• Η επίσημη σύσταση είναι να βάζετε μπροστά ένα reverse proxy αντί να εκθέτετε απευθείας το Next.js. Το Coolify έρχεται με Traefik για αυτό, και το Traefik φροντίζει και το πιστοποιητικό.

Πόσο ισχυρός πρέπει να είναι ο server;

Το build καθορίζει πόση μνήμη χρειάζεστε και όχι η εφαρμογή που τρέχει. Το next build έχει κορύφωση και η εφαρμογή χρειάζεται πολύ λιγότερα όταν ξεκινήσει. Και το ίδιο το Coolify χρησιμοποιεί μνήμη. Αυτές είναι οι τιμές που μετρήσαμε σε πραγματικούς servers:

Το μικρό έργο ήταν η εφαρμογή Next.js του παραδείγματος του Coolify. Το μεγαλύτερο ήταν μια εφαρμογή συνομιλίας AI γραμμένη με Next.js 16 και περίπου 85 πακέτα, και στα 2 GB έμεινε από μνήμη κατά τον έλεγχο TypeScript. Ο server είχε 2 GB swap και οι αριθμοί δείχνουν το υψηλότερο σημείο. Η χρήση δίσκου μετά το πρώτο build ήταν 13-18 GB. Πρόκειται για δικές μας μετρήσεις και το δικό σας έργο θα διαφέρει. Αν ένα build αποτύχει από έλλειψη μνήμης, αναβαθμίστε πρώτα και μειώστε αργότερα αν μπορείτε.

Βήμα προς βήμα

1. Συνδέστε το repository

Συνδεθείτε στο Coolify, ανοίξτε το έργο σας στη σελίδα Projects και πατήστε New resource. Για δημόσιο repository, επιλέξτε Public Git Repository, εισαγάγετε τη διεύθυνση και πατήστε Check repository.

2. Προσθέστε κλειδί αν το repository είναι ιδιωτικό

Στο αριστερό μενού, πηγαίνετε στο Private Keys κάτω από το Keys & Tokens και δημιουργήστε κλειδί με το Generate ED25519. Προσθέστε το δημόσιο κλειδί στα Deploy keys στη σελίδα Settings του repository στο GitHub. Μετά χρησιμοποιήστε το New resource, επιλέξτε Private Git Repository (with Deploy Key) και εισαγάγετε [email protected]:user/project.git. Αφήστε το Build pack στο Railpack, που αναγνωρίζει το Next.js, και η θύρα μένει στο 3000. Το Coolify σημειώνει το Railpack ως beta, οπότε επιλέξτε δικό σας Dockerfile αν σας δυσκολέψει.

3. Εισαγάγετε μεταβλητές περιβάλλοντος

Στη σελίδα Environment Variables, περάστε στην Developer view και επικολλήστε τα περιεχόμενα του αρχείου .env. Εδώ μετράει μία λεπτομέρεια: οι μεταβλητές με όνομα που αρχίζει από NEXT_PUBLIC_ γράφονται στον κώδικα κατά το build. Όταν αλλάξετε μία, πατήστε Redeploy: το πάνελ βλέπει ότι άλλαξε μια ρύθμιση build και χτίζει ξανά. Μη δώσετε ποτέ αυτό το πρόθεμα σε κλειδί που δεν πρέπει να βλέπει ο browser.

4. Συνδέστε το domain σας

Δημιουργήστε μια εγγραφή A στον πάροχο του domain σας που να δείχνει στη διεύθυνση IP του server. Στο Coolify, πηγαίνετε στη σελίδα Domains, πατήστε Add domain, επιλέξτε https ως πρωτόκολλο, εισαγάγετε το domain σας, αποθηκεύστε και κάντε ξανά deploy. Το πιστοποιητικό ζητείται και ανανεώνεται αυτόματα. Οι θύρες 80 και 443 πρέπει να είναι ανοιχτές.

5. Deploy

Πατήστε Deploy. Η σελίδα Deployments δείχνει ζωντανά το αρχείο καταγραφής του build. Όταν τελειώσει το build, το παλιό container συνεχίζει να εξυπηρετεί μέχρι να είναι έτοιμο το νέο.

Πώς γίνεται το git push deployment;

Σε κάθε push, το GitHub στέλνει στο πάνελ ένα υπογεγραμμένο αίτημα. Το πάνελ επαληθεύει την υπογραφή και ξαναχτίζει την εφαρμογή για εκείνο το branch, ενώ ένα αίτημα με κακή υπογραφή απορρίπτεται. Έτσι το ρυθμίζετε:

1. Στη σελίδα Webhooks της εφαρμογής, αντιγράψτε το Webhook URL από την ενότητα GitHub, καταχωρίστε μια τυχαία τιμή τουλάχιστον 16 χαρακτήρων στο Webhook secret και αποθηκεύστε.
2. Στο GitHub, ανοίξτε τα Settings του repository, πηγαίνετε στα Webhooks και πατήστε Add webhook.
3. Βάλτε τη διεύθυνση στο Payload URL και την ίδια τιμή στο Secret. Ορίστε το Content type σε application/json και αφήστε το push ως το μοναδικό συμβάν.

Για να το δοκιμάσετε:

git commit --allow-empty -m "deploy test"

git push

Το νέο build εμφανίζεται στη σελίδα Deployments. Στο μικρό παράδειγμα, ένα νέο commit βγήκε στον αέρα σε 41 δευτερόλεπτα χάρη στην cache του build. Το GitHub πρέπει να μπορεί να φτάσει τη διεύθυνση του πάνελ και, επειδή το πάνελ εγκαθίσταται με δημόσια διεύθυνση HTTPS, δεν χρειάζεται τίποτα επιπλέον.

Συνηθισμένα σφάλματα

Με την επιλογή Next.js στο Seturack, το Coolify έρχεται εγκατεστημένο: ο τοπικός server είναι επικυρωμένος, ο οδηγός καλωσορίσματος έχει παρακαμφθεί και το πάνελ ανοίγει μέσω HTTPS. Η διεύθυνση και ο κωδικός εμφανίζονται στο πάνελ σας και ξεκινάτε συνδέοντας το GitHub. Έχετε πρόσβαση root και μπορείτε να τα διαχειρίζεστε όλα από το πάνελ αν το προτιμάτε. Τα καθημερινά αντίγραφα ασφαλείας περιλαμβάνονται στην τιμή και η κίνηση δεδομένων είναι απεριόριστη. Ορίζετε το μέγεθος με sliders στη σελίδα Next.js VPS.

Έτοιμο στη Seturack: Next.js, Coolify.