Tutorial Hosting Partea 2

Această parte tratează:

• construirea unui site
• utilitarele necesare

Construirea unui site

Site-ul este format din fișiere. Paginile pe care le vezi în browser sunt fișiere găzduite pe server, fiecare cu rolul ei:

• HTML descrie conținutul și structura paginii: titluri, paragrafe, liste, imagini, linkuri, formulare;
• CSS stabilește aspectul: culori, fonturi, așezarea în pagină și adaptarea la ecranele de telefon;
• JavaScript adaugă interactivitate în browser: meniuri, galerii de imagini, verificarea formularelor;
• PHP rulează pe server și generează pagini dinamice, de exemplu cu date citite dintr-o bază de date MySQL.

Cu HTML și CSS poți face un site de prezentare complet. JavaScript și PHP devin necesare când paginile trebuie să reacționeze la vizitator sau să afișeze conținut care se schimbă.

Diferența dintre scripturile client și server

Scripturile JavaScript sunt de tip client: se execută în browserul vizitatorului. Scripturile PHP sunt de tip server: se execută pe server, iar browserul primește doar rezultatul, adică HTML obișnuit. De aceea o pagină HTML se poate deschide direct de pe disc, cu dublu clic, în timp ce o pagină PHP are nevoie de un server care să o interpreteze; deschisă direct, ea apare ca text sau nu funcționează.

Lucrul local, pe propriul calculator

Pe vremea conexiunii dial-up, lucrul online era scump, așa că paginile se făceau offline și se publicau doar la final. Regula a rămas valabilă din alte motive: lucrezi mai repede, nu strici site-ul public în timp ce faci modificări și ai mereu o copie a fișierelor. Pașii obișnuiți sunt:

1. scrii paginile într-un editor de cod, de exemplu Visual Studio Code sau Notepad++;
2. le verifici în browser. Pentru paginile PHP folosești un server local: XAMPP sau Laragon (Apache, PHP și MySQL într-un singur pachet) sau serverul web inclus în PHP;
3. validezi codul cu validatoarele HTML și CSS și testezi pagina pe un ecran îngust, cu modul pentru dispozitive mobile din browser;
4. urci versiunea finală pe server cu un client FTP/SFTP sau din panoul de găzduire.

Serverul web inclus în PHP se pornește cu o singură comandă, din folderul site-ului, iar pagina se deschide apoi în browser la adresa http://localhost:8000:

php -S localhost:8000

Alte variante de a face un site

• Un sistem de administrare a conținutului (CMS), ca WordPress: îl instalezi pe găzduire, alegi o temă și adaugi pagini și articole dintr-o interfață web, fără să scrii cod. Este cea mai răspândită soluție pentru bloguri și site-uri de prezentare. Necesită actualizări regulate, pentru securitate.
• Constructoarele de site-uri (Wix, Squarespace și altele) oferă găzduire și editor vizual într-un singur abonament. Sunt simple, dar site-ul rămâne legat de platformă.
• Generatoarele de site-uri statice (Hugo, Eleventy, Jekyll) transformă texte scrise simplu în pagini HTML, care se pot găzdui gratuit.

Scrierea manuală a codului rămâne cea mai bună cale de a învăța și de a înțelege ce fac celelalte instrumente. Un exemplu pas cu pas găsești în realizarea unui site.

Sus

Utilitarele necesare

Pe lângă editorul de cod, un webdesigner folosește câteva programe pentru realizarea și verificarea paginilor și a imaginilor:

• un editor de cod cu evidențierea sintaxei și completare automată;
• browsere diferite (Chrome, Firefox, Safari) și instrumentele lor pentru dezvoltatori (tasta F12), cu care inspectezi codul, vezi erorile și simulezi ecrane de telefon;
• validatoarele HTML și CSS ale W3C;
• un program de grafică pentru imagini și un instrument de compresie (pentru formatele WebP și AVIF);
• un client FTP/SFTP pentru publicarea fișierelor.

Mai multe informații găsești în capitolul Utilitare.

Sus

Legendă

• HTML (HyperText Markup Language): limbajul în care se scrie conținutul paginilor web. Browserele îl interpretează și afișează rezultatul pe ecran.
• CSS (Cascading Style Sheets): limbajul care descrie aspectul paginilor.
• JavaScript: limbaj de programare executat în browser.
• PHP (PHP: Hypertext Preprocessor): limbaj executat pe server; browserul afișează doar rezultatul.
• CMS (Content Management System): aplicație care permite administrarea conținutului unui site dintr-o interfață web.
• Local: lucrul pe propriul calculator, cu fișierele de pe disc; online: lucrul direct pe serverul public.

Sus