Ok, văd pe o grămadă de forumuri această întrebare. Mai nou, sunt întrebat de tot mai multe persoane pe messenger cum am învătat eu CSS/HTML/Javascript. Şi hai să le răspund tuturor, să fie toată lumea fericită. Este un post generalist, fiind valabil pentru ORICE platformă sau limbaj de programare.

În primul şi în primul rând, eu nu ştiu javascript. Da, sună ciudat, dar ăsta este adevărul crunt. Eu ştiu să folosesc jQuery şi cam atât. Dacă îl dau pe ăla la o parte… Sunt terminat. În schimb, îmi place să cred că ştiu HTML & CSS la un nivel mulţumitor, atât pentru mine cât şi pentru cei cu care lucrez.

În al doilea rând, trebuie să-ţi PLACĂ asta. Un exemplu clasic de „aşa nu” este cam pe orice forum mai mare şi începe cu :

Sal. Am 14 ani shi vreau sa invat programare. Pana akum stateam si ma jukam toata ziua CS dar mam plictisit si am zis sa fac un site mijto pentru clan. pute-ti sa ma ajutati? thx. pupici

(greşeli intenţionate, să nu se înţeleagă greşit)

În al treilea rând trebuie să cunoşti bine limba maternă (în cazul nostru româna) şi limba engleză. Din două motive:

1. Cât timp nu ştii să vorbeşti şi să scrii corect româneşte, nu poţi învăţa o altă limbă. E ceva logic şi de bun simţ
2. Cam tot ce ţine de programare este legat în mod direct de limba engleză. Că este documentaţie sau că este limbajul în sine, NU poţi face nimic dacă nu ştii engleză la un nivel acceptabil.

Programarea NU se invaţă din cărţi¹. Şi nici din tutoriale video (există tutoriale video de css, php, javascript, ruby, c#, etc). La unele am încercat să mă uit. Unele din curiozitate, altele dintr-o voinţă ciudată de genul „vreau să învăţ Ruby” şi de fiecare dată am tras această concluzie: nu se învaţă din cărţi! Este la fel ca sex-ul: poţi să memorezi toate imaginile din kamasutra, poţi să citeşti toate Playboy & Hustler, dar până nu treci la treabă, pe material real, nu ai de unde să ştii cum e

Majoritatea programatorilor pe care îi cunosc au învăţat programare cu diverse resurse online (articole/tutoriale scurte, nu întinse pe sute de pagini din care nu înveţi nimic) şi, cel mai important cu un proiect REAL. Eu m-am trezit peste noapte că trebuie să fac pentru un client front-end-ul ditamai aplicaţiei web. Am început cu prototype/scriptaculous dar, deoarece mi s-a părut prea încurcat şi nu găseam scripturile necesare, am trecut la jQuery.

Dacă nu ai un proiect real, îţi propui unul sau cauţi ceva gata făcut şi te apuci să-l modifici. Eu am învătat HTML salvând pagina de la Yahoo! şi apucându-mă să o editez. Desigur, asta se întâmpla prin 97-98 când abia descoperisem că există şi sisteme de calcul mai performante decât un HC Vrei idei de proiecte? Caută un program (fie executabil, fie site) de complexitate simplă spre medie şi încearcă să-l refaci de la zero. Ai reuşit? Caută ceva mai complex.

Nu te satisface metoda asta? Aruncă un ochi pe Rentacoder.com (nu uita să-ţi faci cont în prealabil) şi caută proiecte. Nu contează cu cât sunt plătite! Eşti acolo să înveţi, banii îi laşi pe mai târziu. După ce găseşti un proiect provocator te apuci să-l faci. Nu contează că nu vei face nimic cu respectivul proiect.

Vrei să te apuci de programare web? Fă un CMS! Oh, nu, iar un CMS? E plin internetul de ele. O fi, dar câte sunt făcute de tine? Pentru a face un CMS de la zero ai nevoie de cunoştinţe de tot ce ţine de web: programare server side şi client side, poate un pic design, SEO, usability. Îţi pune la muncă toate simţurile legate de web development

Dacă ai avut tangenţe cu programarea până acum, deja poţi sări de bazele oricărui limbaj (în special web) pentru că tipurile de date sunt aproximativ la fel (boolean, integer, array, etc), singurul lucru pe care trebuie să te axezi este sintaxa. Apoi, cu manualul la îndemână poţi face orice. ORICE!

Ok, ai învăţat bazele. Care este următorul pas? FII LA CURENT cu TOT ce mişcă pe web despre acel limbaj de programare. Fii la curent cu noutăţile! Foloseşte un feed reader şi nu rata nimic. Eu am peste 20 site-uri în feed reader despre javascript. Încă vreo 10 despre wordpress şi vreo 15-20 despre html/css.

Cunosc pe cineva care a învăţat programare (web) după un tutorial video. Deşi are zeci de site-uri la activ (şi asta fără să exagerez!) nivelul la care este nu îl depăşeşte cu mult pe cel al unui începător. De ce? Pentru că merge! E corect? Nu neapărat… Citeam mai demult pe un site despre filozofia indienilor: „If it Compiles, Ship it”. Care este legătura? Ghici…

_____________________________________________

¹Programarea nu se învaţă din cărţi. În schimb, te perfecţionezi citind cărţi. Cunosc un programator care, deşi lucrează în domeniu de cel puţin 4-5 ani, a rămas fix la acelaşi nivel ca atunci. Iar asta nu este ceva neapărat bun…

Aseară, într-o criză datorată lipsei unui script care să facă ce vreau eu şi să fie şi mic (în KB), m-am apucat şi am scris un mini-plugin (care de fapt este o funcţie) pentru afişarea unui modal box. Pentru ce e bun? Păi… Eu l-am folosit pentru afişarea unui editor, tu îl poţi folosi pentru orice altceva

Îi poţi specifica lătimea, are callback, poate afişa conţinut citit prin AJAX şi… Da, e MIC al dracu. 40 linii de cod L-am testat în IE6/IE7/FF2/FF3/Opera 9.5/Safari. Dar foarte probabil să funcţioneze fără probleme şi în alte browsere.

Mai multe detalii AICI. Enjoy!

Se putea să nu scriu şi eu despre sfârşitul iminent al galaxiei?

Cât despre experimentul experimentelor… Wtf?! Nu are rost să scriu şi eu chestii scrise şi rescrise de alţii. Dacă ceva o să meargă rău, nu cred că o să ne mai pese…

Anyway, lumea MEA este în pericol destul de mare, deoarece tabloul de siguranţe, din două variante (să meargă sau să nu meargă) a ales-o pe cea de-a doua. Dar nu oricum, ci cu proteste, aka scântei & craps. Am desfăcut capacul contorului iar un fir destul de gros are izolaţia scrum. Problema însă este că firul vine DIN contor, ceea ce înseamnă că va trebui să-i chem pe băieţii de la Electrica să repare/schimbe trebuşoare pe acolo. Well… Aşa e în tenis Oricum, livin’ on the edge şi stau aşa până nu mai merge (sau până o să lumineze contorul).

Pronosticuri, ceva?

Probabil s-a întâmplat să ai instalat şi firefox (setat ca default browser) şi internet explorer (cum altfel, doar e „uindous”) dar de fiecare dată când foloseşti vreun soft în genul Outlook, Yahoo! Messenger, etc, toate link-urile să ţi le deschidă în Idiot Internet Explorer ?

De ce se întâmplă aşa? Habar n-am. Şi nici nu prea îmi pasă. Ştiu doar că o dată setat, ţine minte. Nu cum se întâmplă cu folder views Oricum, atât în Vista cât şi în XP, în meniul Start este un link spre Default programs (vista) sau Set program Access and Defaults (XP). Dacă nu este acolo, îl găsiţi în Control Panel la Add & Remove Software (XP) sau Default Programs -> Set program Access and Defaults (Vista).

De aici, treaba e simplă: Click pe bifa custom şi alege de acolo browser-ul care îl foloseşti în mod curent:

Apeşi OK şi… That’s all

Nimic mai adevărat. Tocmai am aflat că Internet Explorer + position:relative + padding nu prea se împacă cu eventul mouseover din javascript sau cu pseudo-clasa :hover din CSS (valabil doar pentru IE7).

Codul iniţial era următorul:

1
2
3
4
5

<dd>
	<h2><a href="tooltip.cfm?id=#id#&amp;section=#section#" class="jTip">#title#</a></h2>
	<p>in <a href="##">#location_name#</a> of <strong>#apt_no#</strong> of <strong>#property_name#</strong></p>
	<span class="control"><a href="ticket_edit.cfm?id=#id#" class="edit"></a></span>
</dd>

DD era pozitionat relativ iar span class="control" era poziţionat absolut şi afişat doar la mouseover (făcut cu javascript din considerente de compatibilitate cu IE6, altă pocnitoare). Well… După o sesiune de vreo 10 minute de înjurături la adresa neamului lui William Henry Gates al III-lea, mi-a venit ideea salvatoare să aşez tot conţinutul DD într-un DIV:

1
2
3
4
5
6
7

<dd>
<div class="cnt">
	<h2><a href="tooltip.cfm?id=#id#&amp;section=#section#" class="jTip">#title#</a></h2>
	<p>in <a href="##">#location_name#</a> of <strong>#apt_no#</strong> of <strong>#property_name#</strong></p>
	<span class="control"><a href="ticket_edit.cfm?id=#id#" class="edit"></a></span>
</div> 
</dd>

Am transferat toate proprietăţile DD către div class="cnt" iar eventul l-am lăsat în continuare pe DD. Merge minunat

EDIT:

Este prima mea întâlnire cu Cold Fusion. Pare interesant, dar… Nu-i de mine