Lucrarea se întinde pe patru capitole, după cum urmează: [305877]

[anonimizat] a fost Revoluția Industrială. Este marea transformare a [anonimizat].

După cum fiecare mare revoluție și-a [anonimizat] a [anonimizat], sau chiar luni în domeniul tehnologiilor informaționale. Între e-Revolution și e-[anonimizat], confuzia, [anonimizat], [anonimizat]. [anonimizat].

Motivația principala în realizarea acestui proiect a fost interesul pentru tehnologiile web și dorința de a crea un site care va fi folosit cu succes pentru o documentare și testare online. O altă motivație a fost dorința de lărgire a [anonimizat], [anonimizat].

[anonimizat]:

Primul capitol face o analiză a [anonimizat], argumentul și cerințele de implementare și rulare ale aplicației. În capitolul 2 este prezentată concepția și proiectarea aplicației. Capitolul al treilea tratează modul de implementare al aplicației. [anonimizat]. Ultimul capitol cuprinde un manual de utilizare al aplicației în funcție de tipul de utilizator( student: [anonimizat], administrator).

Începând cu implementarea interfeței grafice statice a site-[anonimizat] a [anonimizat]-[anonimizat] a-ți testa studenții.

[anonimizat], [anonimizat].

La finalul lucrării vor fi prezentate concluziile despre modul în care a decurs realizarea acestui proiect și de asemenea și perspectivele viitoare de dezvoltare în ceea ce privește comerțul online.

CAPITOLUL 1 ANALIZA PROBLEMEI

Studiul existentului (studiul asupra problemei curente)

Termenul de predare alternativă poate fi folosit ca reprezentînd aproape orice abordare a predării care diferă în mod semnificativ de învățămîntul tradițional. [anonimizat] (CAI-Computer Assisted Instruction) în învățarea matematicii sau învățarea interactivă cu ajutorul calculatorului pentru a [anonimizat].

Învățămînul la distanță, o evoluție a școlii prin coresponență este un pas semnificativ al predării alternative. De-a [anonimizat]ță cum ar fi televiziunea, conferințele audio și faxul. În ciuda acestor abordări, multe încercări de educație la distanță au avut succes, judecînd după rata studenților care au terminat. Recent, tehnologia calculatoarelor a fost introdusă în ecuația învățămîntului la distanță. În timp ce calculatoarele au continuat să devină tot mai puternice și mai rapide în ultimul deceniu, în domeniul comunicațiilor nu putem vorbi despre o asemenea dezvoltare. În particular, aceste încercări au dat naștere Internetului și prin el World Wide Web-ului (pe scurt Web-ul). Interesul pentru Internet și tehnologiile legate de acesta au crescut de mult, mult mai mult decît a crescut comunicarea. Internetul pare să aibă un potențial enorm în educație. Nu numai că promite să aibă un impact general asupra predării/învățării, dar în mod sigur va redefini predarea alternativă în general. Acest lucru este pus în evidență de apariția școlilor virtuale și oportunitățile pentru învățarea on-line. Motive pentru a alege învățarea on-line sunt:

– barierele geografice

acces la programe sau cursuri care nu sunt accesibile local

conflictul cu valorile sociale sau religioase ale unei școli sau cu sistemul unei școli

preferința pentru învățarea acasă (home schooling)

motive legate de sănătate sau abilități fizice

conflict cu alte responsabilități sau obligații

preferințe legate de liniștea învățării

preferințe legate de stilul de învățare

La prima vedere aceste motive nu par a fi diferite față de cele ce s-ar fi aplicat în cazul învățămîntului la distanță. Oricum, faptul că majoritatea sunt acum subordonate tehnologiilor multimedia și Internetului fac situația cu totul diferită, atît de diferită încît învățarea on-line poate fi aleasă de cei care învață.

Astăzi, predarea alternativă poate cuprinde ultimele noutăți în domeniul tehnologiei informației și comunicației, local sau la distanță, pentru a realiza unul dintre obiectivele a multe întrebări. Acreditarea cursurilor și programelor on-line devine o problemă.

Este necesar să susținem dezvoltarea cadrelor didactice și suportul instructorilor care nu se așteaptă să folosim tehnologie în cadrul predării, dar să dezvoltăm partea tehnologică a literaturii de specialitate pentru studenți. De asemenea, în era tehnologică, este nevoie în creștere de respectarea drepturilor asociată cu libertatea informației și protejarea secretelor.

Ca urmare a dezvoltării tehnologiei informației au apărut propuneri de introducere a acesteia în sistemul educațional. O parte din ele sunt prezentate în continuare:

Sfîrșitul anilor ’60

procesarea datelor electronice, folosirea calculatoarelor în calculele matematice și în inginerie

grupuri de specialiști, în general matematicieni și ingineri electronici, s-au axat pe această ramură a calculatoarelor, scriind și depanînd programe

știința calculatoarelor a fost predată în special în cadrul universităților tehnice (ingineria electronică) și facultăți de știință (matematica, fizica etc.)

în aceste momente pedagogia era influențată de cibernetică. S-au depus eforturi de a automatiza procesul educațional, și au apărut programele de instruire și mașinile de învățare. Bazele acestor încercări au fost crearea unui ghid complet al muncii studentului (într-un mod similar cu programarea activității procesorului unui calculator). Întregul proces a fost împărțit în doi pași. Fiecare din acești pași conținea comentarii legate de subiect, întrebări și reacții ale mașinii, care informau studentul despre răspunsul corect. Următorul pas a fost ales după corectitudinea răspunsurilor. Acest program putea să se împartă de asemenea, astfel încît fiecare student să-l poată utiliza într-un mod diferit, în funcție de cunoștințele sale. Diferența dintre această metodă și starea pasivă de abordare mai ales, nu este foarte mare. Dacă ne uităm la cîteva prezentări de programe educaționale pe CD-ROM, vom descoperi că nu sunt altceva decît niște mașini de învățare, unde pașii de educație sunt transformați în imagini, secvențe video și sunete.

Pedagogii, care s-au angajat pe această linie, au acumulat cunoștințe prin studiu individual, sau prin schimb de cunoștințe cu ceilalți (cărți de specialitate, conferințe) sau au participat la cursuri de informatică la diferite firme.

Sfîrșitul anilor ’70

Servere care au fost folosite în principal în universități (aveau o mare capacitate și eficiență), au fost completate de calculatoarele personale, care erau suficiente pentru nivele mai

Pregătirea profesorilor în arta calculatoarelor și integrarea acesteia în cursurile lor.

Tehnologii informaționale și de comunicație (ICT)

Instruirea asistată de calculator asigură o învățare individualizată, oferind posibilitatea realizării concomitente și imediate a mai multor evenimente și obiective didactice. Receptarea, înțelegerea, întărirea (stocarea), aplicarea și evaluarea pe baza cărora se realizează reglajul (autoreglajul), asigură conexiunea inversă (feedback-ul).

Progresul incredibil de rapid în tehnologia comunicării și a informației a scos la iveală numeroase posibilități pentru învățămînt. În ceea ce privește comunicarea dintre profesori și studenți învățămîntul la distanță joacă un rol esențial. În lumea reală nu există dubii asupra necesității de învățămînt continuu, ce durează toată viața. Apariția de noi tehnologii educaționale influențează în mod semnificativ învățămîntul la distanță.

Învățămîntul la distanță este o formă de multimedia de autoinstruire controlată, în care profesorii sunt, fizic, separați de studenți, cea mai mare parte a cursului. Este un învățămînt cu un grad mare de individualitate, unde multimedia înseamnă folosirea tuturor tehnologiilor disponibile de comunicare și informare prin care subiectul nu numai că este prezentat, dar poate de asemenea, să fie controlat și testat.

Cursurile educaționale sunt cele care reprezintă o unitate parțială în cadrul unei educații de o viață. Este vorba de părți relativ separate ale subiectului, cum ar fi probleme, cerințe și teste divizate în module. Modulele instrucționale pot lua forme de multimedia și pot fi conținute în fotografii, videoclipuri, animație, secvențe fonice, referințe liniare precum și hipertextuale etc.. Prin intermediul Internetului materialele necesare sunt distribuite participanților la curs. Fiecare participant va fi capabil să se autoevalueze completînd diferite cerințe de studiu. Există diferite tipuri de evaluare. Participanții au diferite teme de lucru prin care își pot testa îndemînarea, pot înțelege diferite legături și își pot folosi abilitățile într-un anumit domeniu. Acestea ar fi principiile de bază ale educației la distanță (E-learning). În procesul educației la distanță un profesor are rolul unui tutore. Rolul principal al profesorului este acela de a evalua proiectele independente ale studenților ca și de a-i informa despre rezultatele obținute, de a le răspunde la întrebări și a le da sfaturi.

Forma de învățămînt la distanță este, în mod evident, justificată ca formă de învățămînt la universitățile din viitor. Poate fi folosită, de asemenea, la fel de bine în pregătirea adulților. Educația nu trebuie privită doar ca o pregătie pentru un viitor loc de muncă, ci ar trebui să devină un proces continuu în viața unei persoane care vrea să fie o legătură valabilă într-o societate informatizată. Dacă tehnologia educațională va merge pe drumul cel bun, studenții vor putea să realizeze diferite aplicații care să le susțină propria activitate.

Folosirea tehnologiilor de comunicație și informație (ICT) moderne și a rețelelor de calculatoare globale va influența mersul lucrurilor într-o viitoare societate informatizată.

ICT va inflența în primul rînd economia, sistemul educațional, administrativ, social și căutarea de informație cu știința și înțelegerea subiectului?

Cum să luăm un cadru de lucru pentru schimbarea și împărtășirea de experiență în mijlocul studenților, profesorilor și a persoanelor interesate?

Din ideile care sunt disponibile în acest moment despre societatea informatizată avem următorul răspuns: pentru fiecare persoană, care vrea să se afirme, este necesară învățarea de-a lungul întregii vieți (life long education). Rolul școlii va fi să-l pregătească pentru acest lucru, să învețe persoana cum să învețe.

Caracteristici ale învățării asistate de calculator

Învățarea asistată de calculator are următoarele caracteristici:

asigură unitatea organizării între funcția de comunicare, stocare și control cît și obiectivitatea evaluării

sporește ritmul învățării și reduce timpul de studiu

scutește profesorul de o serie de acte didactice de rutină, pe care le pot îndeplini cu succes calculatoarele

necesită studiul și îmbunătățirea manualelor și altor materiale bibliografice

instruirea asistată de calculator realizează o evaluare obiectivă și corectă

Principii ale instruirii asistate de calculator

Forme de tehnologie variate sunt folosite tot mai des în sisteme de învățare și predare. Un obiectiv major al acestor sisteme este acela de a potența cunoștințele și îndemînarea utilizatorilor pe domenii de aplicație particularizate. Cunoștințele se dovedesc a fi un rezultat al învățării implicite și explicite. Pe măsură ce experiența noastră crește într-un anumit domeniu, ”automatismele” sunt dezvoltate și ne bazăm mai puțin pe învățarea explicită. De aceea privim îndemînarea ca o abilitate pe care fiecare din noi o posedă și care poate fi folosită pentru a completa domenii cu care ne confruntăm. Nivelurile îndemînării pe care le posedă o persoană afectează în mod critic ”calitatea soluției”. Există trei tipuri de deprinderi/ îndemînări de bază: perceptibilă, cognitivă și motrice. Fiecare din cele trei feluri de deprinderi este puternic influențată de modelele mentale pe care le desfășurăm ca rezultat al experienței educaționale. De aceea, se consideră că cercetarea în dezvoltarea modelelor mentale este o cerință fundamentală dacă trebuie să se cîștige o deprindere (înțelegere) a predării și învățării asupra dezvoltării cognitive a creierului uman.

Argument

Lărgirea cadrului de aplicare a informaticii a dus la implicarea acesteia și ăn domeniul educației, una din acestea este activitatea de învățare și evaluare prin intermediul calculatorului.

Dezvoltarea științei și tehnicii pe plan internațional a însemnat adoptarea acestei metode de evaluare online.

Tema dezbătută în prezenta lucrare –”Testare online” se adresează atât cadrelor didactice din învățământul universitar, dar și studenților evaluați, întrucât procesul evaluării presupune prin definiție, legătura didactică dintre profesor și student.

Evaluarea online presupune un nou mod de a testa cunoștiințele dobândite în cadrul unui semestru, de către studenții unei facultăți, dar nu într-un mod obișnuit, prin relația directă, față în față, cum este în prezent la noi în țară, procesul evaluării. Prin noua metodă propusă, relația indirectă, prin intermediul calculatorului ia locul celei directe.

Folosirea acestei modalități de evaluare are atât atuuri, cât și inconveniente.

Dintre atuuri, cel mai vizibil îl reprezintă economia timpului alocat în cazul evaluării de tipul față în față. Iar unul din cele mai plauzibile incoveniente il reprezintă subiectivismul, atât din partea cadrului didactic cât și din partea studentului.

Cerințe minime de utilizare

Analizând dotarea asociației pentru a pune în mișcare acest proiect de îmbunătățire prin ajutorul unei aplicații informatice, trebuie ca asociația să își îmbunătățească echipamentele de specialitate.

Echipamentele de specialitate necesare pentru asociație sunt următoarele:

Un calculator cu un hard-disk de la 10 sau 35 GB, procesor Intel sau AMD cu o frecvență minimă pentru a putea compila aplicația informatică.

Minim 2GB de RAM pentru calculatoare.

Tastatura, mouse și monitor.

Router pentru acces la internet.

Cele de tipul hardware sunt:

Calculator cu cerințe minime, procesor AMD sau Intel de minim 2.8GHz, minim 4GB RAM, HDD 80 GB 5200RPM, placa video ce poate fi cea integrată sau dedicată;

Router și cablu pentru internet;

Monitorul pentru calculator;

Cel puțin 3 prize.

Cerințele software nu sunt foarte greu de atins, necesar fiind:

Licența Microsoft Windows 7/8/10 sau orice sistem de operare care poate folosi aplicații web;

Licența Microsoft Office 365;

Domeniul rezervat, adresa aplicației informatice;

Host-ul aplicației informatice.

Specificații (solicitări operaționale, solicitări de actualizare date, date memorate, restricții, pe ce dispozitiv poate fi folosită

Accesarea aplicației se poate realiza de pe calculatorul unde este instalat un server web sau de pe un calculator care se poate conecta prin intermediul unei rețele la acestă adresă. Pentru rularea aplicației este necesară existența unui browser web pe calculatorul de pe care se dorește rularea aplicației, ex Google Chrome, Internet Explorer etc.

CAPITOLUL 2 CONCEPȚIE ȘI PROIECTARE

Concepție și proiectare

În proiectarea întregii aplicații am pornit de la ideea de simplitate, știindu-se că site-urile foarte complicate nu se bucura de un prea mare succes datorită dezorientării utilizatorilor. Datorită acestui fapt am urmărit o linie simplă în crearea interfeței, pentru ca aplicația să fie cât mai ușor de parcurs. Opțiunile site-ului sunt dispuse în 2 meniuri sau un meniu în funcție de interfața selectată.

Structura paginilor

Toate paginile aplicației sunt realizate dupa un model unitar. Astfel, în orice pagină se deosebesc trei zone distincte:

– Caseta meniu – dispus în partea stângă a paginii – conține legaturile către secțiuni

– Meniu orizontal – dispus în partea de sus– sunt butoanele pentru logarea studentului, profesorului și administratorului, vizualizare cursuri – aici se găsește un formular prin intermediul căruia se pot autentifica utilizatorii.

Paginile sunt împărțite în trei părți header, conținut și footer. Headerul și footerul se vor repeta în fiecare pagină, am folosit funcția include, permițând scrierea codului doar o singură dată, includerea acestuia facându-se foarte ușor

În secțiunea header am inclus logarea prin funcția fInsertLoginArea() și meniul din partea de sus a paginii prin funcția fInsertTopMenu().

În secțiunea cu conținut am inclus meniul din stânga prin funcția fInsertCategLeftMenu() și zona cu conținut.

Secțiunea footer este descrisă de funcția fInsertBottomStdText().

Toate aceste funcții sunt scrise o singură dată în fișierul functions.inc.php din folderul include și sunt apelate în paginile site-ului prin include_once("./include/functions.inc.php");

Pagina de testare a studentului are forma de mai jos, în ea nu se mai află meniul din partea de sus a paginii.

Structura formularelor

Pentru crearea unui cont de utilizator sa proiectat un cu următoarele cîmpuri din imaginea de mai jos.

Pentru autentificare sa proiectat formularul de mai jos cu cîmpurile nume și parola de utilizator.

Pentru adăugarea unei lecții sa proiectat următorul formular cu 3 cîmpuri nume curs, descriere curs și documentul care conține cursul .

Pentru adăugarea unei întrebări la un test sa proiectat următorul formular cu 6 cîmpuri nume test, descriere întrebare și cele 4 variante de răspuns

Pentru adăugarea unui test sa proiectat următorul formular cu 3 cîmpuri nume test, materia și id-ul profesorului care a adăugat testul

Structura rapoartelor

Pentru afișarea unui test din zona de administrare sa proiectat formularul cu vizualizarea întrebărilor din testul care a fost selectat.

Pentru afișarea notelor luate la un test în zona de administrare sa proiectat formularul cu vizualizarea notelor la testul care a fost selectat.

Pentru afișarea profesorilor care sunt înscriși pe site și au creat măcar un test în zona de administrare sa proiectat formularul cu vizualizarea profesorilor și a testelor propuse.

Pentru afișarea notelor luate la un testele propuse de un profesor în contul de profesor sa proiectat formularul cu vizualizarea notelor la testul selectat

Structura mesajelor

În cazul în care utilizatorul la accesarea contului nu a completat toate câmpurile, acesta este atenționat prin mesaje, cu ajutorul funcțiilor de validate JavaScript.

function fValidareInregistrare() {

if (document.getElementById("txtNumeInregistrare").value == "") {

alert ("Completati campul 'Nume Utilizator'.");

document.getElementById("txtNumeInregistrare").focus();

return false;

}

if (document.getElementById("txtParolaInregistrare").value == "") {

alert ("Completati campul 'Parola'.");

document.getElementById("txtParolaInregistrare").focus();

return false;

}

if (document.getElementById("txtParolaInregistrare").value != document.getElementById("txtParolaInregistrare2").value) {

alert ("Confirmati parola");

document.getElementById("txtParolaInregistrare2").focus();

return false;

}

if (document.getElementById("txtEmail").value == "") {

alert ("Completati campul 'Adresa Email'.");

document.getElementById("txtEmail").focus();

return false;

}

if (document.getElementById("txtEmail").value != document.getElementById("txtEmail2").value) {

alert ("Confirmati adresa email");

document.getElementById("txtEmail2").focus();

return false;

}

return true;

}

//––––––––––––––-

function fValidareActualizare() {

if (document.getElementById("txtParolaInregistrare").value == "") {

alert ("Completati campul 'Parola'.");

document.getElementById("txtParolaInregistrare").focus();

return false;

}

if (document.getElementById("txtParolaInregistrare").value != document.getElementById("txtParolaInregistrare2").value) {

alert ("Confirmati parola");

document.getElementById("txtParolaInregistrare2").focus();

return false;

}

if (document.getElementById("txtEmail").value == "") {

alert ("Completati campul 'Adresa Email'.");

document.getElementById("txtEmail").focus();

return false;

}

if (document.getElementById("txtEmail").value != document.getElementById("txtEmail2").value) {

alert ("Confirmati adresa email");

document.getElementById("txtEmail2").focus();

return false;

}

if (document.getElementById("txtAdresa").value == "") {

alert ("Completati campul 'Adresa'.");

document.getElementById("txtAdresa").focus();

return false;

}

return true;

}

CAPITOLUL 3 IMPLEMENTARE

Limbajele de programare utilizate

HTML reprezintă HyperText Markup Language.  Hypertext este textul afișat pe un computer sau pe un alt dispozitiv electronic, cu trimiteri la alte texte pe care utilizatorul le poate accesa imediat, de obicei prin apăsarea unui mouse sau prin apăsarea de taste.

În afară de text, hipertextul poate conține tabele, liste, forme, imagini și alte elemente de prezentare. Este un format ușor de utilizat și flexibil pentru a partaja informații prin Internet.

Limbajul utilizează seturi de etichete de marcare pentru a afișa textul dintr-un document, care oferă instrucțiuni browserelor web cu privire la modul în care ar trebui să apară.

HTML a fost inițial dezvoltată de Tim Berners-Lee în 1990. El este, de asemenea, cunoscut ca tatăl web-ului. În 1996. HTML a devenit, de asemenea, un standard internațional ( ISO ) în 2000. HTML5 este ultima versiune HTML.  HTML5 oferă o abordare mai rapidă și mai robustă a dezvoltării web.

Ce putem face cu codul HTML

Există mult mai multe lucruri pe care le putem face cu codul HTML.

Putem publica documente online cu text, imagini, liste, tabele etc.

Putem accesa resursele web, cum ar fi imagini, videoclipuri sau alte documente HTML prin intermediul hiperlinkurilor.

Putem crea formulare pentru a colecta date ale utilizatorilor, cum ar fi numele, adresa de e-mail, comentariile etc.

Putem include imagini, clipuri video, clipuri audio, filme flash, aplicații și alte documente HTML direct în interiorul unui document HTML.

Putem crea o versiune offline a site-ului. care funcționează fără internet.

Putem stoca date în browserul web și să le accesăm mai târziu.

Putem găsi locația curentă a vizitatorului site-ului nostru web.

Adăugarea de stiluri la elementele HTML

Informațiile despre stil pot fi atașate fie ca un document separat, fie sunt încorporate în documentul HTML. Sunt trei metode de implementare a informațiilor de styling în documentul HTML (de la cea mai înaltă la cea mai mică prioritate).

Stiluri inline – Utilizând atributul de style în eticheta de început HTML.

Stil încorporat – Folosind elementul <style> din secțiunea cap a documentului.

Foaie de stil externă – Folosind elementul <link> , îndreptându-se către un fișier CSS extern.

Formularul în HTML

Formularele HTML sunt necesare pentru a colecta diferite date ale utilizatorilor, cum ar fi date de contact : numele, adresa de e-mail, numere de telefon sau detalii cum ar fi informații despre cărțile de credit etc.

Formularele conțin elemente speciale numite controale cum ar fi casetele text, casetele de selectare, butoanele radio, butoanele de trimitere etc. Utilizatorii completează în general un formular prin modificarea comenzilor, de exemplu prin introducerea textului, selectarea articolelor etc. și trimiterea acestui formular la un server web pentru procesare.

Eticheta <form> este utilizată pentru a crea un formular HTML. Iată un exemplu simplu de formular de autentificare:

<form>

<FIELDSET>

<legendă> Log in </ legend>

<label> Nume de utilizator: <input type = "text" > </ label>

<label> Parola: <input type = "password" > </ label>

<input type = "submit" value = "Trimiteți" >

</ FIELDSET>

</ form>

CSS reprezintă foi de stil cascadă. CSS este un limbaj standard al foilor de stil utilizat pentru descrierea prezentării (adică aspectul și formatarea) paginilor web.

Înainte de CSS, aproape toate atributele de prezentare ale documentelor HTML au fost conținute în marcajul HTML (în interiorul tagurilor HTML); toate culorile fontului, stilurile de fundal, alinierile elementului, marginea și dimensiunile trebuiau să fie descrise în mod explicit în HTML.

Ca urmare, dezvoltarea site-urilor mari a devenit un proces lung și costisitor, deoarece informațiile despre stil au fost adăugate în mod repetat pe fiecare pagină a site-ului web.

Pentru a rezolva această problemă, CSS a fost introdus în 1996 de Consorțiul World Wide Web (W3C), care deține standardul. CSS a fost conceput pentru a permite separarea prezentării și conținutului. Acum, designerii web pot muta informația de formatare a paginilor web într-o foaie de stil separată, ceea ce are ca rezultat o marcare HTML mult mai simplă și o mai bună întreținere.

CSS3 este ultima versiune a CSS-ului. CSS3 adaugă câteva noi caracteristici de stil pentru a îmbunătăți capacitățile de prezentare web.

Ce Putem face cu CSS

Există mult mai multe lucruri pe care le putem face cu CSS.

Putem aplica cu ușurință aceleași reguli de stil pe mai multe elemente.

Putem controla prezentarea mai multor pagini ale unui site web cu o singură foaie de stil.

Putem prezenta aceeași pagină în mod diferit pe diferite dispozitive.

Putem modela stări dinamice ale elementelor, cum ar fi hover, focus, etc., care nu este posibil altfel.

Putem schimba poziția unui element pe o pagină web fără a schimba marcajul.

Putem modifica afișarea elementelor HTML existente.

Putem transforma elemente precum scalarea, rotirea, înclinarea, etc. în spațiul 2D sau 3D.

Putem crea efecte de animație și tranziții fără a utiliza JavaScript.

Putem crea o versiune prietenoasă pentru imprimare a paginilor dvs. web.

Lista nu se termină aici, există multe alte lucruri interesante pe care le putem face cu CSS.

Avantajele utilizării CSS

Cel mai mare avantaj al CSS este că permite separarea stilului și aspectului de conținutul documentului. Iată câteva avantaje.

CSS salvează o mulțime de timp – CSS oferă o mulțime de flexibilitate pentru a seta proprietățile de stil ale unui element. Putem scrie CSS o dată; și apoi același cod poate fi aplicat grupurilor de elemente HTML și poate fi reutilizat și în mai multe pagini HTML.

Ușor de întreținut – CSS oferă un mijloc simplu de a actualiza formatarea documentelor și de a menține coerența în mai multe documente. Deoarece conținutul întregului set de pagini web poate fi ușor controlat folosind una sau mai multe foi de stil.

Pagini încărcate mai rapid – CSS permite mai multor pagini să împărtășească informațiile de formatare, ceea ce reduce complexitatea și repetiția în conținutul structural al documentelor. Reduce semnificativ dimensiunea transferului de fișiere, ceea ce duce la o încărcare mai rapidă a paginilor.

Stiluri superioare pentru HTML – CSS are mult mai multe posibilități de prezentare decât HTML și oferă un control mult mai bun asupra aspectului paginilor. web.

Compatibilitatea cu mai multe dispozitive – CSS permite, de asemenea, optimizarea paginilor web pentru mai multe tipuri de dispozitive sau medii. Folosind CSS, același document HTML poate fi prezentat în diferite stiluri de vizualizare pentru diferite dispozitive de randare, cum ar fi desktop, telefoane mobile etc.

Sintaxă

Regulile CSS au două părți principale, un selector și una sau mai multe declarații:

Declarațiile care apar în blocul care urmează selectorului pot fi aplicate tuturor elementelor unui anumit tip sau numai acelor elemente care corespund unui anumit atribut.

Fiecare declarație constă dintr-o proprietate și o valoare. Proprietatea este atributul de stil pe care dorim să-l modificăm; ar putea fi culori sau margini etc. Fiecare proprietate are o valoare, de exemplu proprietatea de culoare poate avea valoare fie blue fie #0000FF etc.

h1 { culoare : albastru ; text-align : center ;}

Pentru a face CSS mai ușor de citit, putem pune o declarație pe fiecare rând, astfel:

h1 {

color : blue ;

text-align : center ;

}

În exemplul de mai sus h1 este un selector, color și text-align sunt proprietăți și blue și center sunt valorile corespunzătoare acestor proprietăți.

JavaScript

JavaScript este cel mai popular și mai utilizat limbaj de scripting pe partea clientului. Scenariul de pe partea clientului se referă la scripturile care se execută în browserul dvs. Web. JavaScript este proiectat pentru a adăuga interactivitate și efecte dinamice paginilor web prin manipularea conținutului returnat de la un server web.

JavaScript a fost inițial dezvoltat ca LiveScript de Netscape la mijlocul anilor 1990. Acesta a fost mai târziu redenumit la JavaScript în 1995 și a devenit standardul ECMA în 1997. Acum, JavaScript este limbajul standard al limbajului de scripting pentru aplicațiile bazate pe web și este susținut de practic toate browserele web disponibile astăzi, cum ar fi Google Chrome, Mozilla Firefox, Apple Safari etc.

JavaScript este un limbaj orientat pe obiecte și are, de asemenea, unele asemănări în sintaxa cu limbajul de programare Java. Dar, JavaScript nu este în nici un fel legat de Java.

JavaScript este menținut oficial de ECMA (European Computer Manufacturers Association) ca ECMAScript. ECMAScript 6 (sau ES6) este cea mai recentă versiune majoră a standardului ECMAScript.

Ce Putem face cu JavaScript

Există mult mai multe lucruri pe care le putem face cu JavaScript.

Putem modifica conținutul unei pagini web prin adăugarea sau eliminarea elementelor.

Putem modifica stilul și poziția elementelor pe o pagină web.

Putem monitoriza evenimente precum clic pe mouse, mișcări etc. și reacții la acestea.

Putem efectua și controla tranzițiile și animațiile.

Putem crea ferestre de alertă pop-up pentru a afișa utilizatorilor informații sau mesaje de avertizare.

Putem efectua operații bazate pe intrările utilizatorilor și putem afișa rezultatele.

Putem valida intrările utilizatorilor înainte de a le trimite la server.

Lista nu se termină aici, există multe alte lucruri interesante pe care le putem face cu JavaScript.

Adăugarea JavaScript în aplicațiile Web

Există de obicei trei moduri de a adăuga JavaScript la o pagină Web:

Încărcarea codului JavaScript între o pereche de etichete <script> și </script> .

Crearea unui fișier JavaScript extern cu extensia .js și apoi încărcarea în cadrul paginii prin atributul src al etichetei <script> .

Plasarea codului JavaScript direct în interiorul unei etichete HTML utilizând atributele de etichete speciale, cum ar fi onclick , onmouseover , onkeypress , onload , etc.

Următoarele secțiuni vor descrie în detaliu fiecare dintre aceste proceduri:

Încărcarea codului JavaScript

Putem încorpora codul JavaScript direct în paginile web plasându-l între etichetele <script> și </script> . Eticheta <script> indică browser-ului că instrucțiunile conținute vor fi interpretate ca script executabil și nu HTML.

PHP reprezintă Hypertext Preprocessor. PHP este un limbaj de scripting foarte popular și folosit pe scară largă de server, pentru a scrie pagini Web generate dinamic. PHP a fost inițial creat de Rasmus Lerdorf în 1994. A fost inițial cunoscut sub numele de Personal Home Page.

Scripturile PHP sunt executate pe server și rezultatul este trimis în browserul web ca HTML simplu. PHP poate fi integrat cu numeroase baze de date populare, inclusiv MySQL, PostgreSQL, Oracle, Microsoft SQL Server, Sybase și așa mai departe. Actuala versiune a PHP este 7.

PHP este un limbaj foarte puternic, dar ușor de învățat și de utilizat

Ce Putem face cu PHP

Există mult mai multe lucruri pe care le putem face cu PHP.

Putem genera pagini și fișiere dinamic.

Putem crea, deschide, citi, scrie și închide fișiere pe server.

Putem colecta date dintr-un formular web, cum ar fi informații despre utilizator, e-mail, telefon, etc.

Putem trimite e-mailuri utilizatorilor site-ului dvs. Web.

Putem trimite și primi cookie-uri pentru a urmări vizitatorul site-ului dvs. Web.

Putem stoca, șterge și modifica informații din baza de date.

Putem restricționa accesul neautorizat la site-ul dvs. Web.

Putem cripta datele pentru transmiterea în siguranță pe internet.

Avantajele PHP față de alte limbaje

Ușor de învățat: PHP este ușor de învățat și de utilizat. Pentru programatorii începători care tocmai au început în dezvoltarea web-ului, PHP este adesea considerat drept alegerea preferabilă a limbajului de învățat.

Open source: PHP este un proiect open-source. Este dezvoltat și întreținut de o comunitate mondială de dezvoltatori care fac codul sursă disponibil pentru descărcare și utilizare.

Portabilitate: PHP rulează pe diferite platforme, cum ar fi Microsoft Windows, Linux, Mac OS etc. și este compatibil cu aproape toate serverele folosite astăzi, cum ar fi Apache, IIS etc.

Performanță rapidă: scripturile scrise în PHP rulează de obicei sau rulează mai repede decât cele scrise în alte limbaje de scripting precum ASP, Ruby, Python, Java etc.

Vast Community: Întrucât PHP este susținut de comunitatea mondială, găsirea documentației referitoare la PHP online este extrem de ușoară.

Serverul de baze de date MySQL oferă mai multe avantaje:

MySQL este ușor de folosit, dar extrem de puternic, rapid, sigur și scalabil.

MySQL rulează pe o gamă largă de sisteme de operare, inclusiv UNIX sau Linux, Microsoft Windows, Apple Mac OS X și altele.

MySQL suportă standardul SQL (Language Structured Query Language).

MySQL este soluția ideală pentru bazele de date atât pentru aplicațiile mici, cât și pentru cele mari.

MySQL este dezvoltată și distribuită de Oracle Corporation.

MySQL include straturi de securitate a datelor care protejează datele sensibile de la intruși.

Baza de date MySQL stochează datele în tabele ca și alte baze de date relaționale. Un tabel este o colecție de date conexe și este împărțită în rânduri și coloane.

Fiecare rând dintr-o tabelă reprezintă o înregistrare de date care este în mod inerent conectată una cu alta, cum ar fi informații referitoare la o anumită persoană, în timp ce fiecare coloană reprezintă un câmp specific, cum ar fi id , first_name , last_name , e-mail etc. Structura unei simple MySQL tabelul care conține informațiile generale ale persoanei poate arăta cam așa:

+ –- + –––– + –––– + ––––––- – +

| id | first_name | last_name | email |

+ –- + –––– + –––– + ––––––- – +

| 1 | Peter | Parker | peterparker@mail.com |

| 2 | John | Rambo | johnrambo@mail.com |

| 3 | Clark | Kent | clarkkent@mail.com |

| 4 | John | Carter | johncarter@mail.com |

| 5 | Harry | Potter | harrypotter@mail.com |

+ –- + –––– + –––– + ––––––- – +

Conectarea la serverul de baze de date MySQL

În PHP folosim funcția mysqli_connect() pentru conectarea la baza de date . Toată comunicarea dintre PHP și serverul de bază de date MySQL are loc prin această conexiune.  Sintaxele de bază pentru conectarea la MySQL utilizând extensiile MySQLi

$ link = mysqli_connect ("nume de gazdă", "nume de utilizator", "parolă", "bază de date");

Închiderea conexiunii serverului de baze de date MySQL

Conexiunea la serverul de baze de date MySQL va fi închisă automat de îndată ce se termină executarea scriptului. Cu toate acestea, dacă dorim să închidem mai devreme, putem face acest lucru prin simpla apelarea funcției PHP mysqli_close()

Pentru a crea o nouă bază de date în MySQL se folosește CREATE DATABASE  .

Un tabel organizează informațiile în rânduri și coloane.

Instrucțiunea CREATE TABLE este pentru crearea unui tabel.

Instrucțiunea INSERT INTO este utilizată pentru a insera noi rânduri într-o tabelă de baze de date.

Un exemplu care introduce un rând nou în tabelul de persoane,specificând valori pentru câmpurile first_name , last_name și email .

Selectarea datelor din tabele de baze de date

Instrucțiunea SQL SELECT este utilizată pentru a selecta înregistrările din tabelele bazei de date. Sintaxa sa de bază este după cum urmează:

SELECT column1_name , column2_name , columnN_name FROM nume_tabel ;

Filtrarea înregistrărilor

Clauza WHERE este folosită pentru a extrage numai acele înregistrări care îndeplinesc o condiție specificată.

Sintaxa de bază a clauzei WHERE :

SELECT nume_coloane FROM table_name WHERE valoarea operatorului column_name

Actualizarea datelor din tabelele bazei de date

Instrucțiunea UPDATE este utilizată pentru modificarea sau modificarea înregistrărilor existente într-o tabelă de baze de date. Această declarație este utilizată în mod obișnuit împreună cu clauza WHERE pentru a aplica modificările doar acelor înregistrări care se potrivesc unor criterii specifice.

Sintaxa de bază a UPDATE poate fi dată cu:

UPDATE nume_tabel SET SET1 = valoare, coloana2 = valoare2, … WHERE column_name = some_value

Ștergerea datelor din tabelele bazei de date

După introducerea înregistrărilor în tabele, Putem șterge înregistrările dintr-un tabel folosind instrucțiunea SQL DELETE . În mod obișnuit, se utilizează în conjugarea cu clauza WHERE pentru a șterge numai acele înregistrări care se potrivesc cu anumite criterii sau condiții.

Sintaxa de bază a instrucțiunii DELETE poate fi dată cu:

Delete table_name WHERE column_name = some_value

Noțiuni și concepte generale despre securitatea web

Odată cu avansarea și dezvoltarea tehnologiilor și aplicațiilor web a apărut și o nouă gama de vulnerabilități de securitate. Noile tehnologii web apărute au făcut posibilă apariția unor noi moduri în care aplicațiile web pot fi atacate. Multe din ele au dispărut datorită schimbărilor majore venite odată cu noile web browsere dar vulnerabilitățile de bază au rămas. Cele mai periculoase tipuri de atacuri rămânând cele în care se obține accesul la back-end-ul aplicației unde sunt stocate date sensibile.

În ciuda folosirii tehnologiei Secure Socket Layer (SSL) pentru a preveni accesul neautorizat la informații sensibile și a standardului Payment Card Industry (PCI), majoritatea aplicațiilor web sunt nesigure. În cartea ”The Web Application Hacker’s Handbook”, Dafydd Stuttard și Marcus Pinto explică cum au testat pe o durata de 4 ani între 2007 și 2011 aplicații web și au publicat cele mai comune vulnerabilități cu procentele aferente:

– Vulnerabilitate la autentificare (62%) – această categorie de vulnerabilitate se referă la probleme cu mecanismul de logare din cadrul aplicației care ar putea permite unui atacator să ghicească parolele slabe, să folosească un atac brute-force sau să sară peste pasul de login

– Vulnerabilitate la controlul accesului (71%) – acest tip de vulnerabilitate se referă la cazurile în care aplicația nu protejează corespunzător datele sensibile ale utilizatorilor permițându-le atacatorilor să aibă acces la aceste date de pe server

– SQL injection (32%) – această vulnerabilitate permite atacatorului să introducă cod malițios în câmpurile din formulare permițându-i astfel să extragă informații din baza de date sau să modifice baza de date

– Cross-site scripting (94%) – acest tip de vulnerabilitate permite atacatorului să atace utilizatori ai aplicației aflându-le datele de autentificare

– Scurgere de informații (78%) – apare în cazuri în care aplicațiile divulgă informații sensibile pe care atacatorii le pot folosi pentru a lansa atacuri împotriva aplicației

– Falsificarea request-urilor cross-site (92%) – această vulnerabilitate se referă la faptul că utilizatorii aplicației pot face fără să dorească diverse acțiuni în cadrul aplicației. Vulnerabilitatea permite unui website malițios visitat de utilizatorul victimă de a interacționa cu aplicația și a face diverse acțiuni pe care utilizatorul nu le dorește

Figura 3.1 Incidența celor mai comune vulnerabilități web

3.2.1 SQL Injection

SQL Injection sau injectarea de cod SQL este o vulnerabilitate foarte comună în aplicațiile web. Este îngrijorător faptul că astfel de vulnerabilități sunt prezente în aplicațiile e-commerce care utilizează și stochează date sensibile precum numere de cărți de credit/debit. Astfel de atacuri nu se rezumă doar la modificarea sau furtul datelor din baza de date, ci pot duce chiar și la compromiterea serverului sau rețelei. Compromiterea bazei de date este doar primul pas pentru un atacator.

SQL injection-ul funcționează în felul următor: un atacator trimite prin câmpurile formularelor sau în alt mod, date malițioase care sunt utilizate de aplicație pentru a construi o interogare SQL folosind concatenarea de strîng-uri. Astfel atacatorii pot avea acces la date confidențiale despre clienții aplicației respective sau chiar să cumpere mai ieftin unele produse.

Limbajele de programare care sunt afectate de către această vulnerablitate sunt cele care sunt folosite la realizare legăturii cu baza și anume limbaje back-end precum PHP, Java, ASP.NET, Perl, Python, Ruby.

Un exemplu clasic de SQL injection folosit pentru limbajul PHP așa cum a fost prezentat în cartea 19 Deadly Sins of Software Security:

<?php

$db = mysql_connect("localhost","root","$$sshh…!");

mysql_select_db("Shipping",$db);

$id = $HTTP_GET_VARS["id"];

$qry = "SELECT ccnum FROM cust WHERE id=%id%";

$result = mysql_query($qry, $db);

if($result){

echo mysql_result($result,0,"ccnum");

} else {

echo "No result! " . mysql_error();

}

?>

Orice aplicație web care acceptă input de la utilizatori, nu execută validări pe aceste inputuri, folosește aceste date pentru a face interogări către baza de date și folosește concatenare de strîng-uri pentru a construi interogări SQL prezintă risc foarte ridicat pentru eventuale atacuri de SQL injection.

3.2.2 Cross-site scripting

Dacă atacurile de tipul SQL injection au ca țintă partea de server/back-end a aplicației, atacurile de tipul cross-site scripting sau XSS au ca țintă utilizatorii aplicației care este atacată. Vulnerabilitatea la astfel de atacuri este cea mai răspândită printre aplicațiile web și afectează inclusiv aplicații a căror securitate ar trebui să fie fundamentală precum aplicațiile băncilor.

Există mai multe tipuri de vulnerabilități pentru cross-site scripting și ar putea fi împărțite în trei categorii mari: reflectate, stocate și bazate pe DOM (Document Object Model).

Vulnerabilitățile cross-site scripting pot fi exploatate în mai multe feluri dar unul dintre cele mai simple tipuri de atac este cel în care atacatorul obține accesul la tokenul de sesiune pentru un utilizator autentificat. Având acces la acest token atacatorul are acces la toate funcționalitățile aplicației și toate datele la care are acces utilizatorul autentificat.

Figura 3.2 Reprezentarea etapelor unui atac XSS reflectat

Vulnerabilitățile cross-site scripting stocate sunt prezente la aplicațiile in care utilizatorii pot interacționa între ei sau în care utilizatorii cu drepturi de administratori pot accesa date despre utilizatorii aplicației sau pot modifica informațiile utilizatorilor.

Figura 3.3 Reprezentarea etapelor unui atac XSS stocat

Ultima categorie de vulnerabilități cross-site scripting este cea bazată pe DOM (DOM-based):

Figura 3.3 Reprezentarea etapelor unui atac XSS bazat pe exploatarea DOM-ului

Codul sursă

În directorul admin sunt fișierele din zona de administrare. Aici are acces doar administratorul după ce introduce parola de logare.

Imaginele sunt stocate în folderul images, fișierele ce descriu stilurile CSS sunt în folderol css.,. În js sunt fișierele javascript scrise pentru validările formularelor.

Funcțiile importante sunt scrise în directorul include. Conectarea la baza de date se realizează cu funcția prezentată în figură următoare:

<?php

require_once("config.inc.php");

switch ($connType) {

case "local" : {

$server_name = "localhost";

$db_name = "testare";

$db_user = "root";

$db_pass = "";

break;

}

}

//–––––––––––––––––––––––––––––-

function fDBConnect() {

global $server_name;

global $db_user;

global $db_pass;

global $db_name;

$myConn = mysql_connect($server_name, $db_user, $db_pass) or

die("Error while connecting to db: " . mysql_error());

$res = mysql_select_db($db_name);

if (!$res)

die ("Error while opening the db");

return $myConn;

}

//–––––––––––––––––––––––––––––-

function fDBClose($link) {

mysql_close ($link);

}

Se observă că acest fișier include un alt fișier numit config.inc.php ce conține setările globale ale aplicației.

Parametrii folosiți pentru conectarea la baza de date sunt:

numele serverului MySQL și numele bazei de date;

numele utilizatorului și parola acestuia

Folderul include conține

functions.inc – aici găsim funcțiile pentru inserarea meniurilor

function fInsertMetaTags()- sunt introduse metatagurile

function fInsertCSS()- se găsește fișierul css al aplicației pentru partea de admin și utilizator

function fInsertCSS() {

echo "<link type=\"text/css\" rel=\"stylesheet\" href=\"./css/style.css\" />\n";

echo "<link type=\"text/css\" rel=\"stylesheet\" href=\"./css/style1.css\" />\n";

}

function fInsertJS()- se găsesc funcțiile care validează formularele

function fInsertLoginArea()-definește meniul de logare al aplicației

În directorul JS se găsesc funcțiile JavaScript care validează formularele:

<?php

require_once("mysql.inc.php");

//–––––––––––––––––––––––––––––––––––

function fInsertMetaTags() {

echo "<meta http-equiv=\"content-type\" content=\"text/html; charset=utf-8\" />\n";

echo "<meta name=\"Revisit-after\" content=\"2 days\" />\n";

echo "<meta name=\"Robots\" content=\"index, follow\" />\n";

echo "<meta name=\"Rating\" content=\"General\" />\n";

}

//–––––––––––––––––––––––––––––––––––

function fInsertCSS() {

echo "<link type=\"text/css\" rel=\"stylesheet\" href=\"css/style.css\" />\n";

echo "<link type=\"text/css\" rel=\"stylesheet\" href=\"css/bootstrap.min.css\" />\n";

echo "<link type=\"text/css\" rel=\"stylesheet\" href=\"css/bootstrap-theme.min.css\" />\n";

echo "<link type=\"text/css\" rel=\"stylesheet\" href=\"css/main.css\" />\n";

echo "<link type=\"text/css\" rel=\"stylesheet\" href=\"css/font.css\" />\n";

echo "<link type=\"text/css\" rel=\"stylesheet\" href=\"css/style1.css\" />\n";

//echo"<linkrel=\"stylesheet\"href=\"https://maxcdn.bootstrapcdn.com/bootstrap/3.4.0/css/bootstrap.min.css\" />\n";

}

//–––––––––––––––––––––––––––––––––––

function fInsertJS() {

echo "<script type=\"text/javascript\" src=\"./js/functions.js\"></script>\n";

echo "<script type=\"text/javascript\" src=\"./js/login.js\"></script>\n";

}

//–––––––––––––––––––––––––––––––––––

function fInsertDocType() {

echo "<?xml version=\"1.0\" encoding=\"UTF-8\"?>\n";

echo "<!DOCTYPE html PUBLIC \"-//W3C//DTD XHTML 1.0 Strict//EN\" \"http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd\">\n";

echo "<html xmlns=\"http://www.w3.org/1999/xhtml\" xml:lang=\"en\" lang=\"en\">\n";

}

Un alt exemplu de funcție utilizată pentru secțiunea de autentificare:

function fInsertLoginArea() {

echo "<div id=\"loginarea\">\n";

$intIdUtilizator =isset($_SESSION['intIdUtilizator']) ? $_SESSION['intIdUtilizator'] : '';

if ($intIdUtilizator > 0) { // user is authenticated, display name & logout link

echo "Bine ai venit " . $_SESSION['strNumeUtilizator'] . " &nbsp; <a class=\"TopMyAccountLink\" href=\"contul_meu.php\">:: Contul meu</a> &nbsp; | &nbsp; <a class=\"LogoutLink\" href=\"execute.php?action=logout\">:: Iesire</a>\n";

}

else { // user is not authenticated, display login form

echo "<form action=\"execute.php?action=login\" method=\"post\" style=\"display: inline;\" onsubmit=\"return fValidateLogin();\">\n";

echo "<fieldset style=\"padding: 0px; border: 0px;\">\n";

echo "<label class=\"loginlabel\" for=\"txtNumeUtilizator\">Utilizator:</label>\n";

echo "<input class=\"logininput\" type=\"text\" name=\"txtNumeUtilizator\" id=\"txtNumeUtilizator\" maxlength=\"32\" />\n";

echo "<label class=\"loginlabel\" for=\"txtParola\">Parola:</label>\n";

echo "<input class=\"logininput\" type=\"password\" name=\"txtParola\" id=\"txtParola\" maxlength=\"32\" />\n";

echo "<input type=\"submit\" alt=\"Autentificare\" class=\"loginbutton\" name=\"cmdLogin\" id=\"cmdLogin\" value=\"Autentificare\" />\n";

echo "</fieldset>\n";

echo "</form>\n";

}

echo "</div>\n";

}

Se testează dacă utilizatorul este autentificat.

function fInsertDocType() {

echo "<?xml version=\"1.0\" encoding=\"UTF-8\"?>\n";

echo "<!DOCTYPE html PUBLIC \"-//W3C//DTD XHTML 1.0 Strict//EN\" \"http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd\">\n";

echo "<html xmlns=\"http://www.w3.org/1999/xhtml\" xml:lang=\"en\" lang=\"en\">\n";

}

//–––––––––––––––––––––––––––––––––––

function fInsertLoginArea() {

echo "<div id=\"loginarea\">\n";

$intIdUtilizator =isset($_SESSION['intIdUtilizator']) ? $_SESSION['intIdUtilizator'] : '';

if ($intIdUtilizator > 0) { // user is authenticated, display name & logout link

echo "Bine ai venit " . $_SESSION['strNumeUtilizator'] . " &nbsp; <a class=\"TopMyAccountLink\" href=\"contul_meu.php\">:: Contul meu</a> &nbsp; | &nbsp; <a class=\"LogoutLink\" href=\"execute.php?action=logout\">:: Iesire</a>\n";

} else { // user is not authenticated, display login form

echo "<form action=\"execute.php?action=login\" method=\"post\" style=\"display: inline;\" onsubmit=\"return fValidateLogin();\">\n";

echo "<fieldset style=\"padding: 0px; border: 0px;\">\n";

echo "<label class=\"loginlabel\" for=\"txtNumeUtilizator\">Utilizator:</label>\n";

echo "<input class=\"logininput\" type=\"text\" name=\"txtNumeUtilizator\" id=\"txtNumeUtilizator\" maxlength=\"32\" />\n";

echo "<label class=\"loginlabel\" for=\"txtParola\">Parola:</label>\n";

echo "<input class=\"logininput\" type=\"password\" name=\"txtParola\" id=\"txtParola\" maxlength=\"32\" />\n";

echo "<input type=\"submit\" alt=\"Autentificare\" class=\"loginbutton\" name=\"cmdLogin\" id=\"cmdLogin\" value=\"Autentificare\" />\n";

echo "</fieldset>\n";

echo "</form>\n";

}

echo "</div>\n";

Directorul JS conține funcții JavaScript necesare în majoritatea cazurilor pentru validări ale formularelor:

Câteva acțiuni efectuate de către utilizatori sunt scrise în fișierul execute.php.

– apoi se verifică dacă utilizatorul este autentificat și este de tip administrator pentru a valida accesul la aceste acțiuni și se realizează conectarea la baza de date:

– apoi urmează funcții precum înregistrarea unui utilizator

Spre exemplu, pentru a afișa testele am introdus un form care preia toate întrebările, în variabila $intrebare este numele testului, în $variantaa prima variantă de răspuns, $variantab a doua variantă de răspuns, $variantac a treia variantă de răspuns, $variantad ultima variantă de răspuns

<?php

$strSQL = SELECT * FROM questions WHERE questions.test_id=$intIdProd $result = mysql_query($strSQL);

echo "<form action=\"#\" method='post'><table width=\"100%\" border=\"0\">";

$i=0;

$j=1;

while ($row = mysql_fetch_array($result))

{

$codi = $row['id'];

$intrebare = trim($row['question_name']);

$variantaa = trim($row['answer1']);

$variantab=trim($row['answer2']);

$variantac = trim($row['answer3']);

$variantad = trim($row['answer4']);

$variantacorecta = trim($row['answer']);

echo "<tr><td><table width=\"100%\" border=\"0\"><tr>";

echo " ";

echo "<td align=\"left\" colspan=\"4\" >$j.$intrebare <input type=\"hidden\" name=\"cod$i\" value=\"$codi\"/>$codi</td></tr>";

echo "<tr><td align=\"center\">$variantaa <input type=\"checkbox\" name=\"ac$i\" value=\"1\"/></td>";

echo "<td align=\"center\">$variantab <input type=\"checkbox\" name=\"bc$i\" value=\"2\"/></td>";

if ($variantac<>NULL) echo "<td align=\"center\">$variantac <input type=\"checkbox\" name=\"cc$i\" value=\"3\"/></td>";

if ($variantad<>NULL) echo "<td align=\"center\">$variantad <input type=\"checkbox\" name=\"dc$i\" value=\"4\"/></td>";

$i++; $j++; echo "</table></td></tr>";}

echo "<tr><td colspan=\"2\" align=\"center\" height=\"80\"><input type=\"submit\" name=\"submit\" value=\"Termina\"/> </td></tr></table></form> ";

}

else{echo "Testul nu mai poate fi dat !!";}

Calcularea notei obținute se face prin preluarea datelor prin metoda POST din formularul descris anterior și inserarea variantei selectate în tabela situatieintrebari urmand ca apoi datele din această tabela sa fie trecute in note.

Baza de date

Baza de date a aplicației este făcută pe serverul de MySql și are în componența ei 11 tabele, și anume: login, profesor, student, materie, predarematerie, note, întrebări, întrebăriteste, test., situațieîntrebări, tlecții. În fiecare din aceste tabele sunt stocate informații diferite preluate de aplicație și procesate independent, creându-se astfel un site web dinamic, totul fiind introdus în tabele, putând apoi fi preluate de aplicație sau modificate de aceasta.

3.4.1 Interogări

Afișarea testului cu id nrtest și afișarea întrebărilor din testul respectiv.

Afișarea testelor propuse de un profesor.

Afișarea notelor studenților care au susținut testul nrtest.

Afișarea tuturor testelor în contul studentului și alegerea unui test pentru al susține.

Afișarea tutoror testelor din tabela test în contul admin cu toate cîmpurile: nume profesor, materie, nume test.

3.4.2 Tabele

În continuare este prezentată structura bazei de date :

1.Tabela login este folosită pentu autentificare, are urmatoarele câmpuri:

Codu – este cheie primara (nu există două inregistrări la fel) și stochează codurile profesorilor, al studenților și al administratorului

User – stochează numele cu care se autentifică utilizatorul (profesori, studenți sau administrator)

Parola – stochează parolele cu care se autentifică utilizatorii (profesori, studenți sau administrator)

Tipu – este de forma: a pentu administrator, p pentru profesori, s pentru studenți

FDatainregistrare- stochează data cînd sa inregistrat

Administratorul este adăugat în baza de date, fără a fi opțiunea de creare a contului de administrator.

2.Tabela profesor are urmatoarele câmpuri:

Codp – este cheie primara (nu există două inregistrări la fel) și stochează codurile profesorilor

Nume – stochează numele profesorilor

Prenume – stochează prenumele profesorilor

Funcție – stochează funcțiile profesorilor

3.Tabela student are urmatoarele câmpuri:

Cods – este cheie primara (nu există două inregistrări la fel) și stochează codurile studenților

Nume – stochează numele studenților

Prenume – stochează prenumele studenților

Semestrul – stochează anul în care se află studenții

4.Tabela materie are urmatoarele câmpuri:

Codmat – este cheie primara (nu există două inregistrări la fel) și stochează codurile materiilor

Denumire – stochează denumirile materiilor

Semestrul – stochează anii în care se predau materiile

5.Tabela predarematerie, indică materiile predate, are urmatoarele câmpuri:

Codmat – stochează codurile materiilor

Codp – stochează codurile profesorilor

6. Tabela note

Tabela note are urmatoarele câmpuri

Cods – stochează codurile utilizatorilor

Codt – stochează codurile testelor

Nota – stochează notele studenților

7.Tabela întrebări care are urmatoarele câmpuri:

Codi – stochează codurile întrebărilor

Codp – stochează codurile profesorilor care predau materia respectivă

Codmat – stochează codurile materiilor

Întrebare – stochează intrebările

Variantaa – stochează varianta a

Variantab – stochează varianta b

Variantac – stochează varianta c

Variantad – stochează varianta d

Variantacorecta – stochează variantele corecte

Codtest – stochează codul testului

8.Tabela situațieîntrebări care are urmatoarele câmpuri:

Codi – stochează codurile întrebărilor

CodT – stochează codurile testelor

Cods – stochează codurile utilizatorilor care se testează

Variantaaleasa – stochează variantele alese de utilizatori în momentul în care se termină examenul

9.Tabela test are urmatoarele câmpuri:

Codp – stochează codul profesorului care a creat testul

Codmat – stochează codul materiei

Nrtest- numărul testului

Numetest- numele testului

10.Tabela tlectii are urmatoarele câmpuri:

Fidlectie – stochează numărul cursului

Fnume- stochează numele cursului

Descriere- o descriere a cursului

Idp- id-ul profesorului care a încărcat cursul

3.4.3 Formulare

Formular pentru adaugare curs

Formular pentru adaugare intrebare

Formular pentru adaugare profesor

Formular pentru adaugare profesor

Formular pentru adaugare test

3.4.4 Rapoarte

Afișarea notelor studenților la un test este ilustrat mai jos

Codul sursă al raportului

Din contul de profesor se afișează întrebările unui test .

CAPITOLUL 4 TESTARE

4.1. Structura aplicației

Aplicația are structura alcătuită pe următoarele categorii de utilizatori:

Administatorul aplicației

Profesorul

Studentul

Toate tipurile de utilizatori necesită un nume și o parolă pentru autentificare, pentru care se folosesc sesiuni pentru identificarea persoanei logate. La iesirea din cont se va distruge sesiunea creată la logare.

Administratorul poate să introducă/modifice/șteargă materii din baza de date, prin intermediul aplicației, să afișeze profesorii, vizualizarea testelor create pe profesori,materii, an de studiu, afișarea diverselor situații cu notele studenților la un test. Explicat mai pe larg, el poate să adauge (modifice) prin intermediul unor form-uri date și să poate afișa diverse situații

Profesorul are posibilitatea de a vizualiza, actualiza (adăugare / modificare / ștergere) intrebările materiilor pe care le predă și de a crea un test pe un anumit domeniu, introducând întrebările testului, data la care se dă testul, durata lui,.poate să vizualizeze situația notelor, schimbarea parolei și testarea propriu-zisă a domeniiilor introduse. Notarea se face pe loc, profesorul care a creat testul putînd vedea rezultatul testului. El mai are optiunea de a vizualiza situația studenților săi

Explicat mai pe larg, el poate să adauge (modifice) prin intermediul unor form-uri date privind numele, prenumele, funcția, materiile predate, utilizator , parola. Poate crea și modifica teste , poate vedea situația notelor studenților la testele pe care le-a creat.

Studentul poate schimba datele contului personal, pe baza contului personal va face examinarea propriu-zisă a materiilor studiate în semestrul respectiv (și cărora li s-a facut test de către profesor) Testarea se finalizează în momentul în care se apasă butonul Termina (caz în care se va trimite răspunsurile indicate). Notarea se face pe loc, situația notelor fiind vazută doar de profesor.

4.2 Manual de utilizare

Aplicația ”Teste online” are ca scop principal testarea studenților la diverse materii. Ea posedă trei tipuri de utilizatori: administrator, profesor și student, care au bine definite atribuțiile fiecăruia în parte. Avantajul studentului este acela că poate da testul oriunde ar fi și profesorul primește rezultatul imediat ce studentul a terminat testul. Tema dezbătută în prezenta lucrare ”Teste online” reprezintă una din temele de actualitate ale informaticii în general, tratând modul de implementare a unui soft pentru testarea online a studenților..

Structura principală a interfeței este următoarea:

După autentificare în funcție de tipul de utilizator vor apărea funcționalitățile aplicației

Dacă utilizatorul sa logat ca student pagina va conține opțiunile pentru Actualizare informații și Teste online, Vizualizare cursuri

Dacă utilizatorul este logat ca profesor pagina va conține opțiunile Teste online și cursuri.

Dacă utilizatorul este logat ca profesor pagina va conține opțiunile pentru Creare test, Adăugare întrebări, Situație teste, Ieșire, Vizualizare teste, Adauga curs, Vizualizare cursuri, Situație studenți.

Dacă utilizatorul sa logat ca administrator pagina va conține opțiunile pentru Teste, Situația notelor la teste, profesorii care sunt încriși în aplicație, vizualizare cursuri, ieșire..

Pentru testarea funcționalității au fost introduse manual cu ajutorul phpMyAdmin date de test. Pentru formularul de login au fost folosite validări back-end care verifică existența utilizatorului în baza de date sau dacă parola introdusă este cea corectă.

Funcționalitatea de logare a fost realizată folosind sesiuni. Variabibele de sesiune stochează informații despre utilizatori pentru a fi folosite pe mai multe pagini din cadrul aplicației web.

Interfața grafică pentru pagina de schimbare a parolei este aproape identică cu interfața grafică pentru pagina de logare. În formularul de schimbare a parolei a mai apărut un input și anume cel de confirmare a noii parole. De asemenea au fost implementate validări back-end pentru formularul de verificare dacă parola actuală este corectă, dacă noua parolă se potrivește cu cea din inputul de confirmare a parolei sau dacă parola este mai lungă de 6 caractere.

Selectarea tipului de utilizator

Secțiunea student

În cazul în care utilizatorul este student – va intra în secțiunea teste ți va selecta un test

Prin accesarea unui test din fereastră se afișează întrebările din testul respectiv. Utilizatorul selectează răspunsurile pe care le consideră corecte pentru fiecare întrebare.Testul se termină după ce se apasă butonul TRIMITE care calculează și trimite nota în baza de date, nota va fi văzută de profesor și de administrator. Un test poate fi susținut de un student o dată, după testare acesta nemaiputând fi accesat.( se afișează un boton roșu cu textul TERMINAT).

Odata deschis testul, studentul nu poate părăsi pagina până când nu răspunde la întrebări. Studentul va trebui să răspundă la întrebări, prin intermediul unor checkbox-uri.

Ca și la tipul profesor și aici studentul își poate schimba parola, pentru securizarea contului, și mai are posibilitatea să iasă din contul său.

Secțiunea profesor

În această secțiune profesorul poate crea testele. Crearea unui test se face prin selectarea materiei ( poate fi selectată doar o materie pe care o predă profesorul ) , completarea următorului câmp se face cu numele testului.

– adăugarea întrebările la teste se face prin selectarea testului la care se dorește adaugarea întrebării. Se completează întrebarea, variantele de răspuns, se selectează varianta corectă și apoi se adaugă în test prin selectarea butonului Adaugă

Vizualizarea unui test se face prin selectarea testului de afișat

Situația notelor studenților care au realizat testele date de profesor este disponibilă selectând testul

Prin Iesire profesorul va părăsi aplicația.

Vizualizarea lecțiilor este accesibilă oricărui student

Secțiunea de administrare

În această secțiune administratorul poate afișa testele cu întrebări, profesorii, notele obținute de studenți.

În pagina home administratorul trebuie să se autentifice pentru a avea acces la opțiunile de administrare. După autentificarea administratorului va fi disponibil următorul meniu :teste – prin selectarea testului se vor afișa toate întrebările

-note test- vor fi afișate notele studenților la testul respectiv

– profesori- se vor afișa profesorii care sunt înscriși în aplicație și au publicat teste

Situatie test – prin selectarea testului se vor afișa notele studenților care au susținut testul

CONCLUZII

Pentru a utiliza principiile în mod corespunzător, trebuie mai întâi să înțelegem modul în care utilizatorii interacționează cu site-urile web, modul în care acestea gândesc și care sunt modelele de bază ale comportamentului utilizatorilor.

Utilizatorii apreciază calitatea și credibilitatea. Dacă o pagină oferă utilizatorilor conținut de înaltă calitate, aceștia sunt dispuși să compromită conținutul cu reclame și design-ul site-ului. Acesta este motivul pentru care site-urile web care nu sunt bine concepute, cu conținut de înaltă calitate, câștigă mult trafic de-a lungul anilor. Conținutul este mai important decât designul care îl acceptă.

Lucrarea este structurată pe trei capitole, fiecare din acestea tratând pe rând probleme legate de ”Fundamente teoretice”, ”Aplicația – produsul informatic” , pentru ca în ultima parte a lucrării să fie prezentată pe larg aplicația din punctul de vedere al utilizatorilor finali.

În ultima perioadă, datorită extinderii internetului pe întreg mapamondul, fapt pentru care folosirea e-learning-ului este din ce în ce mai răspândită. Nevoia unei Universități la nivel mondial este posibilă doar prin intermediul internetului. O universitate care predă cursuri, examinează studenți din întreaga lume, în toate limbile existente și având o bază de date cu o capacitate de stocare imensă, este posibilă doar în lumea virtuală.

În cadrul lucrării am prezentat o serie de tehnologii utilizate în dezvoltarea aplicațiilor web. Aplicația a fost creată utilizând limbajul PHP în combinație cu serverul de baze de date MySQL.

Accesarea aplicației se poate realiza de pe calculatorul pe care este instalată (server web) sau de pe orice calculator care are acces prin intermediul unei rețele la acestă adresă. Pentru accesarea aplicației este necesară prezența unui browser (navigator) web pe calculatorul client, cum ar fi Internet Explorer, Opera, Google Chrome, etc.

Toate paginile aplicației sunt realizate dupa un model unitar. Astfel, în orice pagină se deosebesc trei zone distincte:

– Caseta meniu – dispus în partea stângă a paginii – conține legaturile către secțiuni

– Meniu orizontal – dispus în partea de sus– sunt butoanele pentru logarea studentului, profesorului și administratorului, vizualizate cursuri, aici se găsește un formular prin intermediul căruia se pot autentifica utilizatorii.

În proiectarea întregii aplicații am pornit de la ideea de simplitate, știindu-se că site-urile foarte complicate nu se bucura de un prea mare succes datorită dezorientării utilizatorilor. Datorită acestui fapt am urmărit o linie cât se poate de simplă, în încercarea de a face această aplicație cât mai ușor de explorat. Toate opțiunile sunt disponibile din 2 meniuri ceea ce nu duce la ”rătăcirea” utilizatorului prin site, acesta având posibilitatea printr-un simplu click să revină pe pagina anterioară.

Secțiunea de înregistrare a utilizatorilor accesibilă prin click pe linkul ”Inregistrare” în meniul de sus. După click se deschide formularul de înregistrare. Finalizarea înregistrării se face prin apăsarea butonului de validare din parte de jos după completarea în prealabil a formularului de înregistrare. După activarea linkului de validare a înregistrării dacă toate informațiile sunt corect introduse se va crea contul utilizatorului, se va activa parola și vor fi afișate datele de înregistrare pentru a fi revizualizate de utilizator;

Secțiune dedicată exclusiv utilizatorilor înregistrați, care le este disponibilă numai după autentificare. Formularul de autentificare este disponibil prin click pe linkul Log-In.

Baza de date a fost concepută astfel încât să corespundă cât mai bine nevoilor aplicației urmărindu-se în același timp și pastrarea unei linii cât mai simple. La proiectarea bazei de date s-a avut în vedere încercarea de a organiza informațiile într-o formă în care să fie cât mai usor găsite și accesate fără a se ajunge la o încărcare inutilă a serverului .

S-a încercat pe cât posibil realizarea unui design cât mai aerisit și folosirea a cât mai puține elemente grafice care nu ar fi făcut altceva decât să îngreuneze serverul și să mărească timpii de încărcare.

BIBLIOGRAFIE

Anghel, T. (2005), Dezvoltarea aplicațiilor WEB folosind XHTML, PHP și MySQL, Polirom, Bucuresti.

B. Ghilic-Micu, M. Stoica, E-activitățile în societatea informațională, Colecția Societatea Informațională, Ed.Economică, București, 2002

Buraga Sabin, Aplicații Web la Cheie, Editura Polirom, București, 2003

Buraga Sabin, Proiectarea Siturilor Web. Design și Funcționalitate, Editura Polirom, 2004

Dașu Narcisa Gabriela, Crearea, proiectarea, optimizarea, publicarea și promovarea site-urilor Web, Buzău: Teocora, 2011

Ioniță Anca, Modelarea UML în ingineria sistemelor de programare, Editura ALL, București, 2003

Jay Greenspan, Brad Bulger – MySQL / PHP Database Applications, M&T Books, 2001

Kevin Yank , Building a Database – Driven Web Site using PHP and MySQL

Liciniu A. Kovács ; colab.: Cormos Monica Lavinia, Pop Gabriel Marius , Ghid avansat de comerț electronic, ed.: Colin Holcombe. – Cluj Napoca : Editura Fundației pentru Studii Europene, 2011

Lambrescu, Ionuț. Analiza și prelucrarea imaginilor, Ploiești : Editura Universității Petrol-Gaze din Ploiești, 2011

M. Belu, D. Parasciv, A.M. Comănescu, Tranzacții pe Internet, Ed. Economică, București, 2004

Niculescu, Florentina Rodica, Modelarea și proiectarea sistemelor software utilizând UML, Editura Universității din București, 2005

Nițchi, S.I. (2012), Informatica economică de la A la X, Risoprint, Cluj-Napoca.

Onete Bogdan, Conținutul Site-urilor Comerciale – Elemente Obligatorii, Editura ASE, București, 2005

Pleșca Doru, Analiza Eficienței Comerciale a unui Magazin On-line, Editura ASE, București, 2006

Paul Chin, Best Practices for Developing a Web Site, 2008

Philip Crowder și David A. Crowder, Creating Web Sites Bible, 2008

Saseanu Andreea, Incertitudinea Strategică și Viitorul Dialogului On-line cu Consumatorul, Editura ASE, București, 2005

Scripcariu, Luminița, Proiectarea bazelor de date , Iași : Politehnium, 2011

Tahaghoghi, S.M.M., Williams H.E. (2007), Learning MySQL, O'Reilly Media, Inc., Sebascopol.

V. Patruț, M. Deju, D. Pacurari, Gestiunea și contabilitatea unor activități economice cu caracter deosebit, Editura Junimea, Iași, 2005

V. V. Patriciu, M. Ene-Petrosanu, I. Bica, C. Vaduva, N. Voicu, Securitatea Comertului Electronic, Ed. ALL, București, 2001

Pagini web:

http://www.tutorialspoint.com/e_commerce/e_commerce_business_models.htm

http://blueprintds.com/2016/12/30/anatomy-of-a-web-page/(data accesării: 12.05.2019).

http://www.practicalecommerce.com/articles/73649-11-Open-Source-Ecommerce-Platforms

http://www.webopedia.com/DidYouKnow/Hardware_Software/history_of_microsoft_windows_operating_system.html

https://www.owasp.org/index.php/Testing_for_SQL_Injection_(OTG-INPVAL-005)