Cine abia începe să lucreze la modificări de teme de WordPress sau la proiecte de webdesign/webdevelopment își dă seama destul de repede că un punct pus aiurea în codul CSS sau în scriptul de Javascript strică toată treaba. În plus, nu ai chef să fii mereu atent la formatarea codului, ca acesta să placă și ochiului.
Așadar, mai jos sunt recomandările de „linters”, site-uri ce fac verificarea sintaxei, și „beautifiers”, site-uri care formatează codul în mod automat.
CSS: verificare și formatare
Codurile CSS pot deveni groaznic de stufoase în doi timpi și trei mișcări. Dincolo de faptul că sunt anumite reguli de folosire a identificatorilor și de specificitate (și aici), plus trucuri CSS3 pentru generarea de imagini, ai nevoie de o sintaxă corectă și de un cod frumos așezat.
Pentru verificarea corectitudinii sintaxei folosesc CSS Lint. Copy & paste codul în căsuța din acel website și îți specifică erorile și avertismentele legate de acel cod. Îți va rezolva o mulțime de probleme pe viitor. Sunt cazuri în care nu ai închis o acoladă la început de fișier iar tot .CSS-ul respectiv nu este rulat.
La fel, pentru formarea automată folosesc CSS Beautifier. Copy & paste codul CSS și apoi îl pui gata aranjat în website-ul tău. Simplu.
Javascript: verificare și formatare
În primul rând se potrivește aici linkul către convențiile de cod pentru Javascript. În al doilea rând, troubleshooting-ul codurilor de Javascript poate fi destul de dificil dacă ai multe fișiere .js iar unele dintre ele sunt și minified.
Cu ce verifici sintaxa codurilor de Javascript? Cu JS Lint. Copiezi codul acolo, dai să verifice și apoi afli unde sunt problemele.
Cu ce formatezi codul să placă tuturora, mai ales ție când vrei să îl recitești și să înțelegi ceva din el? Cu JS Beautifier, desigur. JS Beautifier te ajută și cu fișierele minified. Deși acelea vor avea variabilele mascate în litere, pentru că și de asta se ocupă acțiunea de minify, folosind un beautifier te va ajuta să înțelegi, cât de cât, ce vrea să zică codul.
Gata, acum la lucru cu tine.
Ce tool-uri pentru CSS/Javascript mai recomanzi?