FACULTATEA DE AUTOMATICĂ, CALCULATOARE ȘI ELECTRONICĂ
|UNIVERSITATEA DIN CRAIOVA
FACULTATEA DE AUTOMATICĂ, CALCULATOARE ȘI ELECTRONICĂ
DEPARTAMENTUL DE AUTOMATICĂ ȘI ELECTRONICĂ ||
PROIECT DE DIPLOMĂ
Alina-Maria Cîrjaliu
COORDONATOR ȘTIINȚIFIC
Conf. dr. ing. Daniela DANCIU
Iulie 2017
CRAIOVA
|UNIVERSITATEA DIN CRAIOVA
FACULTATEA DE AUTOMATICĂ, CALCULATOARE ȘI ELECTRONICĂ
DEPARTAMENTUL DE AUTOMATICĂ ȘI ELECTRONICĂ||
Sistem de management al conținutului, cu aplicații în e-learning
Alina-Maria Cîrjaliu
COORDONATOR ȘTIINȚIFIC
Conf. dr. ing. Daniela DANCIU
Iulie 2017
CRAIOVA
DECLARAȚIE DE ORIGINALITATE
Subsemnata Alina-Maria Cîrjaliu, studenta la specializarea Ingineria sistemelor multimedia din cadrul Facultății de Automatică, Calculatoare și Electronică a Universității din Craiova, certific prin prezenta că am luat la cunoștință de cele prezentate mai jos și că îmi asum, în acest context, originalitatea proiectului meu de licență:
· cu titlul Sistem de management al conținutului, cu aplicații în e-learning,
· coordonată de Conf. dr. ing. Daniela DANCIU,
· prezentată în sesiunea Iulie 2017.
La elaborarea proiectului de licență, se consideră plagiat una dintre următoarele acțiuni:
· reproducerea exactă a cuvintelor unui alt autor, dintr-o altă lucrare, în limba română sau prin traducere dintr-o altă limbă, dacă se omit ghilimele și referința precisă,
· redarea cu alte cuvinte, reformularea prin cuvinte proprii sau rezumarea ideilor din alte lucrări, dacă nu se indică sursa bibliografică,
· prezentarea unor date experimentale obținute sau a unor aplicații realizate de alți autori fără menționarea corectă a acestor surse,
· însușirea totală sau parțială a unei lucrări în care regulile de mai sus sunt respectate, dar care are alt autor.
Pentru evitarea acestor situații neplăcute se recomandă:
· plasarea între ghilimele a citatelor directe și indicarea referinței într-o listă corespunzătoare la sfărșitul lucrării,
· indicarea în text a reformulării unei idei, opinii sau teorii și corespunzător în lista de referințe a sursei originale de la care s-a făcut preluarea,
· precizarea sursei de la care s-au preluat date experimentale, descrieri tehnice, figuri, imagini, statistici, tabele et caetera,
· precizarea referințelor poate fi omisă dacă se folosesc informații sau teorii arhicunoscute, a căror paternitate este unanim cunoscută și acceptată.
Data, Semnătura candidatului,
|UNIVERSITATEA DIN CRAIOVA
Facultatea de Automatică, Calculatoare și Electronică
Departamentul de Automatică și Electronică
|Aprobat la data de
…………………
Director de departament,
Prof. dr. ing.
Emil PETRE
|
PROIECTUL DE DIPLOMĂ
Numele și prenumele studentului/-ei:
|Cîrjaliu Alina-Maria|
Enunțul temei:
|Sistem de management al conținutului cu aplicații în e-learning|
Datele de pornire:
|Administrarea conținutului pentru o aplcație multimedia on-line. |
Conținutul proiectului:
|1. Introducere
2. Tehnologii utilizate în dezvoltarea aplicației:
3. Implementarea proiectului
4. Prezentarea proiectului
5. Concluzii
|
Material grafic obligatoriu:
|Da|
Consultații:
|Periodice|
Conducătorul științific
(titlul, nume și prenume, semnătura):|Conf. dr. ing. Daniela DANCIU|
Data eliberării temei:
|15.10.2016|
Termenul estimat de predare a proiectului:
|30.06.2017|
Data predării proiectului de către student și semnătura acestuia:
||
|UNIVERSITATEA DIN CRAIOVA
Facultatea de Automatică, Calculatoare și Electronică
Departamentul de Automatică și Electronică
||
REFERATUL CONDUCĂTORULUI ȘTIINȚIFIC
Numele și prenumele candidatului/-ei:|Cîrjaliu Alina-Maria|
Specializarea:|Ingineria sistemelor multimedia|
Titlul proiectului: |Sistem de management al conținutului cu aplicații în e-learning|
Locația în care s-a realizat practica de documentare (se bifează una sau mai multe din opțiunile din dreapta):|În facultate □|
|În producție □|
|În cercetare □|
|Altă locație: [se detaliază]|
În urma analizei lucrării candidatului au fost constatate următoarele:
Nivelul documentării|Insuficient
□|Satisfăcător □|Bine
□|Foarte bine
□|
Tipul proiectului|Cercetare
□|Proiectare
□|Realizare practică □|Altul
[se detaliază]|
Aparatul matematic utilizat|Simplu
□|Mediu
□|Complex □|Absent
□|
Utilitate|Contract de cercetare □|Cercetare internă □|Utilare
□|Altul
[se detaliază]|
Redactarea lucrării|Insuficient
□|Satisfăcător □|Bine
□|Foarte bine
□|
Partea grafică, desene|Insuficientă
□|Satisfăcătoare □|Bună
□|Foarte bună
□|
Realizarea practică|Contribuția autorului|Insuficientă
□|Satisfăcătoare □|Mare
□|Foarte mare
□|
|Complexitatea
temei|Simplă
□|Medie
□|Mare
□|Complexă
□|
|Analiza cerințelor|Insuficient
□|Satisfăcător □|Bine
□|Foarte bine
□|
|Arhitectura|Simplă
□|Medie
□|Mare
□|Complexă
□|
|Întocmirea specificațiilor funcționale|Insuficientă
□|Satisfăcătoare □|Bună
□|Foarte bună
□|
|Implementarea|Insuficientă
□|Satisfăcătoare □|Bună
□|Foarte bună
□|
|Testarea|Insuficientă
□|Satisfăcătoare □|Bună
□|Foarte bună
□|
|Funcționarea|Da
□|Parțială
□|Nu
□|
Rezultate experimentale|Experiment propriu
□|Preluare din bibliografie
□|
Bibliografie|Cărți
|Reviste
|Articole
|Referințe web
|
Comentarii
și
observații
||
În concluzie, se propune:
ADMITEREA PROIECTULUI
□|RESPINGEREA PROIECTULUI
□|
Data, Semnătura conducătorului științific,
REZUMATUL PROIECTULUI
Sitemul de management al conținutului cu aplicații în e-learning este o aplicație web ce facilitează adaugarea și modificarea de conținut într-o pagina web.
Rolul acestei aplicații este de a ușura administrarea conținutului dintr-un site web pentru persoanele ce nu au suficiente cunoștințe de programare.
Acest sistem de management are numeroase funcții : permite utilizatorilor de tip administrator să se autentfice în aplicația web și să poată adauga pagini noi, să poata modifica paginile existente, să aleagă meniul în care va fi publicată o nouă pagină, poate administra utilizatorii existenți, poate administra lista limbilor existente, poate adauga o nouă limbă și traduce conținutul pentru paginile existente în limba dorită, poate seta unui anumit tip de utilizator un cont restricționat ce îi permite accesul doar la meniul de pagini, de unde poate adauga și modifica pagini in aplicația web.
Acest sistem de management al coțtinutului poate fi folosit cu success pentru a administra conținut cu caracter educațional cum ar fi: cursuri, imagini, cursuri în format video în mai multe limbi, facilitând astfel studenților sau vizitatorilor țintă accesul la informația educațională.
Termenii cheie: CMS, php, MySQL, CSS, HTML, JavaScript, administrare conținut, adaugare conținut, modificare conținut, utilizator, administrator, administrare, limbă
CUPRINSUL
1 Introducere 14(„\l „)
1.1 Scopul 14(„\l „)
1.2 Motivația 15(„\l „)
1.3 Ce este un sistem de administrare al conținutului (CMS) 15(„\l „)
1.4 Conceptul de e-learning 16(„\l „)
2 TEHNOLOGII Utilizate în dezvoltarea aplicației 17(„\l „)
2.1 Baze de date MySQL 17(„\l „)
2.2 PHP (Hypertext Preprocessor) 19(„\l „)
2.3 CSS 23(„\l „)
2.4 JavaScript 24(„\l „)
3 Implementarea aplicației web 27(„\l „)
3.1 MySQL 27(„\l „)
3.2 PHP 39(„\l „)
3.3 CSS 50(„\l „)
3.4 JavaScript 55(„\l „)
3.5 Ckeditor 56(„\l „)
4 Prezentarea sistemului de management al conținutului cu aplicații in e-learning 58(„\l „)
5 Concluzii 76(„\l „)
6 Bibliografie 77(„\l „)
7 Referințe web 78(„\l „)
A. Codul sursă 79(„\l „)
B. Site-ul web al proiectului 117(„\l „)
C. CD / DVD 118(„\l „)
LISTA FIGURILOR
Figura 1 Deservirea unei pagini statice, fara interventia interpretorului PHP 24(„\l „)
Figura 2 Deservirea unei pagini dinamice, modificata de PHP în momentul request-ului 24(„\l „)
Figura 3 autentificare în cpanel 30(„\l „)
Figura 4 crearea bazei de date 31(„\l „)
Figura 5 setarile bazei de date 32(„\l „)
Figura 6 adaugarea utlizatorului bazei de date 33(„\l „)
Figura 7 legatura dintre utilizator și baza de date aferentă 34(„\l „)
Figura 8 crearea unui nou tabel în baza de date 35(„\l „)
Figura 9 tabelul access 35(„\l „)
Figura 10 tabelul languages 35(„\l „)
Figura 11 tabelul labels 36(„\l „)
Figura 12 tabelul labels_content 36(„\l „)
Figura 13 tabelul labels_types 36(„\l „)
Figura 14 tabelul labels_types_content 37(„\l „)
Figura 15 tabelul languages_content 37(„\l „)
Figura 16 tabelul access_content 38(„\l „)
Figura 17 tabelul admins 38(„\l „)
Figura 18 tabelul navigation_types 39(„\l „)
Figura 19 tabelul pages 39(„\l „)
Figura 20 tabelul pages_content 39(„\l „)
Figura 21 tabelul navigation 40(„\l „)
Figura 22 tabelul navigation_types_content 40(„\l „)
Figura 23 relatiile dintre tabelele bazei de date 41(„\l „)
Figura 24 directorul template 42(„\l „)
Figura 25 fisierele header.php și footer.php 42(„\l „)
Figura 26 cod header.php 43(„\l „)
Figura 27 cod clasa Dbase 44(„\l „)
Figura 28 cod conexiune catre baza de date 44(„\l „)
Figura 29 cod clasa Core 45(„\l „)
Figura 30 cod clasa Language 45(„\l „)
Figura 31 cod clasa Navigation 46(„\l „)
Figura 32 cod clasa Page 46(„\l „)
Figura 33 cod clasa Admin 47(„\l „)
Figura 34 cod index.php 47(„\l „)
Figura 35 cod adaugă utilizator “add.php” 48(„\l „)
Figura 36 cod modifică urilizator – edit.php 48(„\l „)
Figura 37 cod sterge utilizator – remove.php 49(„\l „)
Figura 38 cod index.php 49(„\l „)
Figura 39 cod campuri pagină nouă – index.php 50(„\l „)
Figura 40 cod adauga o pagină nouă – add.php 50(„\l „)
Figura 41 cod avertizare identitate folosită 51(„\l „)
Figura 42 cod modificare pagina existentă – edit.php 51(„\l „)
Figura 43 cod adaugare pagină în meniu – navigation.php 52(„\l „)
Figura 44 cod șterge pagină – remove.php 52(„\l „)
Figura 45 cod cloare si dimensiune heading 53(„\l „)
Figura 46 culoare titlu CSS 53(„\l „)
Figura 47 inaltime și latime logo CSS 54(„\l „)
Figura 48 selector limbă CSS 54(„\l „)
Figura 49 cod navigatie front .css 55(„\l „)
Figura 50 cod stilizare elemente admin 55(„\l „)
Figura 51 cod setare culoare si dimensiune heading admin 56(„\l „)
Figura 52 cod logo css admin 56(„\l „)
Figura 53 cod selector de limba admin 57(„\l „)
Figura 54 cod admin navgatie.css 57(„\l „)
Figura 55 cod Core.js 58(„\l „)
Figura 56 cod form.js 59(„\l „)
Figura 57 ckeditor implementare javascript 60(„\l „)
Figura 58 ckeditor cod creare clasa 60(„\l „)
Figura 59 exemplu funcții ckeditor 60(„\l „)
Figura 60 exemplu structură site web 62(„\l „)
Figura 61 pagina Home 63(„\l „)
Figura 62 pagina curs php 64(„\l „)
Figura 63 pagina curs MySQL 65(„\l „)
Figura 64 pagina curs css 66(„\l „)
Figura 65 pagina contact 67(„\l „)
Figura 66 selector limbă 68(„\l „)
Figura 67 pagina de autentificare 68(„\l „)
Figura 68 inserarea utilizatorului si a parolei 68(„\l „)
Figura 69 avertizare utilizator sau parola incorectă 69(„\l „)
Figura 70 pagina de administrare pagini 69(„\l „)
Figura 71 meniu pagini 70(„\l „)
Figura 72 adauga o pagină nouă 71(„\l „)
Figura 73 inserare pagini în meniu 72(„\l „)
Figura 74 listă meniu 73(„\l „)
Figura 75 listă pagini 73(„\l „)
Figura 76 pagina administrare etichete 74(„\l „)
Figura 77 meniu etichete 74(„\l „)
Figura 78 lista limbi existente 75(„\l „)
Figura 79 pagina tipuri de etichete 75(„\l „)
Figura 80 pagină utilizatori 76(„\l „)
Figura 81 meniu utilizatori 76(„\l „)
Figura 82 adaugă un utilizator nou 77(„\l „)
Figura 83 listă selectare tip utilizator 78(„\l „)
Figura 84 perimisiuni restrictive cont utilizator 78(„\l „)
1 Introducere
1.1 Scopul
Ideea de bază a acestui proiect a fost acea de a ușura adaugarea și modificarea de conținut nou pentru o aplcație web și de putea face acest proiect util și pentru conceptul de E-learning. Astfel după ce mi-am așternut ideile pe hartie și le-am discutat împreună cu profesorul coordonator am început să dezvolt o aplcație web bazată pe un sistem de management al conținutului ce se poate adauga în mai multe limbi pentru a facilita studenților accesul la informație în limbă lor natală.
Pentru a realiza o pagina web sau a putea modifica o pagina web în general este nevoie de cunostinte de programare, iar pentru a face acest lucru cât mai ușor am implementat un sistem de administrare al conținutului, astfel pentru a adauga sau a modifica o pagină în aceasta aplcație web nu sunt necesare cunoștinte de programare. Utilizatorul administrator se va putea autentifica folosind un nume de utilizator și o parolă, pentru a putea avea acces la panoul de administrare al aplicației web.
Din acel panou, utilizatorul va putea selecta limba în care dorește să fie afișat conținutul, poate adauga o pagină nouă, poate selecta tipul meniului unde dorește să faca publica pagnia (meniu principal, meniu secundar și meniul subsol), poate adauga o nouă limbă disponibilă completand toate etichetele afișate în limbă pe care acesta dorește să o introducă, poate crea un nou utilizator ce va avea acces la panoul de admnistrare, poate modifica conținutul paginilor existente, poate șterge pagini, modulele de limbă implementate și utilizatorii creați.
1.2 Motivația
Motivația realizarii acestui sistem de management al conținutului a fost acea de a putea adauga și modifica ușor conținut web într-o aplcație web, adaugarea paginilor În meniu se va face uăor, selectand o pagină existentă și atribuindui unul dintre cele trei meniuri existente.
Managementul utilizatorilor este ușor de realizat, utilizatorii pot fi de două tipuri, de tip administrator ce au acces la toate zonele din pagina de administrator și pot adauga, modifica sau șterge conținut din toata aplicația web sau utilizatorul de tip utilizator ce are acces numai la meniul de pagini, le va putea modifica, adauga și șterge.
Sistemul de management al conținutului are aplicații în e-learning, paginile create de administrator având conținut educational pentru a putea facilita învațamantul la distanță.
Fiind o aplcație ce poate adauga conținutul în mai multe limbi existente utilizatorul ținta nu va fi doar regional, iar informația afișată poate fi citită în mai multe limbi. Astfel facilitând studenților din programele ERASMUS accesul la informația educațională.
1.3 Ce este un sistem de administrare al conținutului (CMS)
Un CMS (Content management system) sau un sistem de administrare al conținutului este un sistem software special creat pentru automatizarea cât mai amplă a gestiunii conținutului, în special realizat pentru aplicatiile web. Scopul său este de a reduce sau elimina intervenția programatorilor la modificarea și administrarea aplicațiilor web. CMS-ul facilitează organizarea, controlul și publicarea de pagini, documente, imagini sau alt tip de conținut și resurse multimedia. Un ‘CMS web’ este un sistem de management al conținutului cu facilități adiționale pentru ușurarea publicării de conținut pe diversele pagini web.
Sistemele de administrare a conținutului web sunt folosite adesea pentru stocarea și controlul documentelor cum ar fi articole. Un CMS poate avea următoarele funcții:
· Crearea și transferul de documente și materiale multimedia
· Identificarea utilizatorilor cheie și a rolului lor în gestionarea conținutului
· Atribuirea de roluri și responsabilități diferitelor categorii de conținut
· Urmărirea și organizarea mai multor versiuni ale aceluiași element de conținut.
· Publicarea conținutullui într-o librarie, pentru a sprijini accesul la conținut. În ultima vreme libraria (baza de date) este o parte foarte importantă a sistemului.
De obicei un asemenea sistem oferă unelte software prin care utilizatorii fără cunoștințe de programare pot crea și organiza conținutul cu ușurință. Majoritatea sistemelor folosesc o bază de date pentru stocarea conținutului, și o temă de prezentare pentru afișarea acestuia vizitatorilor obișnuiți. Administrarea se face în mod normal printr-un motor de cautare web. [CMS1]
1.4 Conceptul de e-learning
Conceptul de „E-learning” include toate formele de învătare sprijinite de mediul electronic, conceptul referindu-se și la modul de predare si la tehnologia educatională.
Caracteristicile acestui tip de invatare sunt:
– procesul de învătare este bazat pe web și pe utilizarea calculatorului ca mijloc de învătare;
– contțnutul este livrat prin internet, intranet / extranet, în fomat multimedia (imagini, audio, video, etc.)
– procesul de învătare se realizează într-o clasă virtuală;
– clasa virtuală lucrează sub îndrumarea unui lector (moderator) ce planifică cursurile, activitatea grupului de participanți, supune dezbaterii acestora aspecte ale cursului în conferinte asincrone (forumuri de discutii) sau sincrone, furnizeaza resurse auxiliare, comentează temele si îl indrumă pe fiecare cursant;
e-Learning conduce la dobandirea de noi cunoștinte prin metode moderne și eficiente de învatare, permite accesul la informatiile cele mai noi si mai mult decat atat, permite accesul de oriunde și nu în ultimul rand sprijină învatarea continuă. [ELEARNING2]
2 TEHNOLOGII Utilizate în dezvoltarea aplicației
Pentru dezvoltarea aplicației “Sistem de management al conținutului cu aplicații în e-learning” am folosit mai mulre limbaje de programare:
1. Baze de date MySQL
2. PHP ( Hypertext Preprocessor)
3. CSS și HTML
4. Javascript
5. JQuery
2.1 Baze de date MySQL
MySQL este o platforma de conținut disponibil cu un sistem de administrare a bazelor de date. Numele “MySQL” este o combinație dintre “My” ce vine de la numele fiicei cofondatorului “Michael Widenius(„https://en.wikipedia.org/wiki/Michael_Widenius”)’” și “SQL” ce reprezintă abrevierea de la “Structured Query Language”.
Limbajul de programare folosit în realizarea bazei de date MySQL este C și C++. Baza de date MySQL este compatibilă cu multe sisteme de operare: “Microsoft Windows”, “OpenSolaris” și “OracleSolaris” etc.
Programul MySQL este oferit pieței largi în două ediții diferite: programul cu conținut disponibil “MySQL Community Server” și “Enterprise Server”. Diferența dintre MySQL Enterprise Server și MySQL Community Server este bazată pe o serie de extensii proprii ce se instalează ca și conexiuni de server, în rest folosesc aceleali versiuni de sistem și sunt bazate pe același cod sursă.
MySQL este un sistem de baze de date web, ce ruleaza pe server și este ideal de folosit pentru aplicații de mici dimensiuni cât și pentru aplicații complexe. Este rapid, de încredere și ușor de folosit de către utilizatori.
Bazele de date MySQL sunt structurate în tabele. Tabelele sunt o colecție de date asemanatoare ce conțin rânduri și coloane.
Bazele de date MySQL sunt folosite pentru a stoca informații pe categorii. De exemplu o companie poate avea o bază de date cu urmatoarele tabele:
1. Angajați
2. Produse
3. Clienți
4. Comenzi
Pentru a putea scrie cod în MySQL se folosesc cereri sau intrari de tip Query.
Se poate căuta printr-o instrucțiune de tip query, iar apoi se va returna un rezultat al acestei instrucțiuni.
Exemplu de instrucțiune SELECT: “SELECT LastName FROM Admins”
Query-ul de mai sus selectează datele din coloana „LastName” a tabelului „Admins”.
Exemple de tipuri de instrucțiuni:
· SELECT(selectează date din baza de date și le returnează utilizatorului)
· UPDATE(actualizează conținutul nou introdus în baza de date)
· DELETE(este folosit pentru a șterge date introduse în tabelele din baza de date)
· INSERT(adaugă conținut nou în tabelele din baza de date creată)
2.2 PHP (Hypertext Preprocessor)
PHP (Hypertext Preprocessor) este un limbaj de programare cu ajutorul căruia se pot modifica conținutul paginilor web înainte ca acestea să fie transmise de server către motoarele de cautare ale utilizatorilor.
Limbajul de programare PHP, poate genera conținut HTML cu ajutorul unor fișiere existente sau pornind de la zero, poate afișa un element de tip imagine sau orice alt conținut ce poate fi interpretat de un motor de cautare. În cadrul acestui proces, PHP poate comunica cu baze de date, anumite fișiere externe sau alt tip de resurse. Deoarece procesarea se realizează la nivelul serverului web, înainte ca paginile web să ajunga în motorul de cautare, PHP este un limbaj de programare de tip server-side.
Modul în care limbajul de programare PHP genereaza conținut pentru o pagina web ce va fi afișată de motorul de cautare se face prin instrucțiunile delimitate de etichetele “”. Asadar, orice se află intre aceste etichete (tag-uri) va fi considerat cod-sursa și va fi executat de interpretorul PHP și inlocuit cu rezultatul executiei. conținutul ce se află în afara acestor etichete ( tag-urilor) ramane neschimbat și va fi transmis către motorul de cautare. De exemplu, este prezentată o pagină ca mai jos:
Rezultatul va fi o pagină HTML ce va conține cuvintele „Astazi este” și rezultatul codului PHP (in cazul acesta – dată curentă). Codul HTML final, transmis de server în urma procesarii PHP este urmatorul:
Astazi este 22.06.2017
Codul PHP nu este necesar să fie inclus în pagina HTML. Secventa de mai jos produce o pagină asemanatoare celei de mai sus (în acest caz PHP crează o pagină HTML de la zero).
‘;
print Astazi este’ . date( ‘d.m.Y’ );
print ‘
