Fă-ți portofoliul de fotograf prin vibe coding

01Cum se deosebește de un selector de șabloane

Galeriile de șabloane îți arată un design finalizat și te întreabă dacă îți place sau nu. Instrumentul ăsta merge cu un strat mai adânc: fiecare dintre cele șase direcții de mai jos se bazează pe un portofoliu real de fotograf, în funcțiune, care a fost inspectat efectiv (capturi de ecran, aspect live, culori calculate, fonturi calculate), nu pe o paletă inventată ca să arate bine într-o mostră. Direcția Editorial, de exemplu, folosește EB Garamond pentru că exact acesta este fontul în care e scris site-ul unui fotograf real de modă, potrivit prin inspectarea directă a paginii.

Două tipare au apărut aproape peste tot pe site-urile reale din care s-a pornit și sunt integrate în fiecare direcție de aici: navigarea ascunsă în spatele unei singure pictograme hamburger, fără listă vizibilă de linkuri, chiar și pe desktop, și o singură imagine mare pe rând, nu o grilă. Culoarea interfeței rămâne aproape de zero peste tot: culoarea o dă fotografia, nu interfața.

02Ce primești la final

Un singur prompt structurat care acoperă direcția generală, culorile hex exacte, numele și perechea de fonturi, lista de pagini, comportamentul navigării, aspectul galeriei și încadrarea imaginilor, funcțiile de inclus, o recomandare de găzduire cu compromisuri reale de cost și un set fix de cerințe de calitate (text alt accesibil, puncte de întrerupere responsive, fără secrete scrise direct în cod, imagini cu încărcare leneșă). Lipește-l în aplicația AI de programare pe care o preferi și are tot ce îi trebuie ca să înceapă.

03De la prompt la un site live: tot parcursul

Promptul este tema de design, nu linia de sosire. Iată fiecare pas dintre copierea lui și un URL real pe care îl poți pune pe o carte de vizită, gratuit sau aproape.

Copiază promptul și deschide o aplicație AI de programare

Merg Claude, Cursor, Claude Code, Windsurf sau agentul AI din Replit, orice poate scrie și salva fișiere pentru tine, nu doar să converseze. Dacă nu ai folosit niciodată una, o variantă din browser, precum claude.ai sau Replit, nu cere nicio instalare: lipește promptul ca prim mesaj.

Lasă-l să construiască, apoi uită-te cu adevărat la ce a făcut

Cere-i să construiască site-ul ca HTML/CSS/JS static (sau orice a specificat secțiunea de găzduire din prompt) și să-ți arate o previzualizare. Verifică cele șase lucruri cerute de prompt (culori, fonturi, comportamentul galeriei, navigare, încadrare, pagini) înainte să mergi mai departe. E mult mai ieftin să repari acum o culoare de accent greșită decât după ce sunt integrate pozele.

Pune pozele tale reale, biografia și datele de contact

Înlocuiește fiecare imagine provizorie și fiecare rând de text de umplutură. Cere-i aplicației AI să scrie un atribut alt real și specific pentru fiecare poză pe parcurs, nu „image1.jpg”, ci o descriere adevărată, pentru că e atât o cerință de accesibilitate, cât și un mic avantaj SEO. Acesta e și momentul să verifici dacă formularul de contact trimite într-adevăr la o adresă de e-mail pe care o citești.

Publică-l pe o găzduire gratuită

Dacă ai ales nivelul „Static & gratuit”, cere-i aplicației AI să te ghideze în conectarea folderului proiectului sau a depozitului GitHub la una dintre găzduirile din pagina Găzduire din meniul de mai sus. Toate patru construiesc și publică automat de fiecare dată când trimiți o modificare; fără încărcare manuală după ce sunt conectate.

Conectează un domeniu propriu (opțional, dar merită)

Un subdomeniu gratuit (cum ar fi yourname.netlify.app) merge bine la început. Când ești gata pentru yourname.com, înseamnă cumpărarea unui domeniu plus o singură modificare DNS, explicate în detaliu mai jos.

04Ce găzduire gratuită ar trebui să folosești?

Oricare dintre ele îți pune un site static online fără niciun cost, cu HTTPS gratuit și un nivel gratuit care acoperă ușor traficul unui portofoliu personal. Limitele nivelurilor gratuite se schimbă destul de des, așa că tratează cifrele din pagina Găzduire ca pe o formă generală, nu ca pe valori exacte actuale, și verifică pagina de prețuri a fiecărui furnizor înainte să te hotărăști.

Cere-i aplicației tale AI de programare să facă împreună cu tine pașii efectivi de publicare: „conectează acest proiect la Netlify” este un lucru cât se poate de normal de cerut, iar de obicei te poate ghida prin crearea contului și prima publicare în câteva minute.

05Conectarea unui domeniu propriu

Un domeniu costă o taxă anuală mică (de obicei $10 până la 20 pe an, în funcție de extensie), separată de găzduire, care rămâne gratuită. Cele trei piese:

1. Cumpără domeniul. Namecheap, Cloudflare Registrar sau succesorul Google Domains (Squarespace Domains).
2. Adaugă o înregistrare DNS. Un CNAME (sau o înregistrare A) care îndreaptă domeniul tău spre găzduire, adăugat în panoul registrarului. Sunt două rânduri în tabelul registrarului: un CNAME pentru www care indică adresa pe care ți-o dă găzduirea, de exemplu your-portfolio.netlify.app, și o înregistrare A pentru domeniul simplu, care indică IP-ul găzduirii.
3. Adaugă-l în găzduire. Lipește același domeniu în setările „domeniu propriu” ale găzduirii; HTTPS se configurează singur.

Fiecare găzduire din pagina Găzduire are o secțiune „Domeniu propriu” sau „Domenii” care îți dă înregistrarea exactă de adăugat: copiază-o, adaugă-o la registrar și așteaptă. Modificările DNS durează de obicei de la câteva minute la câteva ore, ocazional până la 24 sau 48 de ore. Aplicația ta AI de programare te poate ghida prin panoul registrarului tău, dacă te blochezi; fă o captură de ecran a paginii de setări și întreab-o pe ce să dai clic. Lacăt afișat, fără avertisment „nesigur”: asta e linia de sosire.

06Listă de verificare înainte de lansare

Cinci minute cu lista asta prind cea mai mare parte din ce face un portofoliu să pară neterminat. Verificările sunt în pagina Înainte de lansare din meniul de mai sus; bifează-le pe parcurs.

07Întrebări frecvente