Sesiunea 2 - Antigravity si Deployment pe Hetzner

Pasul 1

Prezentarea Antigravity in contextul vibe coding

Antigravity este un framework care iti permite sa construiesti aplicatii web rapid, perfect integrat cu fluxul de vibe coding. In loc sa scrii manual fiecare linie, combini puterea AI-ului cu structura clara a unui framework.

Ce este Vibe Coding?

Vibe coding inseamna sa descrii ce vrei in limbaj natural, iar AI-ul genereaza codul. Tu te concentrezi pe ce vrei sa faci, nu pe cum sa il implementezi.

Descrii functionalitatea in cuvinte simple
AI-ul genereaza codul (Claude Code, Cursor, etc.)
Tu verifici, ajustezi si iterezi

Cum se integreaza Antigravity?

Structura clara - folderele si fisierele sunt organizate logic
Conventii predictibile - AI-ul stie unde sa puna fiecare component
Deployment simplu - de la local la productie cu comenzi minime

Tip

Antigravity si Claude Code formeaza o echipa puternica: Claude stie structura framework-ului si genereaza cod care se potriveste perfect.

Pasul 2

Lucru in folder local

Organizarea eficienta a folderelor si structura proiectului pentru integrarea armonioasa cu AI.

Structura proiectului

mynest/
├── public/
│   ├── index.html
│   ├── css/
│   └── js/
├── src/
│   ├── components/
│   └── pages/
├── config/
└── README.md

Reguli de lucru in folder

Un proiect = un folder - nu amesteca proiecte diferite
Fisiere mici si focusate - fiecare fisier face un singur lucru
Naming consistent - kebab-case pentru fisiere, CamelCase pentru componente
Documentatia in folder - Draft-ul si notitele stau langa cod

Comenzi utile in terminal

# Navigare
cd Documents/proiecte/mynest

# Vezi ce fisiere ai
ls -la

# Creaza structura de foldere
mkdir -p src/components src/pages public/css public/js config

# Deschide in editor
code .

Tip

Cand lucrezi cu Claude Code, acesta vede tot ce e in folderul curent. Tine folderul curat si organizat.

Pasul 3

Upload cheie SSH pe Hetzner

Inainte de a crea masina virtuala pe Hetzner, trebuie sa avem cheia SSH pregatita. Aceasta ne permite sa ne conectam la server fara parola, in mod securizat.

Ce este o cheie SSH?

SSH foloseste o pereche de chei: una privata (ramane pe calculatorul tau) si una publica (o pui pe server). E ca o incuietoare si o cheie - serverul are incuietoarea, tu ai cheia.

Genereaza cheia SSH

# Genereaza o pereche de chei (apasa Enter la toate intrebarile) ssh-keygen -t ed25519 -C "[email protected]" # Cheia se salveaza in: # ~/.ssh/id_ed25519 (privata - NU o distribui!) # ~/.ssh/id_ed25519.pub (publica - o pui pe server)

Copiaza cheia publica

# Pe macOS
cat ~/.ssh/id_ed25519.pub | pbcopy

# Pe Linux
cat ~/.ssh/id_ed25519.pub | xclip -selection clipboard

# Sau pur si simplu afiseaz-o si copiaz-o manual
cat ~/.ssh/id_ed25519.pub

Adauga cheia pe Hetzner

Logheaza-te pe console.hetzner.cloud
Mergi la Security → SSH Keys
Click Add SSH Key
Lipeste cheia publica
Da-i un nume descriptiv (ex: "Laptop-Virgil")

Important

Adauga cheia SSH inainte de a crea masina virtuala. La crearea serverului, selectezi cheia existenta si vei putea accesa serverul imediat, fara parola.

Pasul 4

Deployment direct cu SSH pe Hetzner

Acum ca avem cheia SSH configurata si masina creata, putem face deployment - adica sa urcam aplicatia de pe calculatorul nostru pe server.

Crearea serverului pe Hetzner

Click Add Server in Hetzner Cloud Console
Alege locatia (Falkenstein/Nuremberg pentru Europa)
Alege imaginea: Ubuntu 22.04
Alege tipul: CX22 (2 vCPU, 4GB RAM - suficient)
La SSH Keys, selecteaza cheia ta
Click Create & Buy Now

Prima conectare

# Conecteaza-te la server (inlocuieste cu IP-ul tau) ssh [email protected] # Prima data, confirma fingerprint-ul cu "yes"

Pregatirea serverului

# Actualizeaza sistemul
apt update && apt upgrade -y

# Instaleaza Node.js
curl -fsSL https://deb.nodesource.com/setup_20.x | bash -
apt install -y nodejs

# Instaleaza nginx (reverse proxy)
apt install -y nginx

# Verifica instalarea
node --version
nginx -v

Deployment cu SCP/rsync

# De pe calculatorul local, copiaza proiectul pe server scp -r ./mynest [email protected]:/var/www/ # Sau cu rsync (mai eficient, copiaza doar diferentele) rsync -avz --delete ./mynest/ [email protected]:/var/www/mynest/

Configurare Nginx

# Pe server, creeaza config nginx
nano /etc/nginx/sites-available/mynest

# Continut minimal:
server {
    listen 80;
    server_name mynest.domeniu.com;
    root /var/www/mynest/public;
    index index.html;

    location / {
        try_files $uri $uri/ =404;
    }
}

# Activeaza site-ul
ln -s /etc/nginx/sites-available/mynest /etc/nginx/sites-enabled/
nginx -t
systemctl reload nginx

Tip

Dupa primul deployment, poti folosi rsync pentru update-uri rapide. Copiaza doar fisierele modificate, deci e mult mai rapid decat scp.

Flux complet

Local: editezi codul → testezi → rsync catre server → aplicatia e live. In sesiunile urmatoare vom automatiza acest proces cu CI/CD.