start     Articole     Despre mine    

invata programare de la zero (primul pas)

Cel mai probabil nu trece nicio zi din viata ta fara sa folosesti o multime de aplicatii software. Sisteme de operare, drivere, playere audio si video, browsere, si asa mai departe. Iar daca faci o munca de birou este aproape cert ca folosesti zilnic editoare de text, programe de calcul tabelar sau diverse aplicatii specifice domeniului tau de lucru.

Fie ca vorbim de calculator, tableta sau telefon, programele software sunt o prezenta ubicua in viata noastra. E greu, asadar, de gasit o alta activitate umana care sa egaleze ca impact asupra vietii noastre de astazi programarea. (O voi numi in continuare programarea calculatoarelor, caci toate dispozitivele a caror functionare se bazeaza pe software sunt in esenta niste calculatoare.)

Nu e de mirare, deci, numarul mare de oameni care fie isi doresc in mod deschis, fie viseaza in secret sa aiba abilitatile unui programator. Isi doresc sa-si poata crea singuri o aplicatie care le e necesara (si care poate fie nu exista, fie este prea scumpa), sau isi doresc sa transpuna in realitate o idee de joc ce le-a incoltit in minte. Isi doresc, cu alte cuvinte, sa-si poata transpune gandurile intr-un sir de comenzi care rulate de un calculator sa dea rezultatele asteptate.

Poate ca si tu iti doresti aceste lucruri.

Ba poate chiar te-ai si apucat, dar ti s-a parut prea dificil si ai lasat-o balta.

Am o veste pentru tine: Nu exista nicio stiinta dificila pe lumea asta, atata timp cat este explicata pe intelesul tau. In aceste conditii, mai trebuie doar sa iti doresti s-o intelegi si sa fii dispus sa depui si ceva efort.

Din start iti spun: Cu efort zero obtii rezultat zero. E valabil in orice domeniu, nu doar in invatarea programarii calculatoarelor. Fie ca vrei sa iti imbunatatesti stilul de viata, fie ca vrei sa arati mai bine, fie ca vrei sa cunosti oameni interesanti, fie ca vrei sa inveti sa dansezi sau sa desenezi, trebuie sa fii dispus sa depui ceva efort.

Fata de alte activitati, insa, programarea calculatoarelor ofera avantajul unei recompense foarte rapide pentru efortul depus. Vei vedea cum cu un minim de cunostinte deprinse vei putea deja sa iti exersezi creierul creand lucruri foarte simpatice si fascinante (chiar daca destul de simple, la inceput).

 

Hai sa ne apucam de treaba!

Mai intai, ce iti trebuie pentru a incepe sa inveti sa programezi un calculator?

Probabil deja te gandesti ca un prim lucru absolut necesar este calculatorul. Ei bine, nu! Consider ca primele lectii pe care ar trebui sa le invete un viitor programator nu au nicio trebuinta de calculator. Adevarata creatie nu se intampla acolo. Ci adevarata creatie rezulta dintr-o reorganizare a mintii, dintr-o antrenare a creierului in directia dobandirii unei noi abilitati, a unui nou mod de a vedea lumea.

(Poate ultima afirmatie ti se pare un pic exagerata. Poate ca iti doresti doar sa inveti sa faci programe de calculator, si nu sa iti schimbi modul de a vedea lumea. In cazul acesta, te rog sa nu mai citesti restul articolului si nici articolele ulterioare pe aceasta tema, fiindca n-or sa te ajute. Eu nu vreau sa te invat sa devii zugrav, ci pictor.)

 

O foaie de hartie si un pix. Atat iti trebuie pentru a invata cea mai importanta lectie din programarea calculatoarelor.

Si in ce consta aceasta lectie?

Consta in a intelege faptul ca un calculator poate sa execute doar un set foarte limitat de instructiuni. Si ca orice lucru pe care ne dorim ca un calculator sa-l faca trebuie sa-l putem “sparge” intr-un sir format din aceste intructiuni pe care calculatorul le cunoaste si le poate executa. (La fel ca in jocul Tetris — avem doar cateva tipuri de piese si trebuie sa ne descurcam cu ce avem pentru a construi linii.)

Sa luam un exemplu simplu. Sa zicem ca avem un calculator care stie doar sa aprinda si sa stinga un punct situat la coordonate oarecare pe un ecran de 10×10 astfel de puncte. Te rog sa desenezi pe foaia de hartie o schita a acestui ecran. Ar trebui sa arate in felul urmator.

 

Pentru a identifica fiecare dintre cele 100 de puncte putem, de exemplu, denumi coloanele si liniile folosind numere. Astfel, punctul marcat cu rosu se gaseste pe coloana 7 si pe linia 3, deci la coordonatele (7, 3). (Punctul negru din stanga jos este situat la coordonatele (1, 1).)

 

Am spus ca acest calculator imaginar de care vorbim stie sa aprinda si sa stinga oricare dintre cele 100 de puncte. Altfel spus, el poate executa doar doua instructiuni:

  • Aprinde punctul de la coordonatele (x, y).
  • Stinge punctul de la coordonatele (x, y).

Putem simplifica lucrurile simplificand denumirile acestor comenzi in Aprinde(x, y) si, respectiv Stinge(x, y).

Iata, in continuare, cum am putea folosi acest calculator imaginar pentru a desena o floare.

Marcheaza-ti, te rog, pe foaia de hartie punctele care trebuie aprinse pentru a desena aceasta floare. Apoi noteaza-ti pentru fiecare dintre aceste puncte coordonatele. Tot ce mai trebuie acum pentru a instrui calculatorul nostru virtual sa deseneze aceasta floare este sa ii dam comenzile pentru aprinderea fiecarui punct. Te rog sa iti notezi pe foaie succesiunea de comenzi rezultata.

 

La mine programul rezultat astfel este urmatorul:

Aprinde(1, 5)
Aprinde(1, 6)
Aprinde(2, 2)
Aprinde(2, 3)
Aprinde(2, 4)
Aprinde(2, 7)
Aprinde(2, 8)
Aprinde(2, 9)
Aprinde(3, 2)
Aprinde(3, 4)
Aprinde(3, 7)
Aprinde(3, 9)
Aprinde(4, 2)
Aprinde(4, 3)
Aprinde(4, 5)
Aprinde(4, 6)
Aprinde(4, 8)
Aprinde(4, 9)
Aprinde(5, 1)
Aprinde(5, 4)
Aprinde(5, 5)
Aprinde(5, 6)
Aprinde(5, 7)
Aprinde(5, 10)
Aprinde(6, 1)
Aprinde(6, 4)
Aprinde(6, 5)
Aprinde(6, 6)
Aprinde(6, 7)
Aprinde(6, 10)
Aprinde(7, 2)
Aprinde(7, 3)
Aprinde(7, 5)
Aprinde(7, 6)
Aprinde(7, 8)
Aprinde(7, 9)
Aprinde(8, 2)
Aprinde(8, 4)
Aprinde(8, 7)
Aprinde(8, 9)
Aprinde(9, 2)
Aprinde(9, 3)
Aprinde(9, 4)
Aprinde(9, 7)
Aprinde(9, 8)
Aprinde(9, 9)
Aprinde(10, 5)
Aprinde(10, 6)

Poate ca programul tau aprinde punctele intr-o alta ordine, insa ce e important e faptul ca efectul final este acelasi.

Acum haide sa vedem cum am putea face ca discul din centrul florii sa dispara. Evident, va trebui sa folosim instructiunea Sterge(x, y), unde (x, y) vor fi pe rand coordonatele fiecaruia dintre punctele ce construiesc acel cerc. Noteaza-ti si acest program, dupa care te rog sa-l compari cu programul listat in continuare:

Sterge(4, 5)
Sterge(4, 6)
Sterge(5, 4)
Sterge(5, 5)
Sterge(5, 6)
Sterge(5, 7)
Sterge(6, 4)
Sterge(6, 5)
Sterge(6, 6)
Sterge(6, 7)
Sterge(7, 5)
Sterge(7, 6)

 

E simplu, nu? (Este ca si cum am avea un robot pe care il putem programa sa deseneze sau sa sterga un punct pe o tabla la o pozitie indicata. Dupa cum ai vazut, prin succesiuni de astfel de instructiuni simple putem realiza pe acea tabla o multime uriasa de desene. (Daca facem un mic calcul, observam ca putem construi un numar de 2^100 desene distincte. Cel mai probabil, insa, cea mai mare parte dintre aceste desene vor arata doar ca niste imprastieri aleatoare de puncte, fara nicio semnificatie.) Practic, singurul lucru care ne limiteaza este faptul ca tabla permite doar 10×10 puncte si doar doua culori (stins, si aprins). Insa intr-un calculator real aceste limitari nu sunt prezente — ci dispunem de peste 1000000 de puncte si peste 10000000 de culori.)

Poate ca ceea ce ai facut pana aici ti s-a parut o joaca mult prea simpla, si care nu are mare legatura cu ideea de programare a calculatoarelor. Insa te asigur ca daca ai inteles acesta lectie si ai facut singur cele doua mici “programe” ai facut un pas urias in a intelege cum se programeaza un calculator, caci ai inteles unul dintre conceptele de baza — acela de “instructiune”.

Ce ne-am face, insa, daca ne-am propune ca dupa ce am desenat aceasta floare sa desenam altceva? Cel mai indicat ar fi ca mai intai sa stergem toate punctele, dupa care sa le aprindem pe cele care compun noul desen. In cazul in care am cunoaste desenul ce a fost afisat anterior am putea, evident, sa inlocuim in programul ce l-a generat fiecare instructiune de tip Afiseaza(x, y) cu o intructiune de tip Sterge(x, y).

Insa hai sa ne gandim la o situatie mai avansata, in care dintr-un motiv sau altul nu ne ramane alta solutie decat sa stergem toate punctele de pe ecran inainte de a face noul desen. Ar trebui, asadar, sa scriem 100 de instructiuni de tip Sterge(x, y). Cam mult de munca pentru un simplu ecran de 10×10 pixeli, nu? (Nici nu vreau sa ma gandesc la cazul unui ecran de 1280×800.)

Banuiesti deja, sunt convins, ca exista o solutie mult mai facila decat cele 100 de instructiuni de tip Sterge(x, y). Pentru a o intelege, insa, este nevoie de conceptul de “variabila” (care este doar o denumire data unei mici bucati dintr-o memorie in care putem scrie si din care putem citi valori). Voi diseca acest concept intr-o lectie ulterioara.

 

Pentru moment te-as ruga sa te gandesti cum l-ai putea schita pe Mickey Mouse folosind calculatorul virtual discutat in aceasta lectie. Si, evident, poti posta in sectiunea de comentarii programul si imaginea. De asemenea, as fi curios ce impresie ti-a lasat acest inceput de drum in ale programarii calculatoarelor. Simti ca ne miscam prea incet? Sau prea repede? Intampini dificultati in a intelege anumite lucruri? Ti-ai dori sa aprofundez unele aspecte? (Scrie-mi despre oricare dintre acestea la florin [at] igotopia.ro, si voi incerca sa adaptez lectiile la obiectivele tale si la stilul tau de a invata.)

 

Daca ti-a placut, inroleaza-te in armata noastra de creiere cu muschi si vei primi testul care iti va spune daca ai sau nu minte de programator:


(nu trimit spam; te tin la curent cu noutatile)

Cu drag,

 

 

Florin

 





123 comments
Alex_34
Alex_34

Mi-a iesit destul de bine.


danavaradi1
danavaradi1

Buna sunt Dana si imi place mult lectia si am inteles ce as avea de facut doar ca nu stiu in ce program faceti voi desenele respective....? trebuie sa cumpar inainte ceva? ajutati-ma va rog sa inteleg...vreau sa invat si eu programare, multumesc


BogdanPierre
BogdanPierre

am o intrebare.....cand vreau sa schitez ceva prima data ar trebui sa scriu comenzile imaginate si apoi sa aprind in functie de comenzile notate  nu intai sa desenez si apoi sa notez comenzile deoarece este vorba de imaginatie?

Multumesc

NicuIorga
NicuIorga

Mi-a placut prima lectie , dupa ce voi citi si intelege toate cele 8 lectii as putea sa pot creea un joc de la 0 ?

DeaconuMihai
DeaconuMihai

Buna seara,

L-am programat si eu pe Mickey Mouse in varianta pirat:)

Multumesc pentru lectii.


Nicu1
Nicu1

Parca sa primit ceva... )

MangaMo
MangaMo

Aprinde(3,10)

Aprinde(8,10)

Aprinde(2,9)

Aprinde(3,9)

Aprinde(4,9)

Aprinde(7,9)

Aprinde(8,9)

Aprinde(9,9)

Aprinde(4,8)

Aprinde(5,8)

Aprinde(6,8)

Aprinde(7,8)

Aprinde(3,7)

Aprinde(8,7)

Aprinde(2,6)

Aprinde(4,6)

Aprinde(7,6)

Aprinde(9,6)

Aprinde(2,5)

Aprinde(5,5)

Aprinde(6,5)

Aprinde(9,5)

Aprinde(3,4)

Aprinde(8,4)

Aprinde(4,3)

Aprinde(7,3)

Aprinde(5,2)

Aprinde(6,2)


EdwardNewgate
EdwardNewgate

Multumesc foarte mult pentru tutorial

Aprinde(1,1) ;

Aprinde(2,1) ;

Aprinde(3,1) ;

Aprinde(4,1) ;


Aprinde(7,1) ;

Aprinde(8,1) ;

Aprinde(9,1) ;

Aprinde(10,1) ;


Aprinde(2,2) ;

Aprinde(3,2) ;

Aprinde(4,2) ;

Aprinde(7,2) ;


Aprinde(8,2) ;

Aprinde(9,2) ;

Aprinde(3,3) ;

Aprinde(4,3) ;


Aprinde(7,3) ;

Aprinde(8,3) ;

Aprinde(3,4) ;

Aprinde(4,4) ;


Aprinde(5,4) ;

Aprinde(6,4) ;

Aprinde(7,4) ;

Aprinde(8,4) ;


Aprinde(2,5) ;

Aprinde(3,5) ;

Aprinde(8,5) ;

Aprinde(9,5) ;


Aprinde(3,6) ;

Aprinde(3,7) ;

Aprinde(3,8) ;

Aprinde(3,9) ;


Aprinde(3,10) ;

Aprinde(8,6) ;

Aprinde(8,7) ;

Aprinde(8,8) ;


Aprinde(8,9) ;

Aprinde(8,10) ;

Aprinde(4,7) ;

Aprinde(5,7) ;


Aprinde(6,7) ;

Aprinde(7,7) ;

Aprinde(2,7) ;

Aprinde(1,7) ;


Aprinde(2,6) ;

Aprinde(1,6) ;

Aprinde(1,5) ;

Aprinde(1,4) ;


Aprinde(9,7) ;

Aprinde(9,6) ;

Aprinde(9,5) ;

Aprinde(10,7) ;


Aprinde(10,6) ;

Aprinde(10,5) ;

Aprinde(10,4) ;


Aprinde(4,9) ;

Aprinde(7,9) ;

Aprinde(5,8) ;

Aprinde(6,8) ;


Aprinde(4,10) ;

Aprinde(5,10) ;

Aprinde(6,10) ;

Aprinde(7,10) ;


Aprinde(1,10) ;

Aprinde(2,10) ;

Aprinde(1,9) ;

Aprinde(2,8) ;

Aprinde(9,10) ;


Aprinde(10,9) ;

Aprinde(9,8) ;

Aprinde(1,10) ;

Aprinde(1,8) ;


Aprinde(10,10) ;

Aprinde(10,8) ;

Dan
Dan

incercarea mea

Dan
Dan

incercarea mea 

Florin Birleanu
Florin Birleanu moderator

@Dan Interesant animal. Sau pokemon -- ce-o fi el... :-)

DragosOcu
DragosOcu

O casa sau un mouse?=)) .Va multumesc pentru efortul de pus pentru acest articol!

isorina86
isorina86

Eu si Steve Jobs :)) Multumesc! 

laurentiu dan
laurentiu dan

Este un articol foarte reusit, limbajul foarte concis si explicit. Felicitari si multumiri pentru efortul de a transmite si alcuiva aceste informatii, in mod altruist.

Florin Birleanu
Florin Birleanu moderator

@laurentiu dan Iti multumesc pentru aprecieri! :-)

culi1602
culi1602

Debordez de simt artistic

JuliaRoberta
JuliaRoberta

hehe, cât de tare! mi-a iesit și mie ceva! :) mulțumiri!

Eunika
Eunika

:)

Multumim pentru articole!

xraffaellhd
xraffaellhd

Bai, nu-s prea talentat dar am incercat si eu ceva :)))

Aprinde(3,1);
Aprinde(3,2);
Aprinde(3,3);
Aprinde(3,4);
Aprinde(3,5);
Aprinde(3,6);
Aprinde(3,7);
Aprinde(3,8);
Aprinde(3,9);
Aprinde(4,9);
Aprinde(5,9);
Aprinde(6,9);
Aprinde(7,9);
Aprinde(7,8);
Aprinde(7,7);
Aprinde(7,6);
Aprinde(6,6);
Aprinde(5,6);
Aprinde(4,6);
Aprinde(4,5);
Aprinde(5,4);
Aprinde(6,3);
Aprinde(7,2);
Aprinde(8,1);

Este un R

calex61
calex61

Ofera te rog mai multe detalii despre programele folosite si limbajele folosite. Eu ma enumar printre aia incepatori spre cei mai incepatori si mi-ar prinde foarte bine sa primesc informatii mai exacte, nu doar aprinde x, aprinde y. De unde putem lua programele, ce limbaj folosesti mai exact...si alte aspecte asemanatoare pentru dobitoci ca mine. Multumesc! In rest...foarte interesante notiunile tale!


Florin Birleanu
Florin Birleanu moderator

@calex61 Limbajul folosit in acest tutorial este un subset al limbajului Javascript, la care am adaugat cateva functii. Dar nu stiu daca la acest moment al invatarii programarii sunt de vreun folos astfel de detalii, caci pentru inceput scopul este deprinderea unui nou mod de a gandi -- si nu direct construirea de programe profesioniste. :-)

Catalinsys
Catalinsys

Aprinde(10,1);

Aprinde(1,1);

Aprinde(1,10);

Aprinde(10,10);

Aprinde(8,8);

Aprinde(7,8);

Aprinde(6,8);

Aprinde(5,8);

Aprinde(4,8);

Aprinde(4,5);

Aprinde(4,6);

Aprinde(4,7);

Aprinde(4,8);

Aprinde(4,4);

Aprinde(4,3);

Aprinde(5,3);

Aprinde(6,3);

Aprinde(7,3);

Aprinde(8,3);

Aprinde(2,1);

Aprinde(3,1);

Aprinde(4,1);

Aprinde(5,1);

Aprinde(6,1);

Aprinde(7,1);

Aprinde(8,1);

Aprinde(9,1);

Aprinde(1,2);

Aprinde(1,3);

Aprinde(1,4);

Aprinde(1,5);

Aprinde(1,6);

Aprinde(1,7);

Aprinde(1,8);

Aprinde(1,9);

Aprinde(10,2);

Aprinde(10.3);

Aprinde(2,1);

Aprinde(3,1);

Aprinde(4,1);

Aprinde(5,1);

Aprinde(6,1);

Aprinde(7,1);

Aprinde(8,1);

Aprinde(9,1);

Aprinde(10,3);

Aprinde(10,4);

Aprinde(10,5);

Aprinde(10,6);

Aprinde(10,7);

Aprinde(10,8);

Aprinde(10,9);

Aprinde(2,10);

Aprinde(3,10);

Aprinde(4,10);

Aprinde(5,10);

Aprinde(6,10);

Aprinde(7,10);

Aprinde(8,10);

Aprinde(9,10);

cri
cri

Eu am facut un fluturas :)

Aprinde(2,2);

Aprinde(2,4);

Aprinde(2,5);

Aprinde(2,6);

Aprinde(2,7);

Aprinde(2,8);

Aprinde(2,9);


Aprinde(3,1);

Aprinde(3,3);

Aprinde(3,4);

Aprinde(3,8);


Aprinde(4,2);

Aprinde(4,7);

Aprinde(4,10);


Aprinde(5,3);

Aprinde(5,6);

Aprinde(5,9);



Aprinde(6,2);

Aprinde(6,3);

Aprinde(6,4);

Aprinde(6,5);

Aprinde(6,6);

Aprinde(6,7);

Aprinde(6,8);


Aprinde(7,3);

Aprinde(7,6);

Aprinde(7,9);


Aprinde(8,2);

Aprinde(8,7);

Aprinde(8,10);


Aprinde(9,1);

Aprinde(9,3);

Aprinde(9,4);

Aprinde(9,8);


Aprinde(10,2);

Aprinde(10,4);

Aprinde(10,5);

Aprinde(10,6);

Aprinde(10,7);

Aprinde(10,9);

Aprinde(10,8);

DC Radu
DC Radu


Aprinde(2,8)
Aprinde(2,7)
Aprinde(2,6)
Aprinde(3,5)
Aprinde(4,4)
Aprinde(5,4)
Aprinde(6,4)
Aprinde(7,4)
Aprinde(8,5)
Aprinde(9,6)
Aprinde(9,7)
Aprinde(9,8)
Aprinde(8,9)
Aprinde(4,9)
Aprinde(5,9)
Aprinde(6,9)
Aprinde(7,9)
Aprinde(4,6)
Aprinde(4,8)
Aprinde(3,7)
Aprinde(5,7)
Aprinde(6,7)
Aprinde(7,8)
Aprinde(8,7)
Aprinde(7,6)
Aprinde(5,5)
Aprinde(4,5)
Aprinde(3,9)
Aprinde(6,5)
Aprinde(7,5)
Aprinde(3,4)
Aprinde(8,4)
Aprinde(3,3)
Aprinde(3,2)
Aprinde(3,1)
Aprinde(8,3)
Aprinde(8,2)
Aprinde(8,1)
Aprinde(4,1)
Aprinde(5,1)
Aprinde(6,1)
Aprinde(7,1)
Aprinde(5,3)
Aprinde(6,3)
Stinge(6,3)
Aprinde(6,3)

DC Radu
DC Radu

Ce program as putea folosi ca sa fac si eu ceva de acest gen?


Andreea
Andreea

             http://i.imgur.com/v3gi2Wz.png

Aprinde(1,10)
Aprinde(1,9)
Aprinde(1,8)
Aprinde(2,10)
Aprinde(2,9)
Aprinde(2,8)
Aprinde(2,7)
Aprinde(2,6)
Aprinde(2,5)
Aprinde(2,4)
Aprinde(2,3)
Aprinde(2,2)
Aprinde(2,1)
Aprinde(3,10)
Aprinde(3,9)
Aprinde(3,8)
Aprinde(3,1)
Aprinde(4,8)
Aprinde(4,6)
Aprinde(4,4)
Aprinde(4,1)
Aprinde(5,8)
Aprinde(5,3)
Aprinde(5,1)
Aprinde(6,8)
Aprinde(6,3)
Aprinde(6,1)
Aprinde(7,8)
Aprinde(7,6)
Aprinde(7,4)
Aprinde(7,1)
Aprinde(8,10)
Aprinde(8,9)
Aprinde(8,8)
Aprinde(8,1)
Aprinde(9,10)
Aprinde(9,9)
Aprinde(9,8)
Aprinde(9,7)
Aprinde(9,6)
Aprinde(9,5)
Aprinde(9,4)
Aprinde(9,3)
Aprinde(9,2)
Aprinde(9,1)
Aprinde(10,10)
Aprinde(10,9)
Aprinde(10,8)

:)

 

Florin Birleanu
Florin Birleanu moderator

@Andreea Interesanta abordare grafica. Spor in continuare!

Trackbacks

  1. […] inceput cu articolul anterior o serie de articole ce isi propun sa te ia de la zero si sa te introduca subtil in lumea […]

  2. […] prima lectie de programare ai vazut ca cel mai important lucru pe care trebuie sa-l cunosti legat de programarea […]

  3. […] cu ceea ce ai invatat in lectiile anterioare (instructiuni (1/2, 2/2), variabile, instructiunea “daca”) poti construi programe destul de complexe. […]

  4. […] isi doreste sa devina programator trebuie sa le stapaneasca intr-un mod personal. Am vorbit despre instructiuni, despre variabile, despre instructiunea daca, despre instructiunea cat timp, despre vectori si […]

  5. […] sa execute o serie de instructiuni precise, una dupa alta (asa cum ai putut vedea in lectia 1 (partea 1 si partea a 2-a)). Ai vazut si experimentat pana aici instructiuni ce au un efect vizual imediat […]

  6. […] te apuci de programare este acela ca orice program este o insiruire de instructiuni foarte precise. Vezi lectia in detaliu aici (si partea a doua […]