Φτιάξε προσωπικό website με το όνομά σου, χωρίς να ξέρεις κώδικα

Τι θα χρειαστείς

Βήμα 1: Αγόρασε domain με το όνομά σου στο papaki

1. Άνοιξε το papaki.gr και στο πεδίο αναζήτησης γράψε το όνομά σου χωρίς κενά και τόνους, π.χ. giannispapadopoulos. Δοκίμασε .gr πρώτα· αν είναι πιασμένο, δες .com, .eu ή έναν συνδυασμό όπως giannis-papadopoulos.gr.
2. Πρόσθεσε το domain στο καλάθι και μην προσθέσεις hosting, site builder ή email πακέτο. Το site θα φιλοξενηθεί δωρεάν στο GitHub. Χρειάζεσαι μόνο το domain. Σημείωση: τα .gr καταχωρούνται για τουλάχιστον 2 χρόνια, οπότε η τιμή που βλέπεις είναι διετής.
3. Φτιάξε λογαριασμό papaki με τα πραγματικά σου στοιχεία (ο κάτοχος του domain πρέπει να είσαι εσύ) και ολοκλήρωσε την πληρωμή. Το domain ενεργοποιείται σε λίγα λεπτά. Θα το χρειαστείς ξανά στο βήμα 7.

Βήμα 2: Κατέβασε και εγκατέστησε το VS Code

1. Πήγαινε στο code.visualstudio.com/download και πάτησε το κουμπί για το σύστημά σου: Windows (User Installer, 64 bit) ή Mac (Apple Silicon για νέα Mac, Intel για παλιότερα).
2. Windows: τρέξε το αρχείο που κατέβηκε, δέξου την άδεια και άφησε τις προεπιλογές. Στην οθόνη «Select Additional Tasks» τσέκαρε Add to PATH και Add "Open with Code" action. Πάτησε Install και μετά Finish.
3. Mac: άνοιξε το .zip, σύρε το Visual Studio Code στον φάκελο Applications και άνοιξέ το από εκεί.
4. Άνοιξε το VS Code. Στην αριστερή στήλη θα δεις εικονίδια: Explorer (αρχεία), Search, Source Control (Git) και Extensions (τέσσερα τετραγωνάκια). Αυτό το τελευταίο το χρειάζεσαι αμέσως μετά.

Βήμα 3: Εγκατέστησε το AI extension (ChatGPT ή Claude)

1. Πάτησε το εικονίδιο Extensions στην αριστερή στήλη ή Ctrl+Shift+X (Mac: Cmd+Shift+X).
2. Αν χρησιμοποιείς ChatGPT: γράψε Codex στην αναζήτηση και εγκατέστησε το Codex – OpenAI’s coding agent από την OpenAI. Μετά την εγκατάσταση εμφανίζεται νέο εικονίδιο στην αριστερή στήλη· πάτησέ το και κάνε Sign in with ChatGPT με τον λογαριασμό σου.
3. Αν χρησιμοποιείς Claude: γράψε Claude Code και εγκατέστησε το Claude Code από την Anthropic. Πάτησε το εικονίδιό του και συνδέσου με τον λογαριασμό Claude σου (χρειάζεται συνδρομή Pro ή Max, ή API credits).
4. Και στα δύο, ο διαθέσιμος όγκος χρήσης εξαρτάται από το πλάνο σου. Για ένα προσωπικό site μιας σελίδας φτάνει άνετα ακόμα και το μικρότερο πλάνο.

Βήμα 4: Πες στο AI να φτιάξει τη σελίδα σου

1. Φτιάξε έναν κενό φάκελο στον υπολογιστή σου, π.χ. my-website. Στο VS Code πάτησε File → Open Folder και διάλεξέ τον. Αν ρωτήσει αν εμπιστεύεσαι τον φάκελο, πάτησε Yes, I trust the authors.
2. Άνοιξε το panel του AI (το εικονίδιο του Codex ή του Claude Code στην αριστερή στήλη). Βεβαιώσου ότι δουλεύει στον φάκελο που άνοιξες: θα το γράφει στο πάνω μέρος του panel.
3. Επικόλλησε το prompt που ακολουθεί, αφού συμπληρώσεις τα στοιχεία σου στις αγκύλες. Όσο πιο συγκεκριμένος είσαι στα «Ποιος είμαι» και «Στυλ», τόσο πιο δικό σου θα βγει το site.
4. Το AI θα δημιουργήσει τα αρχεία μέσα στον φάκελο. Αν ζητήσει άδεια για να γράψει αρχεία, δώσε την. Όταν τελειώσει, θα δεις στον Explorer ένα index.html.
5. Δες το αποτέλεσμα: κάνε δεξί κλικ στο index.html → Reveal in File Explorer (Mac: Reveal in Finder) και άνοιξέ το με διπλό κλικ στον browser. Εναλλακτικά, εγκατέστησε το extension Live Server και πάτησε Go Live κάτω δεξιά για να βλέπεις ζωντανά κάθε αλλαγή.
6. Διόρθωσε με απλές οδηγίες στο ίδιο chat: «κάνε το φόντο πιο σκούρο», «βάλε τα projects πριν από την εμπειρία», «μεγάλωσε τη φωτογραφία», «γράψε το κείμενο του About πιο σύντομο». Επανέλαβε μέχρι να σε εκφράζει. Ζήτησέ του επίσης να ελέγξει πώς φαίνεται σε κινητό.
7. Αν θέλεις φωτογραφία, βάλε ένα αρχείο photo.jpg μέσα στον φάκελο και πες στο AI «χρησιμοποίησε το photo.jpg στην ενότητα About». Το ίδιο για το PDF του CV σου: cv.pdf στον φάκελο και «βάλε κουμπί λήψης του cv.pdf».

Βήμα 5: Ανέβασε το site σε GitHub repo

1. Αν δεν έχεις λογαριασμό, φτιάξε στο github.com/signup. Διάλεξε username που θα σε εκπροσωπεί επαγγελματικά, π.χ. gpapadopoulos. Αν έχεις ήδη, τα βήματα δημιουργίας repo τα είδες αναλυτικά και στο προηγούμενο βίντεο της σειράς (Μέρα 1).
2. Πάτησε το + πάνω δεξιά → New repository. Στο Repository name γράψε ακριβώς USERNAME.github.io (με το δικό σου username, π.χ. gpapadopoulos.github.io). Αυτό το συγκεκριμένο όνομα κάνει το GitHub να σερβίρει το site αυτόματα. Άφησέ το Public, μην τσεκάρεις τίποτα άλλο, πάτησε Create repository.
3. Ο ευκολότερος τρόπος για την πρώτη φορά: στη σελίδα του νέου repo πάτησε uploading an existing file, σύρε μέσα το index.html (και τα photo.jpg, cv.pdf αν τα έχεις), γράψε στο κάτω πεδίο «first version» και πάτησε Commit changes.
4. Ο πιο σωστός τρόπος, που θα χρησιμοποιείς και για κάθε επόμενη αλλαγή: στο VS Code πάτησε το εικονίδιο Source Control → Publish to GitHub → διάλεξε public repository και δώσε το όνομα USERNAME.github.io. Την πρώτη φορά θα σου ζητήσει να συνδεθείς με το GitHub μέσα από τον browser. Μετά, κάθε αλλαγή είναι: γράψε ένα μήνυμα → Commit → Sync Changes.
5. Επιβεβαίωσε ότι το index.html βρίσκεται στη ρίζα του repo, όχι μέσα σε υποφάκελο. Αν είναι μέσα σε φάκελο, το GitHub θα δείχνει κενή σελίδα ή το README.

Βήμα 6: Ενεργοποίησε το GitHub Pages

1. Στο repo πάτησε Settings (πάνω δεξιά στις καρτέλες) και στο αριστερό μενού Pages.
2. Στο Build and deployment → Source διάλεξε Deploy from a branch. Στο Branch διάλεξε main και φάκελο / (root). Πάτησε Save.
3. Περίμενε 1 με 2 λεπτά και κάνε ανανέωση στη σελίδα Pages. Θα δεις «Your site is live at https://USERNAME.github.io». Άνοιξέ το: το site σου είναι ήδη online, σε προσωρινή διεύθυνση.
4. Από εδώ και πέρα, κάθε Sync Changes από το VS Code ενημερώνει το live site μέσα σε περίπου ένα λεπτό. Αν δεν βλέπεις την αλλαγή, πάτησε Ctrl+F5 για να καθαρίσει η cache του browser.

Βήμα 7: Σύνδεσε το domain σου με το site

1. Στο GitHub, στην ίδια σελίδα Settings → Pages, στο πεδίο Custom domain γράψε το domain σου, π.χ. giannispapadopoulos.gr, και πάτησε Save. Το GitHub θα προσθέσει αυτόματα ένα αρχείο CNAME στο repo· μην το σβήσεις. Θα δείχνει προσωρινά «DNS check in progress» ή σφάλμα, μέχρι να ολοκληρώσεις τα επόμενα βήματα.
2. Στο papaki, μπες στον λογαριασμό σου → Τα Domain μου → πάτησε το domain → Διαχείριση DNS (DNS Records). Αν δεν βλέπεις την επιλογή, βεβαιώσου ότι το domain χρησιμοποιεί τους nameservers του papaki (είναι η προεπιλογή).
3. Πρόσθεσε 4 εγγραφές τύπου A για το γυμνό domain (Host: @ ή κενό), μία για κάθε διεύθυνση του GitHub Pages: 185.199.108.153, 185.199.109.153, 185.199.110.153, 185.199.111.153. Αν υπάρχει ήδη εγγραφή A στο @ που δείχνει σε parking page του papaki, διέγραψέ την.
4. Πρόσθεσε 1 εγγραφή τύπου CNAME με Host www και τιμή USERNAME.github.io (με τελεία στο τέλος αν το πεδίο το ζητά). Έτσι δουλεύει και το www.onomasou.gr. Αποθήκευσε.
5. Περίμενε. Οι αλλαγές DNS συνήθως περνούν σε 10 με 60 λεπτά, σπάνια μέχρι 24 ώρες. Επέστρεψε στο GitHub → Settings → Pages και πάτησε Check again μέχρι να γίνει πράσινο το «DNS check successful».
6. Μόλις γίνει πράσινο, τσέκαρε το Enforce HTTPS. Το GitHub εκδίδει δωρεάν πιστοποιητικό μέσα σε λίγα λεπτά. Άνοιξε το https://onomasou.gr από κινητό και υπολογιστή: αυτό είναι το site που θα βάλεις στο CV σου.
7. Προαιρετικό αλλά συνιστάται: στο GitHub Settings → Pages του προφίλ σου (Your profile → Settings → Pages) πάτησε Add a domain και πρόσθεσε την εγγραφή TXT που σου δίνει στο DNS του papaki. Έτσι κανείς άλλος δεν μπορεί να «κλέψει» το domain σου σε δικό του GitHub Pages.

Βήμα 8: Βάλ’ το στο CV και παντού

1. Στο CV σου, πάνω πάνω δίπλα στο email και το τηλέφωνο, γράψε καθαρά το domain: giannispapadopoulos.gr. Στο PDF κάνε το κλικαμπλ link. Το CV μένει ως έχει· το site είναι συμπληρωματικό και δείχνει ό,τι δεν χωράει σε μία σελίδα.
2. Πρόσθεσέ το στο LinkedIn (Contact info → Website), στο GitHub profile (Edit profile → Website), στο bio του Instagram/TikTok αν είναι επαγγελματικά, και στην υπογραφή του email σου.
3. Κράτα το ζωντανό: κάθε νέο project, σεμινάριο ή δουλειά μπαίνει στο site την ίδια μέρα, με ένα «Sync Changes». Ένα site που ενημερώνεται λέει περισσότερα από ένα PDF που ανανεώνεται μία φορά τον χρόνο.

Τι να βάλεις για να ξεχωρίσεις πραγματικά

Συχνά προβλήματα

Επίσημες πηγές