Documentatie_atestat

8/6/2019 Documentatie_atestat

http://slidepdf.com/reader/full/documentatieatestat 1/15

Colegiul Naţional de Informatică „Grigore Moisil”,

Braşov

Lucrare pentru obţinerea atestatului

la informatică

Situația statistică a unei școli

Profesor îndrumător Niţulescu Laura

Frățilă

Cristina

Clasa a XII-a

F

Sesiunea mai 2011



Cuprins

Cuprins .................................................................................2

Motivarea alegerii temei si a limbajului utilizat ..................3

Descrierea aplica ieiț .............................................................7

Detalii tehnice de implementare ........................................11

Concluzii i posibilita i de continuareș ț ...............................15

Bibliografia ........................................................................15

2



Motivarea alegerii temei si a limbajului utilizat

Alegerea temei a fost una grea. Propunîndu-mi să îmi testez limitele, am crezut de

cuviin ă să încerc să creez o situa ie statistică a mediilor , din dorin a ca munca mea să fieț ț ț

una utilă pentru viitor.

Munca propriu-zisă a fost completată de studiierea în amănunt a informa iilor ț

folosite. Încercăriile e uate au reprezentat o pierdică pentru mine, eu fiind demoralizatș ă.

Însă datorită ambi iei am reu it să creez acest site într-un timp scurt.ț ș

Din punct de vedere al limbajului utilizat am ales să folosesc limbajul Mysql

pentru că în conceperea unui situa i statistice ai nevoie de baze de date în care să re iț ț

informa iile.Am preferat PHP-ul deoarece oferă o gamă mai largă de scripturi i ajută laț ș creearea site-urilor dinamice De

asemenea, am folosit i CSS care fiind flexibil ajută la înfrumuse area designului,ș ț

3



Elemente de limbaj folosite în lucrare

În realizarea site-ului “Situa ia statistică” se regăsesc elemente de html, css pentruț

design, php şi mysql pentru baza de date şi javascript pentru slideshow-ul de imagini şi

trimiterea datelor la server fără încarcarea paginii (cu jQuery – librarie a Javascript ).

CSS prescurtarea de la Cascading Style Sheets, sunt etichete folosite pentru

formatarea paginilor web (de exemplu formatare text, background sau aranjare în pagina,

etc.). CSS-ul nu exclude html-ul din pagina web. Nu se poate realiza o pagină web

folosind numai CSS, care a fost proiectat astfel încât să conlucreze cu HTML-ul. Folosind

CSS, se ajunge la:

•

un control mai fin asupra paginii web• scăderea dimensiunii în octeti a paginii web, atunci când codul CSS e

continut într-un fisier extern

• mai mare comoditate: modificând fisierul CSS extern, modificăm simultan

toate paginile web în care acesta e inclus

• efecte mai sofisticate decât cele produse de codul HTML: suprapunerea unei

imagini peste altã imagine, a unui text peste alt text, impresia de relief,

efectul hover, afisarea unor fonturi mai mari decât h1 etc.Beneficiile sintaxei CSS sunt: formatarea este introdusă într-un singur loc pentru

tot documentul. Dezavantajul este ca pagina conţinând cod CSS poate arata diferit în

navigatoare diferite, deoarece nu toate browserele interpreteaza codul CSS.

Pentru proiectul meu de atestat am folosit CSS-ul pentru a formata diferite

elemente ale paginilor: tabele, formulare, meniuri, imagini şi pentru a stabili poziţionarea

în pagină, culorile, fonturile şi dimensiunile.

4



PHP este prescurtarea de la Hypertext PreProcessor. Spre deosebire de paginile

HTML care puteau fi verificate şi pe calculatorul local paginile PHP nu pot fi verificate

decât dacă sunt găzduite pe un server web care are instalat PHP.

Când accesam o pagină HTML serverul care o gazduieşte trimite pagina HTML către

browser spre afişare. În cazul unei pagini PHP serverul citeşte codul PHP, îl interpreteazăşi genereaza dinamic pagina HTML care este trimisă browserului spre afişare. Acesta este

motivul pentru care utilizatorii folosesc PHP pentru construirea unor pagini cu conţinut

dinamic.

MySQL este un sistem de gestiune a bazelor de date. O bază de date este o colecţie

structurată de date. Ca să adaugi, să accesezi şi să procesezi informaţiile din baza de date

ai nevoie de un sistem de gestiune a bazelor de date ca, de exemplu MySQL. MySQL este

un sistem de gestiune a bazelor de date relaţionale. O bază de date relaţionala memorează

date în tabele separate în loc de a stoca toate informaţiile într-o singură structură adăugând

astfel viteză şi flexibilitate. Tabelele sunt legate prin relaţii permiţându-se afişarea datelor

combinate la cerere.

Site-ul “Situa ia statistică a unei coli” foloseşte baza de date numită “elev” în careț ș

sunt stocate toate datele referitoare la sejururile, circuitele şi ofertele disponibile. Pe lângă

acestea mai sunt reţinute informaţii în tabele diferite precum medii, clasa, diriginte .Membrii şi parolele lor de acces şi aăartin bazei de date “users”

Toate aceste informatii sunt accesate cu ajutorul php-ului pentru a putea fi afişate

pe site. De exemplu, afi area si adăugarea sunt structurate pe diverse criterii pe bazaș

cărora sunt extrase datele necesare.

jQuery este o platformă de dezvoltare JavaScript, concepută pentru a u ura iș ș

îmbunătă i procese precum traversarea arboreluiț DOM în HTML, managementul inter-

browser al evenimentelor, anima ii i cereri tipț ș AJAX. jQuery îţi oferă posibilitatea de a

îndeplini cu uşurinţă următoarele task-uri:

• Accesează părţi din pagină; jQuery oferă mecanisme foarte elegante de

traversare a elementelor unei pagini.

5



• Modifică aspectul unei pagini şi oferta posibilitatea de a schimba unele

proprietăţi dinamic, după ce pagina s-a încărcat deja

• Modifică conţinutul unei pagini. jQuery poate fi schimbat un text, modificată

o imagine, reordonată o listă ş.a.m.d.

•

Răspunde la interacţiunea utilizatorului cu pagina.• Adaugă animaţii complexe paginilor.

• Primeşte informaţie de la server fără încărcarea paginii.

• Simplifică munca cu JavaScript.

6



Descrierea aplica ieiț

Fiind un program php, manevrarea lui necesită instalearea serverelor de lucru. În

cazul meu am ales să folosesc WampServer, care prin programul “PhpMyAdmin” poate

creea baze de date i tabele, simflificînd-mi astfel munca.ș

Aplicaţia este uşor de folo it datorită butoanelor informative i a informa iilor ș ș ț

regăsite atît pe parcursul site-ului cît i înș “help”.

Cum am precizat i anterior, programul prezintă o serie de butoane, uș or deș

manevrat , fiecare fiind un link către alta pagină.

Butonul “Home” are un link care trimite utilizatorul spre prima pagina, butonul“Elevi” inserează sau terge un elev din baza de date, în func ie de clasa selectata înș ț

“Adaugare” iș “Afiseaza” sunt inserate / afi ate mediile , iar butonul “Cauta” , caută înș

baza de date un anumit elev.

7



Prima pagina a site-ului întîmpină vizitatorul cu un formular de autentificare, pe

baza căruia îi este permis accesul . Butoanele mai sus enumerate sunt inaccesibile. În cazul

în care parola este gre ită, mesajul „Numele de utilizator sau parola au fost gresitș

introduse!” alături de butonul „Back” oferă utilizatorului o noua ansă.ș

Odată cu intrarea în site, userul are libertatea de a alege între o serie de aplica ii .ț

În submeniul „ Elevi” acesta poate să adauge sau să steargă informa ii într-un mod u or.ț ș

8



La adăugare formularul trimite date scripului, oferind feed-back pentru reu ită.ș

La func ia de tergere sunt afi aț ș ș ți to i elevii din baza de date, opera iune finalizataț ț

de linkul „Sterge elevul”

Următorul buton „Adaugare”, permite utilizatorului să acceseze una din clasele

introduse în baza de date .Fiecare clasa reprezinta un link către o pagină . În pagina următoare sunt afi a i to iș ț ț

elevii, fiecare avînd 2 linku „Adaugare medii semestul I” i „Adaugare medii semestrul II”ș

,care insereaza în baza de date informa iile . Butonul „Back” situat în pagina aceasta ,ț

trimite utilizatorul înapoi în meniul „Adaugare medii” pentru a insera din nou.

9



Mai departe, submeniul „Afiseza” se comporta similar celui „Adauga” , permi îndț

utilizatorului să aleagă o clasa , în care să vadă situa ia mediilor.ț

Ultimul buton : „Cauta” , oferă user-ului poaibilitatea de a căuta un elev în baza de

date .

Totodata butonul „Back” face trimitere la pagina de căutare .

În partea de jos a paginii, se găsesc o serie de butoane similare cu cele de sus

,alături de date despre autor i site . (O mică problemă cu diacriticele)!ș

10



Detalii tehnice de implementare

Site-ul îmbimă o varietate de limbaje , cum ar HTML, PHP , MYSQL i pe alocuriș

JAVASCRIPT.

Funcția de adăugare din primul submeniu „Elevi” , are la baza un formular care

transmite datele unei func ii „inserare_elev”ț

Prîn intermediul variabilelor nume,prenume,clasa ,diriginte i medie_generala, prinș

POST se transmit datele, care sunt introduse în tabelul elev pentru a fi prelucrate.

O alta func ie , cea de tergere, permite eliminarea din baza de date a elevuluiț ș

dorit. Clauza „WHERE” are rolul de a specifica exact ce trebuie ters, în caz contrar se vor ș

terge toate datele.ș

11



În cadrul meniului Adaugare, am folost limbajul JAVASCRIPT mai precis jQuery

care mi-a permis trimiterea datelor la server fără a reîncarca pagina curenta.

Variabila $row este specifică php-ului şi reţine pe rând toate datele întoarse de

variabila $result_tara: $row[‘nr_matr] .

Expresia : <link=”pagina.php?variabila=”” reprezinta modul în care se poate

încarca codul unei pagini Web, la care variabila se transmite prin GET.

Diferen a între POST i GET este aceea ca folosind GET, informatia transmisă deț ș

la utilizator este încărcată în url, pe cînd cea de la POST nu este în url, ea este transmisa

12



prin conexiunea curentă http. Astfel, un url la care a fost transmisă o cerere POST nu se

poate salva pentru o accesare ulterioară.

În meniul căutare, prin intermediul formularului se transmit date scriptului, pentruca apoi printr-o noua func ie JQuery, datele să fie căutate în baza de date i apoi afi ateț ș ș

într-un tabel.

Una dintre cele mai interesate păr i o reprezintă acel bec , care la trecereaț

mouse-ului pe deasupra se aprinde. Am creeat doua id-uri numite “continut_bulb”unde, prin intermediu backgound-ului am transmis două poze , care cu ajutorul

13



func iei hover alternează .ț

14



Concluzii i posibilita i de continuareș ț

În concluzie, site-ul creeat reprezintă un site destinat colii, cu ajutorul căruiaș

profesorii vor putea calcula si ine eviden a mediilor.ț ț

Are o interfa ă simplă, u or de utilizat , oricine reu ind astfel să adauge, să teargăț ș ș ș

si să folosească modifice datele.

Ca i posibilitate de continuare, consider că imbunătă ire lui constă in efectuareț ț

unor topuri în func ie de media eleviilor i deasemenea introducerea unor rubrici noi cumț ș

ar fi absen ele . Totodată elevii pot fi inregistra i i cu poze, pentru ca , de exemplu laț ț ș

întîlnirea de 10 ani , ace tia să reasocieze adolescen a cu liceul .ș ț

Bibliografia

• http://www.somacon.com/p141.phpț

• http://www.mysqltutorial.org/

• http://www.w3schools.com/css/tryit.asp?filename=trycss_table_width

• http://www.ecursuri.ro/cursuri/hrml

• http://www.marplo.net/html/coduri_culori.html

• http://www.tizag.com/mysqlTutorial

• http://www.freewebmasterhelp.com/tutorials/phpmysql

http://2css.net/tutoriale-Tutorial-despre-crearea-unui-site-folosind-divuri-partea-a-

doua.html

15

Documentatie_atestat

Documents

Transcript of Documentatie_atestat