Realizarea Unui Blog

LUCRARE DE LICENȚĂ

REFERAT DE APRECIERE

a lucrării de licență

Numele și prenumele absolventului: ____________________________________________________________

Domeniul de studii: ____________________________________________________________

Programul de studii universitare de licență: ____________________________________________________________

Tema lucrării de licență: ____________________________________________________________

____________________________________________________________

Aprecieri asupra conținutului teoretic al lucrării de licență (se marchează cu X):

Aprecieri asupra părții practic-aplicative a lucrării de licență (se marchează cu X):

Aprecieri privind redactarea lucrării de licență:

8. Considerații finale:

________________________________________________________________________________________________________________________

Apreciez lucrarea de licență cu nota _____________ și o recomand pentru a fi susținută în prezența comisiei examenului de licență.

Data Conducător științific

Lector univ. dr.

OANCEA ROMANA

CUPRINS

INTRODUCERE

CAPITOLUL I. De la web static la web dinamic

1.1. Evoluția webului – static/dinamic.

1.2. Web 2.0

1.2.1. Rețele sociale

1.3. Web 3.0

1.4. Web 4.0

Capitolul II. Servicii Google

2.1. Serviciul Google Adwords

2.2. Serviciul Adsense

2.3. Serviciul YouTube

2.4. Google Books

2.5. Google Play

2.6. Google Street View

2.7. Serviciul Google Translate

2.8. Google Earth

2.9. Google Maps

2.10. Gmail

CAPITOLUL III. Realizarea unui blog

3.1. Proiectarea conceptuală

3.1. Programe necesare

3.2. Realizarea practică a unui blog

3.2.1. Antetul

3.2.2. Cuprinsul

3.2.3. Footerul

3.2.4. Pagina articole.php

3.2.5. Pagina dictionar.php

3.2.6. Pagina contact.php

3.2.7. Pagina articol.php

3.2.8. Pagina cauta.php

3.2.9. Pagina conectare.php

3.2.10. Pagina administrator.php

3.2.11. Baza de date

CONCLUZII FINALE

BIBLIOGRAFIE

ANEXE

INTRODUCERE

Google Inc. este o corporație americană ce dispune de motorul de căutare pe internet ce îi poartă numele, precum și alte motoare pentru imagini, grupuri de știri, cărți, directoare web și bloguri.

Printre toate serviciile ce le-a creat Google ( aplicații web, instrumente pentru afaceri/public, servicii de publicitate), platformele de blogging sunt poate printre cele mai folosite de către utilizatorii de internet împreună cu serviciile de advertising AdWords și AdSense.

Studiul realizat în lucrare se axează pe tehnici și tehnologii Web utilizate în crearea site-urilor dinamice și este structurat pe trei capitole, dintre care două sunt teoretice și unul prezintă crearea și folosirea unui blog.

În blogging, de obicei, principala preocupare pe care o avem este să ne facem cunoscuți, să obținem popularitate, aspirăm la cât mai multe comentarii și dezbateri din cadrul subiectelor lansate și alese de noi, însă drumul spre succes este mare, și cu cât mai mare pare pentru blogger, cu atât mai greu, acesta, va ajunge la destinație. În cazul nostru nu este vorba de popularitate, fiindcă blogul nostru oferă informații având destinație militară, unde îi ținem la curent pe toți cei din domeniu despre activitățile ce se petrec în cadrul MApN.

Primul capitol prezintă istoria internetului, pornind de la internetul static până la cel dinamic( prezent în ziua de astăzi). Inovațiile din acest domeniu au adus un mare plus în toate domeniile( informațional, economic, tehnologic, social), fiind catalogat ca una dintre cele mai mari invenții până în prezent. În acest capitol am descris dezvoltarea web-ului pe parcursul a celor patru mari generații : web 1.0, web 2.0, web 3.0 și cel mai nou web 4.0.

În al doilea capitol, având în vedere că la proba practică am ales să proiectez un blog(blog-ul făcând parte din serviciile create de Google), m-am axat pe descrierea a unor servicii aparținând companiei Google ce au aplicabilitate în domeniul militar – servicii precum Google Street View, Google Earth, Google Maps cu ajutorul cărora scăpăm de hărțile vechi și putem lucra în timp real pe cele mai noi hărți apărute, creând rute necesare deplasării convoaielor militare.

Al treilea capitol ilustrează o aplicație web de tip blog, cu caracter militar, folosită pentru a informa atât persoanele din sistem despre activitățile curente ce se petrec în cadrul MApN, cât și persoanele din afara sistemului care doresc să se intereseze de cele mai noi informații din domeniul militar. Acest capitol este o prezentare bazată pe capturi de ecran(screenshoturi) și quote-uri de cod cu ajutorul cărora am creat paginile web. Este prezentată utilitatea fiecărei secvențe în parte, cât si modul de pornire/utilizare a site-ului și programele necesare creării/funcționării lui.

CAPITOLUL I. De la web static la web dinamic

Evoluția webului – static/dinamic.

Site web, denumit în limba engleză web site, desemnează o suită de pagini web multimedia ( pagini ce conțin texte, animații, imagini etc.), ce pot fi accesate în internet, în principiu de oricine, pe o anumită temă, și care sunt conectate între ele prin hiper-linkuri.

La crearea unui site web există mai multe posibilități de administrare – întreținere, actualizare, astfel că:

site-ul poate fi administrat de către web master sau chiar de utilizatorii acestuia;

având la bază o database, site-ul se actualizează permanent, în mod automat;

cu ajutorul scripturilor .php și nu numai, navigarea poate fi facilă.

Un site web nu este alcătuit dintr-o singură pagină, el este format dintr-o multitudine de pagini ce pot fi accesate cu ajutorul hyper-linkurilor și a protocolului HTTP, protocol ce face transferul informației de la server la browserul utilizatoului.

„La baza funcționării web-ului stau 3 standarde, și anume:

(HTTP) – Hypertext Transfer Protocol, stiva de protocoale OSI prin care serverul web și browserul clientului (utilizatorului) comunică între ele;

(HTML) – Hypertext Markup Language, standard de definire și prezentare a paginilor web.

(URI) – Uniform Resource Identifier, sistem universal de identificare a resurselor din web, folosit pentru a identifica și regăsi paginile web;

Următoarele standarde sunt definite mai târziu:

Cascading Style Sheets (CSS)

JavaScript

Hypertext Transfer Protocol Secure – HTTPS”.

Dacă inițial se vorbea de pagini web statice, la ora actuală informația este actualizată în timp real, iar utilizatorul poate interveni asupra conținutului datorită evoluției web-ului. Paginile statice au corespuns cu Web 1.0, iar acestea au fost conectate prin intermediul hyper-linkurilor. Se oferea doar posibilitatea de citire, fără intervenția directă. O modificare a conținutului de afișat presupunea o modificare a paginii sursă Html.

Dezvoltarea web-ului s-a făcut pe parcursul a patru mari generații: web 1.0 cunoscut ca web al cunoașterii, web 2.0 ca web al comunicațiilor, web 3.0 ca web al cooperării și web 4.0 ca web al integrării.

Evoluția WEB

Termenul de Web 2.0, indică o mulțime de aspecte interactive și cooperative ale Internetului. Numele de Web 2.0 este intuitiv, caracteristicile sale fiind și înainte, doar ca erau numite Web 1.0.

Web 2.0

Urmașul lui Web 1.0, Web 2.0 conține noi căi de a implementa posibilitățile mai largi ale webului. Datorită acestei implementări, informațiile web au putut fi oferite și de utilizatorul individual, nu doar de mass media, companii particulare sau guverne cum era posibil în webului 1.0.

Webmasterii sau persoanele particulare au putut comunica prin intermediul rețelelor informale bazate pe internet, și împreună au contribuit la răspândirea informațiilor în lume.

Cele mai bune exemple pentru aceste rețele sunt blogurile sau portalurile și bursele de schimb de imagini, muzică, filme/video și software, site-uri precum youtube, facebook, twitter, flickr , dar și cele pentru file sharing. Cele mai cunoscute rețele din era Web 2.0 sunt rețelele de socializare.

Dintre principalele caracteristici ale web 2.0:

trecerea la CMS – Content Management Systems – adică gestiunea automată a informațiilor;

stocarea datelor utilizatorilor, care avea loc în primul rând pe calculatorul local, urmând să fie publicate în web abia ulterior, iar programele locale accesează din ce în ce mai des aplicațiile web, deoarece se pleacă de la ipoteza unei legături permanente cu webul. Unele motoare de căutare web sunt în stare să acceseze și datele locale ale utilizatorului.

diferențele între aplicațiile locale și cele Web se atenuează. Multe programe se actualizează singure, luând legătura cu site-ul autorului lor în mod automat. Rolul browserului devine din ce în ce mai important, deoarece cu ajutorul lui pot fi implementate aplicații web complexe (Dynamic HTML).

rolurile de „creator” și „consumator” de pagini web încep să se suprapună, deoarece „consumatorii” de până acum încep să contribuie activ la crearea de noi conținuturi, cum se întâmplă de exemplu cu blogurile. Mulți utilizatori își mută și transformă sfera lor privată de la echipamentul local la web, în acest fel făcând-o semipublică sau chiar publică.

Mashup – tendința de a accesa simultan mai multe servicii web, de la ofertanți diverși, rezultatul însă apare unitar;

noile aplicații bazate pe web duc la efectul că utilizatorii, chiar și atunci când nu sunt foarte versați tehnic, participă direct la răspândirea prin web a informațiilor și opiniilor.”

Rețele sociale

Cel mai răspândit exemplu ce este parte integrantă a tehnologiei Web 2.0 o constituie rețelele de socializare. Rețelele de socializare permit utilizatorilor să participe activ la conținutul site-ului, prin adăugarea de informații precum fotografii, secvențe video, postarea de știri, dar în același timp ca aspect negativ, se pierde identitatea, confidențialitatea datelor private.

Dintre cele mai cunoscute rețele de socializare putem enumera:

Facebook;

Flickr – utilizată în special pentru postarea de fotografii;

Twitter;

YouTube – pentru filme și video.

Web 3.0

Web 3.0 este similar cu web-ul semantic care permite mașinilor să înțeleagムsemantica, sau sensul, de informații pe World Wide Web. Acesta extinde rețeaua de pagini web care pot fi citite de om prin inserarea unor meta-date despre pagini și modul în care acestea sunt legate unele de altele, permițând agenților automatizați să acceseze Web-ul mai inteligent și să efectueze sarcini în numele utilizatorilor.

Termenul a fost inventat de Tim Berners-Lee, inventatorul World Wide Web și director al World Wide Web Consortium, care supraveghează dezvoltarea de standarde propuse Semantic Web. El definește web-ul semantic ca „o rețea de date care pot fi procesate în mod direct și indirect de mașini.” Termenul de semantic se referă la modul în care browser-ul va interpreta tag-urile, astfel că un text încadrat între tagurile <h1> ..</h1> va fi mai important decât același text încadrat între <h2></h2> sau <h6></h6>.

Tim Berners-Lee a propus o arhitectură pe straturi pentru web-ului semantic.

Nivelurile tehnologiilor web-ului semantic

Fiecare strat este construit pe baza straturilor inferioare, iar W3C dezvoltă standarde pentru toate nivelurile cu excepția primele două și face recomandări pentru semnăturile digitale și a modului de întrebuințare a cheilor criptate ce joacă un rol important în cazul stratului Trust.

Web 4.0

Web 4.0 este la nivel de idee și nu există o definiție clară, iar Web 4.0 este cunoscut ca web simbiotic. Visul din spatele acestuia este construirea unei interacțiuni puternice între oameni și mașini. Acest lucru va oferi posibilitatea creării de interfețe puternice precum interfețele controlate de minte [art2012].

Web 4.0 va fi web-ul scrisului, cititului, scrierii, executării și concurenței. Acesta va deveni asemănător cu un sistem de operare (webOS) și se va axa pe folosirea inteligenței artificiale.[art2012]

Aplicațiile conținute de web 4.0 vor permite spre exemplu căutarea conținuturilor de pe propriul desktop direct de pe un motor de căutare, etichetarea obiectelor cu un telefonrimele două și face recomandări pentru semnăturile digitale și a modului de întrebuințare a cheilor criptate ce joacă un rol important în cazul stratului Trust.

Web 4.0

Web 4.0 este la nivel de idee și nu există o definiție clară, iar Web 4.0 este cunoscut ca web simbiotic. Visul din spatele acestuia este construirea unei interacțiuni puternice între oameni și mașini. Acest lucru va oferi posibilitatea creării de interfețe puternice precum interfețele controlate de minte [art2012].

Web 4.0 va fi web-ul scrisului, cititului, scrierii, executării și concurenței. Acesta va deveni asemănător cu un sistem de operare (webOS) și se va axa pe folosirea inteligenței artificiale.[art2012]

Aplicațiile conținute de web 4.0 vor permite spre exemplu căutarea conținuturilor de pe propriul desktop direct de pe un motor de căutare, etichetarea obiectelor cu un telefon mobil și apoi încărcarea lor pe web, localizarea obiectelor prin intermediul unei adrese IP (Internet Protocol).

Capitolul II. Servicii Google

De-a lungul carierei sale Google a dezvoltat sau achiziționat o serie de servicii inovatoare. O parte din aceste servicii sunt utile și cunoscute, dar există și servicii mai mult sau mai puțin bizar dezvoltate. Serviciile, împărțite pe categorii, se adresează atât utilizatorilor obișnuiți de telefoane mobile sau PC-uri, cât și companiilor sau mediului universitar și nu numai.

Serviciul Google Adwords

Google Adwords este unul dintre cele mai bune servicii de reclamă online. Aparținând organizației Google este folosit de proprietarii de site-uri pentru a crește traficul pe site-ul propriu și implicit vânzările, sau pentru a câștiga clienți noi. Serviciul funcționează concomitent cu motorul de căutare, astfel că în timp real se vor afișa, în dreapta ecranului, link-urile care au legătură cu cuvintele cheie introduse de utilizator. O selectare a unui link presupune o plată către compania Google.

Serviciul, deși contra cost, a devenit popular în special pentru site-urile noi, care nu au un rang bun în motorul de căutare, datorită vechimii mici pe Internet. Deși pare simplu, problemele se referă la:

– definirea cuvintelor cheie – care fac concordanța între cuvintele cheie căutate în motorul de căutare și cuvintele cheie definite de proprietarul site-ului care a ales acest serviciu. Aceste cuvinte obligatoriu trebuie să fie relevante pentru a nu aduce vizitatori neinteresați, echivalent cu o pierdere din buget;

– stabilirea bugetului zilnic, în cazul în care un posibil client alege să intre pe site;

– informația care descrie site-ul, informație care trebuie să fie reală, simplă și concisă astfel că un vizitator să acceseze site-ul.

În general se recomandă ca alegerea cuvintelor cheie să fie făcută în urma unor cercetări elaborate. O campanie Adwords bine organizată va aduce avantaje financiare.

Plata către compania Google nu este standard, ci variază în funcție de rankingul site-ului. O pagină cu un ranking mai mare va plăti o taxă mai mică – generează mai mult trafic; în timp la polul opus, un anunț cu page ranking mic va plăti o taxă mai mică sau vor fi eliminați dacă se încadrează sub un prag de 0.5%. O eliminare din Google Adwords nu înseamnă neapărat o penalizare; anunțul poate fi îmbunătăți pentru a atrage noi vizitatori.

Folosirea serviciului Google Adwords poate fi avantajoasă pentru site-urile care oferă servicii sau produse. Serviciul Adwords nu este considerat doar o modalitate de reclamă cu prețuri accesibile, ci oferă în același timp diverse statistici care permit analiza traficului sau analiza unor indicatori.

Din luna septembrie a acestui an, serviciul AdWords a anunțat modificarea politicilor, astfel încât se dorește o interfață mai prietenoasă atât pentru utilizatori cât și pentru proprietarii de site-uri care folosesc acest serviciu de reclamă.

Serviciul Adsense

Dacă serviciul AdWords permite proprietarilor de site-uri să-și facă reclamă contra cost, serviciul google Adsense permite afișarea pe site-ul propriu a unei reclame de tip text, imagine sau video. Google se folosește de tehnologia motorului de căutare pentru a afișa reclame in funcție de conținutul site-ului, locația user-ului și alți factori. AdSense folosește o metodă de personalizare a reclamelor, camuflându-le în culorile site-ului, conținutul lor având legătură cu cel al paginii web pe care sunt afișate.

O publicitate prin Google, presupune în prima etapă o înscriere pe AdSense. Fiind cea mai cunoscută rețea de publicitate, este des utilizată pentru a scoate ȋn evidență importanța propriului site.Pentru a crește venitul prin Adsense, proprietarii de site-uri folosesc mai multe metode specifice, iar la baza AdSense, stă Adwords, care este un sistem complex de taxare per click.

Tipuri de reclame AdSense

„Feeds: AdSense pentru feed-uri permite editorilor Web să obțină câștiguri prin plasarea de anunțuri Google direcționate în feed-urile lor. AdSense pentru feed-uri funcționează în același mod ca și restul programului AdSense: prin difuzarea de anunțuri relevante pentru conținutul și cititorii site-ului.

Search: Permite proprietarilor de site-uri să introducă câmpuri de căutare Google. AdSense direcționează 51% din profitul acestor căutări spre proprietarul site-ului de la care a plecat căutarea.

Mobile Content: Permite afișarea reclamelor pe site-uri mobile. În locul script-ului java se folosește tehnologie precum PHP, ASP, etc.

Domains: AdSense pentru domenii permite afișarea reclamelor pe nume de domenii care nu au fost folosite. În acest mod deținătorii de domenii valorifică domeniile ce nu sunt folosite”.

Serviciul YouTube

YouTube este un serviciu google din categoria instrumentelor de comunicare și publicare – inițial nu a fost proprietate google, și permite utilizatorului să posteze videoclipuri, secvențe video sau secvențe sonore, tutoriale video, cu condiția să aibă un cont. Vizualizarea conținuturilor video nu necesită existența unui cont sau o înregistrare prealabilă.

Site-ul suportă standardul Flash Video și HTML 5. Conținuturile multimedia pot fi încărcate pe YouTube atât de utilizatori independenți cât și de televiziuni, fiind utilizat ca sursă de publicitate pentru acestea din urmă.

Pentru postarea secvențelor video există norme care trebuie să fie respectate – spre exemplu un conținut care incită la violență nu este acceptat. Youtube acceptă mai multe formate de fișiere video cu posibilitatea încărcării inlusiv de pe telefonul mobil. Formatele video acceptate :.WMV, .AVI, .MOV, .MPEG, .MP4, DivX, .FLV, .OGG precum și .3GP. Ca fiecare serviciu, YouTube este în continuă dezvoltare, dezvoltare care se reflectă atât la nivel de interfață cât și la posibilități de integrare în diverse rețele de socializare sau de redare a filmelor fără instalarea unor add-on-uri suplimentare.

Google Books

Cărțile în format .pdf sunt salvate într-o bază de date, însă serviciul Google Books folosește recunoașterea optică a caracterelor din fișierele .pdf și face o căutare a cărților în funcție de corespondența dintre cuvintele cheie și cuvintele de căutat. Inițial acest proiect a apărut sub numele Google Print, iar acum există un site dedicat Google Books(www.books.google.com).

Interfața google books

Google s-a dezvoltat datorită motorului de căutare și a algoritmilor de ierarhizare a paginilor în funcție de importanță, de Page Ranking și de structura internă a site-ului. Căutarea în google books este însă diferită deoarece nu există un BookRank-ing al cărților. La căutarea unei cărți, Google Books nu se uită doar la frecvența de apariție a cuvintelor cheie și potrivirea acestora cu titlul exact al cărții, ci se urmăresc și aspecte legate de carte precum frecvența web de căutare, vânzările recente, numărul de biblioteci care dețin acel titlu și numărul de reeditări.

O carte găsită în urma căutării poate fi previzualizată și adăugată în "biblioteca personală". Din "bibliotecă" cărțile pot fi previzualizate în orice moment.

Cărțile din biblioteca Google books

O carte publicată poate fi adăugată de autor în google books cu condiția ca aceasta să fie în format .pdf, să aibă ISBN și cel puțin pagina de cuprins disponibilă. Autorul are posibilitatea de a stabili procentual conținutul care dorește să-l facă public și în același timp modalitatea de încasare a onorariului din drepturile de autor.

Google Play

Apariția noilor platforme pentru telefoanele mobile a condus firma Google la realizarea unui proiect numit Google Play. Acesta constă ȋntr-un magazin online de melodii, filme, cărți și aplicații pentru sistemul de operare Android ce poate fi accesat direct de pe telefonul mobil cu sistemul de operare android. Mai nou, fiecare mobil cu această platformă are aplicația pentru Google Play direct instalată. Cărțile solicitate în google play pot fi vizibile și în google books dacă au fost accesate de pe același cont google.

Google Street View

Serviciul Google Street View permite utilizatorilor să navigheze sau să vizualizeze străzi și imagini din orașele lumii cu ajutorul pozelor panoramice cu unghiuri cuprinse între 0 și 3600 pe verticală sau 0 și 2900 pe verticală. Imaginile care constituie vederile panoramice sunt realizate manual, cu ajutorul unor mașini echipate cu calculatoare, aparate foto, lasere și dispozitiv GPS. Imaginile street view au fost realizate în scopul integrării în hărțile google.

Imagine stree view

(sursa https://www.google.com/maps/about/behind-the-scenes/streetview/)

Algoritmul de realizare a imaginilor street view este unul complex și constă din mai multe etape:

1) sunt fotografiate manual locațiile care vor apărea în aplicație, ținând seama de condițiile meteo specifice regiunii și de aglomerația din orele de vârf, astfel încât să se obțină cele mai bune fotografii.

2) imaginele sunt georeferențiate și aliniate

Alinierea imaginilor

3) imaginile suprapuse vor fi filtrate cu un filtru pentru eliminarea îmbinărilor dintre poze, iar fețele umane vor fi blurate pentru ascunderea identității.

Filtrarea imaginilor individuale pentru eliminarea liniilor de intersecție

Munca pentru obținerea imaginilor de pe întreg globul este titanică, iar la ora actuală Google, pe site-ul propriu, a făcut publică o hartă cu regiunile implementate, reprezentate în Figura 8, unde regiunile cu albastru reprezintă zonele implementate.

Harta implementării serviciului Google Stree

(sursa https://www.google.com/maps/about/behind-the-scenes/streetview/)

Google Street este disponibil și pentru utilizatorii de smartphone-uri cu sistem de operare Android. Serviciul poate să se conecteze de la bordul unei mașini, să caute locații prin comenzi vocale, să afișeze imagini din satelit și să afișeze starea traficului. Când se ajunge la o destinație, după apelul vocal dat în google street, se afișează imaginea corespunzătoare locației, imagine care nu este în timp real.

Serviciul Google Translate

Google Translate este o aplicație gratuită de traducere multilingvistică sub forma unei interfețe web.

Interfața Google translate

Algoritmul de traducere se realizează prin intermediul limbii engleze, astfel că, dacă niciuna din cele două limbi în care se dorește traducerea nu este engleză, textul inițial este tradus în engleză, apoi în a doua limbă selectată; acest mecanism justifică și erorile apărute în traducere. În general traducerea se realizează la nivel de cuvânt, utilizând un sistem cu statistica machine translation și mai puțin la nivel de expresii, însă rezultatul poate fi îmbunătățit cu ajutorul agenților inteligenți care pot învăța din rezultat.

SMT (Statistical Machine Translation) asignează câte o probabilitate pentru fiecare versiune a cuvântului de tradus și determină o probabilitate condiționată.

Google Earth

Google Earth permite vizualizarea globului pământesc, o regiune, o stradă sau o clădire utilizând modelul elevației digitale sau reprezentarea 3D a suprafeței terestre. Cu ajutorul modelului elevației digitale toate obiectele de pe suprafața pământului sunt reprezentate în 3D.

a) b)

Google Earth – a)vizualizare a globul pământesc b) rețeaua de străzi orașul Sibiu

Datele geospațiale pot fi delimitate pe harta digitală pentru a fi utilizate ulterior în diverse procese de decizie, ajutorul venind de la posibilitatea vizualizării propriu-zise a marcajelor înscrise. Google Earth este bazat pe trei componente software: o componentă client – care necesită instalarea pe calculator, o componentă server și o componentă fusion server

Imaginile afișate în această aplicație au o rezoluție foarte bună; pentru a reduce timpul de afișare Google Earth utilizează memoria cache a calculatorului, astfel că în PC se salvează temporar o copie a hărții care duce la o creștere a ratei de transfer dintre dispozitiv și server. Un alt aspect tehnic se referă modul în care sunt afișate informațiile corespunzătoare hărților pe un calculator local. Tehnica Universal Texture permite procesarea datelor astfel încât acestea să poată fi afișate la diverse rezoluții și folosește două metode – mip mapping și clip stacking. Mip mapping este o colecție de imagini corelate, care reprezintă aceeași scenă la diverse rezoluții. Cele mai fine detalii sunt reprezentate la nivelul 0 al piramidei, iar următoarele niveluri au rezoluții înjumătățite pe fiecare dimensiune.

O zonă a unei hărți se afișează la un nivel superior de rezoluție folosind proiecția coordonatelor, transformări geometrice și proiecțiile în subspații corespunzătoare. Clip stack sunt porțiuni mipmaps de dimensiuni extreme tăiate la o dimensiune maximă specificată.

Google Maps

Google Maps este un serviciu care pe lângă aplicația de bază a integrat și Google Street View, Earth View și pune la dispoziția utilizatorilor imagini satelitare, trasee sau coordonate geografice. Imaginile satelitare disponibile nu sunt modificate în timp real, iar detaliile sunt afișate cu mai puțină acuratețe comparativ cu Google Earth. Anul 2014 a adus caracteristici noi pentru google maps precum posibilități de a genera pe hartă rute de tren sau avion, noi reprezentări 3D, generare liste de evenimente la căutarea unei locații, trafic inteligent prin predicția traficului pe baza datelor istorice, utilizare Street View pentru previzualizarea propriilor rute. Deși este un proiect mare și complex, serviciul permite utilizatorilor să adauge în baza de date drumuri sau clădiri noi, în urma unei verificări riguroase.

Stabilirea locațiilor pe harta Google Maps

Google Street este un serviciu înglobat atât în Google Earth cât și în Google Maps; cele două fiind aplicații ce permit stabilirea unui plan de călătorie, spre exemplu, prin indicarea locațiilor. Dacă Google Earth necesită instalarea unei aplicații pe parte de client, Google Maps permite selectarea propriei hărți doar la nivel de browser, fără nicio instalare suplimentară.

Gmail

Gmail este o aplicație web de e-mail și POP3 și oferă gratuit un spațiu de salvare pentru o adresă de email de 15G. Serviciul are integrat un motor de căutare pentru filtrarea unui email după caracteristici precum adresă destinatar, expeditor, conținut email sau subiect și un serviciu de etichetare automată a emailurilor. În același timp mai are integrate o rețeaua de socializare google+ (caracteristică a Web 2.0), opțiunea de sincronizare cu smartphone sau/și cloud, Google Groups – care permite comunicarea și colaborarea membrilor, definirea agendei. Un cont de email pe google permite definirea și gestionarea alertelor – aplicație utilă în mediul universitar atât pentru studenți cât și pentru profesori.

Google Docs

Serviciul permite crearea sau partajarea fișierelor în format word, excel sau Power Point. Fișierele pot fi salvate local însă implicit vor fi salvate pe server-ul Google de unde pot fi vizualizate în browser. Google Docs este un instrument colaborativ pentru editarea documentelor în timp real – permite modificarea, editarea, vizualizare de către mai mulți utilizatori simultan.

Editarea unui fișier în Google Docs

CAPITOLUL III. Realizarea unui blog

Proiectarea conceptuală

În proiectarea aplicației am pornit de la câteva cerințe generale :

Disponibilitatea online indiferent de oră sau zi;

Orice vizitator să găsească ȋn timp scurt informația dorită;

Aplicația să poată fi accesată indiferent de sistemul de operare sau de resursele hardware al stației.

Folosind aceste cerințe, am proiectat schema concepută in felul următor :

Schema conceptuală

Baza de date a fost proiectată ȋn MySql folosind programul xampp, deoarece interfața de adăugare a ȋnregistrărilor este prietenoasă și facilă. Conectarea bazei de date cu serverul localhost a fost făcută cu ajutorul programului Php. Totodată interogarea bazei de date a fost realizată tot cu ajutorul platformei php, deoarece aceasta permite implementarea dinamismului.

Programe necesare

Deoarece site-ul este dinamic, iar paginile sunt create ȋn php, cu extensia php, acesta nu se deschide ca o pagină html normală. Pentru deschiderea unui site dinamic, este necesară folosirea unui program special – in cazul nostru vom folosi programul xampp.

Modulul – APACHE este folosit pentru pornirea localhostului, iar MYSQL pentru baza de date.

Odată ce XAMPP este instalat, poți trata adresa de localhost a serverului XAMPP ca pe un server de la distanță, utilizând protocolul client FTP. Utilizarea unui program ca FileZilla are multe avantaje atunci când instalezi un [CMS[content management system]] (CMS) ca Joomla. Te poți deasemeni conecta la o gazdă locală prin FTP utilizând editorul HTML propriu.

Programul xampp

Odată deschis programul xampp pentru a accesa site-ul trebuie să intrăm ȋn browser (internet explorer, opera, google chrome, firefox) și ca adresă notăm următoarea : http://localhost/ .

Odată introdusă această adresă, serverul (pornit prin xampp) va prelua automat site-ul doar dacă există pagina index.php(aceasta fiind considerată prima pagină dintr-un site web), ȋn caz contrar se va afișa toate paginile din cadrul blogului ( vezi Anexa 1 )

Toate paginile au fost create cu ajutorul programului Adobe Macromedia Dreamweaver. ( vezi Anexa 2 )

Programul oferă mai multe opțiuni pentru scrierea codului, precum și modificarea unui site. Avem trei opțiuni de lucru ȋn cadrul acestui program(vezi Anexa 3) :

Opțiunea code;

Opțiunea split;

Opțiunea design.

Site-ul salvează automat paginile web ȋn format html/php, după preferințe.

Realizarea practică a unui blog

Antetul

O pagină din cadrul blogului este formată din trei părți :

Antet

Cuprins

Footer

Pagina index.php ce cuprinde toate cele 3 parti

La rândul său, ȋn antet putem observa :

„The B00k Blog” – numele site-ului;

Bara de meniu – Acasa, Articole, Dictionar, Servicii, Contact;

O poză;

O listă cu ultimele articole introduse;

Și un bec, ce are referință către o altă pagină.

Privire de ansamblu la antet

Fiecare item din antet are o referință către altă pagină (vezi Anexa 4) :

„The B00k Blog” – are referință către pagina principală index.php;

„Acasa” – are referință către pagina principală index.php;

„Articole” – are referință către pagina articole.php unde găsim o listă cu toate articolele ce au fost scrise ȋn cadrul blogului;

„Dictionar” – este un meniu tip drop-list. Acest meniu face legatura pe paginile dictionar.php?dictionar=roman, respectiv dictionar.php?dictionar=englez ȋn funcție de alegerea noastră. Dacă dam pur și simplu click pe „Dictionar” acesta ne redirecționează automat pe dicționarul român-englez.

„Servicii” – este pagina poate cea mai interesantă de pe blog. Pe această pagină am implementat câteva servicii Google, servicii precum Google Maps, Youtube și altele(vezi Anexa 5).

„Contact” – este pagina unde putem găsi datele de contact ale webmasterului (date de contact precum – număr de telefon, adresa și un formular de contact ).

Ultimele articole au referință către pagina – articol.php?id=$id, unde $id este id-ul fiecărui articol salvat ȋn baza noastră de date (id-ul unic după care putem găsi orice articol).

Becul este un hiperlink către pagina cauta.php, pagină unde putem pur și simplu să căutăm un cuvânt în tot blogul, în caz că este găsit, sunt listate toate articolele unde apare cuvantul respectiv.

Imaginea are doar caracter de design.

Codurile ce stau la baza creării paginii antet.php sunt foarte complexe dar ușor de folosit. Ele sunt împărțite în coduri html, php și script. Designul este oferit de manevrabilitatea codului html, partea de legătură cu baza de date cu php, iar unele animații sunt create cu ajutorul scripturilor.

Aceste coduri sunt scrise în programul „Macromedia Dreamweaver” – un program oferit de compania Adobe. Programul oferă foarte multe opțiuni pentru crearea și optimizarea site-urilor web. Posibilitatea de a lucra în paralel în codul sursă și de a vedea live rezultatele codului, oferă acestui program un plus in folosirea sa.

Modul design/cod al programului Macromedia Dreamweaver

Imaginile următoare reprezintă codul script pentru realizarea animației de aprindere/stingere a becului din cadrul paginii antet.php, codul propriu zis de adăugare a animației în cadrul paginii și animația propriu zisă. Codul ce face legătura spre pagina cauta.php este „<a href=”cauta.php”> </a>, cod ce poate fi observat in cea dea doua imagine (vezi Anexa 6).

Codurile scriptului java

Mai departe, lista cu ultimele articole este creată cu ajutorul php-ului. Mai jos sunt atașate două imagini – prima este imaginea codului php și a doua rezultatul propriu-zis al codului.

Secvența „<?php ?>” este secvența specifică php-ului prin care deschidem/ȋnchidem un cod php. Pentru a face legatura dintre site și baza de date avem nevoie de secvența „include(„conectare.php”); (ȋn pagina conectare.php sunt alte comenzi specifice lucrului cu baze de date – datorită codului include, noi doar adăugăm acea pagină fără ca să mai scriem ȋncă odată codul din cadrul ei).

Următoarele coduri sunt interogările ce le facem pentru a prelua datele din baza de date și să le afișăm. Putem observa faptul că vom afișa doar un număr de unsprezece articole($numar<=11) și pentru fiecare articol ȋn parte ȋi creăm un link către o alta pagină ce conține conținutul articolului ( <a href=”articol.php>).

Deoarece titlul unor articole este foarte lung, am ales o opțiune a codului php substr pentru a afișa doar primele douăzeci de cuvinte din cadrul titlului.

Designul listei este realizat cu ajutorul standardelelor CSS (Cascading Style Sheets ) care formatează elementele html aducând un plus considerabil în dezvoltarea activități webdesign. Aceste coduri sunt salvate în fisierul style din folderul css.

Codul sursa al listei de articole si rezultatul acestuia

Ultimele aspecte din cadrul antetului sunt imaginea adăugată, meniul și titlul paginii, aspecte realizate cu ajutorul codului HTML. Fiecare cod folosit ce se poate observa ȋn imagine are o ȋntrebuințare diferită :

<!DOCTYPE html> – este o declarație astfel încât browserul pe care îl folosim să știe ce fel de document este (în cazul nostru html);

<html> – este tagul prin care creem un fișier html

<head> – este esențial dacș vrem ca site-ul să aibă un titlu, sau să adăugăm scripturi în site;

<meta charset="UTF-8"> – este folosit pentru ca să se poată afișa pe site caractere cu diacritice;

cu ajutorul tagului <title> </title> putem introduce un titlu site-ului, ce poate fi observat sus în tab;

<link rel="stylesheet" href="css/style.css" type="text/css"> – face legatura dintre site și designul paginii;

<link rel="shortcut icon" href="images/favicon.png"> – adaugă o imagine ce poate fi observată sus în tab, înaintea titlului;

<img src="images/logo.png" > – este codul folosit pentru adăugarea imaginii ce se poate observa pe fundal;

<a href="index.php">Acasa</a> – creează link către pagina index.php

Tagurile <div> sunt o secțiune din cadrul html-ului care cu ajutorul css-ului fac parte din partea de design a site-ului.

Meniul este realizat dintr-o listă – se poate observa folosirea codului <ul> ( lista neordonată ) și respectiv a codului <li> ( listă ordonată ). Fiecare item al listei este o referință spre o altă pagină, referință creată prin folosirea codului <a href=””> </a> ( link-urile fac referinte la paginile index.php, articole.php, dictionar.php?dictionar=roman respectiv englez, servicii.php și contact.php ).

Deși pagina index.php conține elemente de html, extensia acesteia este .php deoarece conține și elemente de php. Totodată, această pagină este inclusă în celelalte pagini prin funcția include(“antet.php”); în codul sursă, ca motiv să nu mai scriem de fiecare dată tot codul paginii respective.

Secvența de ȋnchidere a tagului <html> este scrisă ȋn pagina footer.php, care la rândul său este la fel introdusă prin secvența include ȋn fiecare pagină ȋn parte.

Codul sursă al meniului

Cuprinsul

Secvența imediat următoare după antet este textul propriu-zis, adică cuprinsul paginii, ȋn care anexăm informațiile referitoare la postările din blog.

După cum se poate observa ȋn imaginea de mai jos, avem textul de ȋntâmpinare a vizitatorilor, ȋn care notăm succint ideea blogului, urmat de articolele propriu-zise.

Articolele sunt afișate câte patru pe linie, trei pe coloană ȋn total ultimele doisprezece articole pe prima pagină. Articolul ȋn sine este prezentat cu imaginea introdusă pentru fiecare articol ȋn parte și titlul acestuia.

Pentru fiecare articol ȋn parte se formează un link către pagina personală a acestuia, link creat prin tagul <a href=""> </a>. Fiecare pagină are un id unic prin care pot fi identificate și selectate din baza de date.

Prima pagina din blog

Codul sursă al paginii cuprins.php cuprinde toate secvențele necesare pentru a afișa articolele din baza de date ȋn ordinea ce urmează :

Se conecteză la baza de date prin secvența include(”conectare.php”)

Următoarele două secvențe preia datele din baza de date pentru a fi prelucrate de secvențele următoare;

În secvența repetitiva while afișăm articolele propriu-zise;

Se afișează doisprezece articole pe pagină ($numar<=12), patru pe linie( verificat prin comanda if );

Articolele sunt afișate prin comanda echo (specifică php-ului);

Mai ȋntâi afișăm imaginea prin img src concomitent cu crearea unui link asupra sa, după ce afișăm imaginea, afișăm și titlul postului cu tot cu link-ul aferent.

Codul sursa al paginii cuprins.php

Transmiterea datelor mai departe se face prin tagul specific php-ului “?” care se poate observa ȋn codul sursă de mai de sus. Pe pagina următoare se transmite id-ul unic al fiecărui post prin secventa $linie[‘id’] combinată ȋn link-ul aferent – articol.php?id=’.$linie[‘id’].’.

Folosirea ‘. .’ este necesară deoarece fără acest tag, $linie[‘id’] va fi trimis mai departe doar ca un char și nu ca valoarea ce o conține.

‘id’ din secvența anterioară este câmpul id din baza de date, care este id-ul unic prin care poate fi identificat un anume câmp, având valoarea de auto_increment, adică își crește singur valoarea ȋn funcție de câte posturi sunt adăugate pe blog.

Tabela blog din baza de date

Footerul

Pe fiecare pagină din cadrul blogului, la sfârșitul acesteia avem un footer exact identic la fiecare. Se poate observa ȋn partea stângă a paginii, numele celui care a creat site-ul, numărul total de articole ce se găsesc pe blog, precum și data curentă ( luna, ziua, data si ora ) – după cum se poate observa ȋn imaginile de mai jos.

Footerul care se gasește pe fiecare pagină din blog

Pentru a afișa numărul total de articole, trebuie să ne conectam mai ȋntâi la baza de date pentru a face interogările necesare.

Folosim interogarea SELECT pentru a prelua datele din baza de date și o variabilă locală ( ȋn cazul nostru am numit-o $nr) pentru a număra câte articole sunt, iar la final le vom afișa cu ajutorul comenzii echo ( comenzi ce se pot observa ȋn imaginea de mai jos ).

Codul sursa ce afiseaza numarul total de articole

Ca să afișăm luna și data de astăzi, ne vom folosi de câteva funcții ale limbajului php:

Setlocale;

Strftime;

Time;

date_default_timezone_set;

date;

Codul sursa ce afiseaza data si luna

Folosim aceste funcții deoarece nu putem să afișăm deodată data. Mai ȋntâi trebuie să setăm serverul la țara noastră( fiindcă ea este la default, adică setată pe țara USA).

După care afișăm luna curentă folosind funcția strftime care formatează stringul primit de setările locale (setări care au fost făcute cu funcția setlocale).

Cu ajutorul %B preluăm doar luna din tot stringul primit anterior, iar time formatează acel vector de caractere.

Ca să afișăm ora actuală, mai întâi trebuie să setăm fusul orar – folosind funcția date_default_timezone_set iar în paranteze notăm fusul, în cazul nostru Europe/Bucharest. După ce am setat fusul orar, cu ajutorul funcției date care formatează data curentă și o afișează ca un vector de cuvinte.

Odată creat vectorul, cu ajutorul cuvintelor specifice acestei funcții – d,m,Y,H,i,s – afișăm ce ne interesează din acel vector, astfel :

d – ziua lunii de la 01-30;

m – luna în format numeric;

Y – anul în format numeric din 4 cifre;

H – orele în format de la 0 -23 ;

i – minutele în format 0-59;

s – secundele în format 0-59.

Pagina articole.php

Pe pagina de articole – articole.php sunt afișate toate articolele care sunt salvate în baza de date. Când afișăm datele despre un articol, afișăm doar autorul acestuia precum și data când l-a scris, titlul, o poză sugestivă și o bucată mică din întreg articolul (mai exact 500 de cuvinte).

După cum se poate observa și în imaginea de mai jos, în partea stângă a paginii afișăm câteva detalii succinte despre articol(autor, titlul), în mijloc imaginea cu primele 500 de cuvinte din articol ( dacă sunt mai puțin de 500 le afisșază pe toate), iar imediat lângă un banner vertical făcut din pozele soldaților militari căzuți la datorie.

Pagina articole.php

Afișarea tuturor informațiilor se face ca pe celelalte pagini. Ne conectăm la baza de date și selectăm toate informațiile de acolo. După aceasta rulăm interogarea și începem să afișăm treptat datele ce ne interesează – întâi autorul și data ( folosind funcția substr din cadrul limbajului php vom afișa doar ziua,luna și anul în care a fost publicat articolul, fără oră), după care titlul articolului cu link către pagina sa personală.

La sfârșit afișăm primele 500 cuvinte din cadrul articolului – cu tot cu ajutorul funcției substr și tot cu link către pagina sa. Deoarece sunt multe articole, am fost nevoit să afișez doar cate șase pe pagină – de aici și variabila $numar ( vezi Anexa 7 ).

Pagina dictionar.php

Pagina dictionar.php este pagina destinată dicționarului român-englez. Pe această pagină putem observa textul “ Introdu cuvântul în română: “ precedat de un label – text field unde trebuie să introducem cuvântul pe care vrem să îl căutăm, după aia apăsăm pe butonul “Cauta” pentru a finaliza căutarea.

Inputul de introdus cuvantul

Dacă cuvântul se găsește în baza de date, atunci este afișat răspunsul căutării, în caz contrar apare mesaj că nu este gasit, dar apar alte cuvinte asemănătoare.

Afisarea cuvantului cautat/a mesajului in caz ca nu e gasit

Sursa paginii dictionar.php constă din două părți, partea cu formularul care face referire la scriptul php și scriptul php în sine.

Imaginea de mai jos este codul pentru formularul de căutare a cuvântului. Secvența action=”dictionar.php” este tagul cu care facem legătura între formular și scriptul php, script care primește datele însușite în form și le prelucrează analizând cuvântul introdus cu datele din baza de date.

Atributele value, onblur, onfocus sunt atribute ce țin de un label, atribute care menține mesajul „ Scrie aici cuvantul” ca atunci când se dă click în tabel acesta să dispară, pentru a putea fi introdus cuvântul căutat ( a se vedea în următoarele imagini adăugate ).

Butonul „Cauta” este un buton tip button, acțiune submit form, care trimite datele la pagina de prelucrare a datelor ( în cazul nostru, dictionar.php).

Inputul împreună cu butonul nu funcționează fără atributul form. Practic, formul este atributul de acțiune care trimite datele spre altă pagină pentru a fi prelucrate. Inputul doar salvează datele iar butonul face ca trimiterea lor să fie posibila. Toate aceste trei formuri nu pot acționa independent.

Codul sursa al formularului de cautare

Inputurile cu optiunea onblur si fara

Inputul, butonul de Cauta si form-ul

Codul sursă al paginii dicționar.php este un cod mai complex față de paginile precedente realizat dintr-o secvență php, care prelucrează datele trimise de formularul precedent și le afișează la ecran ( vezi Anexa 8 ).

Secvența php preia datele trimise de către formular, prin codul $_GET[“cuvant”] și i le atribuie unei variabile. După această secvență, se face legătura cu baza de date, pentru a verifica dacă cuvântul introdus se găsește în baza de date sau nu. Dacă se găsește, atunci se afișează cuvântul căutat și traducerea acesteia în limba dorită.

În caz contrar se afișează că nu a fost găsit, precum și un mesaj “Alte cuvinte asemanatoare” după care afișăm din baza de date toate cuvintele care încep cu grupul de cuvinte introdus ( afișarea făcându-se prin interogarea bazei de date și selectarea exclusive a grupului de cuvinte prin secvența LIKE “$cuvant%”).

Pagina contact.php

Pagina contact.php conține informații despre webmasterul acestui site. După cum se poate observa în imagine, pagina este formată din două părți :

Partea din stânga – ce conține un formular de contact, formular care trimite automat mail la cel care a creat acest site.

Partea din dreapta – unde se găsesc datele de contact ale webmasterului ( adresa, numere de telefon, adresa de google, mail, facebook și numărul de fax ).

Tot pe această pagină, mai putem observa implementată o imagine fix deasupra datelor, imagine introdusă prin codul <img src>.

La baza codului sursă stau doar coduri html, fără secvențe php. (vezi Anexa 9 ).

Pagina contact.php

Pagina articol.php

Pagina articol.php este pagina unde aflăm detalii despre fiecare articol în parte. Pe această pagină, putem observa titlul articolului, detalii privind acesta, precum și o imagine orientativă. Totodată jos în dreapta, am afișat detalii despre autorul articolului și data la care a fost scris acesta. Afișarea datelor se face prin interogarea bazei de date și preluarea lor de acolo.

Pagina articol .php

Deși pe pagină sunt afișate doar câteva detalii, codul sursă nu este așa ușor. În imaginea de mai jos, putem observa interogările bazei de date și prelucrarea lor din aceasta. Putem observa afișarea imaginii (img src), a titlului ( $linie[“titlu”] ), a conținutului ( $linie[“continut”] ) și nu în ultimul timp a autorului și a datei ($linie[“autor”],$linie[“data”]).

Codul sursa al paginii articol.php

Totodată, în cadrul paginii articol.php, la sfârșitul fiecărui articol postat, vizitatorii au posibilitatea de a lăsa un comentariu referitor la ce s-a scris. Nu este nevoie ca vizitatorul să fie înregistrat pentru a lăsa comentarii. Odată introdus mesajul + numele aferent, după ce utilizatorul apasă butonul Comentează, acesta automat prelucrează datele și le trimite în baza de date, apoi fiind afișate în pagina respectivă.

Dacă nu au fost completate toate câmpurile, atunci am setat ca să apară automat mesaj de eroare ( folosind limbajul java ) și nu se salvează niciun comentariu.

Campul de adaugare a comentariilor si mesajul de eroare

Mai jos putem observa codul prin care verificăm dacă au fost introduse date în câmpurile precedente. Dacă nu au fost introduse, se va afișa mesajul de tip pop-box ( alertă ) cu ajutorul scripturilor java.

După aceasta, dacă au fost introduse date în ambele câmpuri, atunci acele date le vom salva în baza de date, cu ajutorul interogării mysql – INSERT INTO.

Codul ce verifica introducerea datelor in formular

Imediat după prelucrarea și adăugarea datelor în baza de date, vom afișa toate comentariile specifice acestui articol din cadrul blogului. Vom folosi din nou interogările mysql, de data aceasta acea de selectare a tuturor informațiilor din baza de date ( SELECT * ) condiția fiind ca articolul de pe urma căreia vom afișa comentariul să fie egal cu id-ul nostru ( where `articol`=$ID).

Dacă este egal, atunci vom primi un răspuns afirmativ în urma interogării noastre, iar în structura repetitivă while, vom afișa toate rezultatele care le-am aflat. În caz contrar, nu se afișează nimic ( vezi Anexa 10 ).

Comentariile adăugate vor fi afișate imediat după adăugarea lor sub forma ce se poate observa în imaginea de mai jos. Întâi afișăm o linie despărțitoare ( cu ajutorul codului <hr> – horizontal line ), după care numele, urmat de comentariul vizitatorului.

Exemple de comentarii

Pagina cauta.php

Cum ziceam și înainte, atunci când dăm click pe becul din antetul site-ului, avem posibilitatea să căutăm un cuvânt în cadrul blogului. Pagina caută.php este aproape identică cu pagina dicționar.php, numai că aici căutăm un cuvânt în întreg cuprinsul articolului. Pentru aceasta, avem un input în care scriem cuvântul și un buton ca să trimitem datele pentru a fi procesate ( în cazul nostru, datele le trimitem tot pe pagina caută.php ).

Inputul de cautare a unui cuvant in dictionar

Dupa ce a fost introdus cuvântul, îl verificăm ca să nu fie scurt( să nu se caute cuvinte gen – ‘sa’,’daca’,’cum’ etc) adică numărul literelor să fie mai mare sau egal decât cinci. Folosind limbajul java, în cazul în care nu se respectă acest lucru, afișăm un mesaj corespunzător iar vizitatorul trebuie să scrie din nou cuvântul pentru a fi căutat.

Mesajul de eroare implementat in java

Dacă cuvântul introdus a fost găsit, serverul va afișa automat articolul/articolele ce conțin acest cuvânt cu un link către pagina sa personală pentru a putea fi citit în întregime. La fel ca și pe celelalte pagini, nu vom afișa articolul întreg, ci doar o mică parte din el, mai exact începutul sau primele 150 de cuvinte.

Rezultatele cautarii unui cuvant in blog

Dacă nu sa introdus niciun cuvânt atunci va apărea mesaj de eroare și totodată dacă cuvântul nu a fost găsit sau s-a introdus un grup de cuvinte, va apărea același mesaj, urmând ca utilizatorul să repete acțiunea.

Mesajul in cazul in care nu s-a gasit cuvantul

Pagina conectare.php

Pentru a ne conecta la site avem nevoie de câteva date pentru a face conexiunea între server și baza de date. După cum spuneam și mai devreme, localhost este considerat hostul pe care ținem serverul ( putem deasemenea să scriem ip-ul nostru), după care avem nevoie de un id ( ca atunci când ne înregistram pe un site id și parolă ), ( vezi Anexa 11 ) .

Comenzile php din pagina conectare.php, verifică și realizează legătura serverului cu baza de date. Comanda mysql_set_charset(“utf8a”) este o comandă pentru a permite blogului să afișeze cuvintele ce conțin diacritice.

Pagina administrator.php

Pentru a introduce articolele în baza de date, am creat o pagină separat de site, o pagină doar pentru cei care scriu articole – administrator.php. Tot în cadrul acestei pagini introducem și cuvintele în dicționar.

Pagina este făcută simplu, dintr-un formular ce conține un buton și patru inputuri – unul pentru titlu, altul pentru conținut, al treilea pentru autor și ultimul pentru imagine ( data introducandu-se automat din sistem – vezi Anexa 12 ).

Formularul de adaugare a articolelor

Iar pentru dicționar am folosit un buton și două inputuri.

Formularul de adaugare a cuvintelor in dictionary

Baza de date

Pentru a salva toate articolele și informațiile ce le putem găsi pe blog, am ales să folosim o bază de date mysql. Prelucrarea ei și manevrarea o facem cu ajutorul programului xampp ( care are inclus și modul de mysql). Pentru a avea acces la baza de date, trebuie să intrăm pe pagina de administrație a acesteia – €“ în cazul nostru localhost/phpmyadmin, unde vom crea o bază de date și vom face interogări asupra ei.

Mai întâi selectăm baza de date după care scriem numele licenței în tabelă și apăsăm pe buton Creează. După care primim mesaj că acțiunea a fost realizată cu succes.

Crearea bazei de date

Mesajul de confirmare

După ce am creat baza de date, trebuie să creem tabelele – conform imaginii de mai jos, vom crea atâtea tabele cât considerăm că avem nevoie.

Crearea tabelelor

După ce terminăm de creat tabelele, trebuie doar să le mai completăm cu informații. Informațiile le putem introduce în două moduri – ori din control panelul programului, ori introducându-le prin interogări în php ( în cazul nostru, am ales interogările php ).

În control panelul de la programul xampp, avem posibilitatea de a observa atât informațiile ce le-am introdus în baza de date, cât și structura acesteia ( după cum se poate observa în imaginile de mai jos – vezi Anexa 13).

Tabela dictionar cu interogarile

Structura tabelei dictionar

Toate tabelele ce le avem au un câmp numit id, care este câmpul unic după care cunoaștem articolele. De exemplu, dacă avem două articole asemănătoare singurul lucru prin care le putem deosebi este acel id.

Id-ul are funcție de auto-increment – adică își crește singur valoarea cu unu ( ne gândim la el ca la o numerotare a articolelor, doar că nu trebuie să o mai facem noi manual, ci o face sistemul automat), iar în comparație cu celelalte câmpuri acesta este de tip int ( integer) restul fiind text.

Legătura dintre site și baza de date o facem cu ajutorul unor comenzi php, după cum se poate observa în imaginea de mai jos. Aceste comenzi le-am salvat într-un fișier numit conectare.php și îl includem în fiecare pagină unde avem nevoie să ne conectăm la baza de date, folosind funcția php include(“conectare.php”) – facem acest lucru ca să nu scriem codul pe fiecare pagină în parte.

CONCLUZII FINALE

În ziua de azi, internetul este considerat cea mai bună și folosită sursă de informare. Site-urile de tip blog sunt cele mai folosite pentru o informare în masă a cetățenilor. Studiul prezentat în lucrare se bazează în primul rând pe identificarea tehnologiilor web folosite în proiectarea site-urilor dinamice și are ca scop crearea unui blog militar, pentru a expune mai ușor informațiile din cadrul sistemului MApN, precum și exemplificarea serviciilor oferite de compania Google cu aplicabilitate militară.

Dacă în primele două capitole ale lucrării am prezentat aspectele teoretice ce țin de tehnologia web și serviciile pe care le oferă compania google, în capitolul trei am ales un serviciu cu aplicabilitate militară și l-am implementat cu ajutorul acelor tehnologii identificate anterior.

Aplicația web implementată ce are ca scop informarea în masă a persoanelor din cadrul sistemului MApN oferă un plus manevrării informațiilor ce sunt deținute de sistem și a persoanelor cărora le sunt adresate aceste informații, ele fiind la o distanță de un click de a fi afișate la ecran.

Blog-ul poate fi ușor adaptat la specificul militar, dar și civil, astfel încât să corespundă noilor cerințe și provocări informaționale.

Având în vedere că folosim o bază de date pentru a salva toate informațiile ce urmează a fi afișate, avem posibilitatea de a păstra aceste informații o perioadă lungă de timp, deoarece înregistrările lor ocupă foarte puțin spațiu și sunt ușor de manevrat.

Site-ul are un design atractiv și o structură simplă ușor de utilizat atât de începători, cât și de restul persoanelor.

Lucrarea de față va fi unul dintre primii pași în informarea persoanelor militare cu ajutorul internetului și a calculatorului, și pe viitor sper să se acorde mai multă preocupare acestui fapt, pentru că este cel mai însemnat eveniment pentru progres și perfecțiune.

BIBLIOGRAFIE

Autori români:

Pătruț, Internet pentru începători, București, Editura Teora, 1998.

Sorin Huțanu, Crearea și programarea paginilor WEB, București, Editura L&S Infomat, 2005.

Traian Anghel, Instrumente web 2.0 utilizate in educatie, ALBASTRA

Traian Anghel, Programarea în PHP. Ghid practic, Iași, Editura Polirom, 2005.

Autori străini:

Aghaei S., Nematbakhsh M.A., Farsani H.K., Evolution of the World Wide Web: From Web 1.0 to Web 4.0, in International Journal of Web & Semantic Technology (IJWesT) vol. 3, no. 1, 2012

Knight K. SMT Tutorial 2003, disponibil la: http://people.csail.mit.edu/koehn/publications/tutorial2003.pdf

Tim O'Reilly, What Is Web 2.0

S. Buraga, Tehnologii Web, Matrix Rom, București, 2001

S. Buraga, Proiectarea siturilor Web, Polirom, Iași, 2002

Manuel Castells, The Rise Of The Network Society – Economy, Society And Culture, Blackwell Publishers, 2000

Alain Strowel, Cand google sfideaza dreptul, ROSETTI EDUCATIONAL, 2012

Robin Nixon, Learning PHP, MySQL, JavaScript, CSS & HTML5, O'REILLY,2014

Steve Suehring, PHP, MySQL, JavaScript & HTML5 All-in-one For Dummies, Wiley, 2013

Paul Dixon, Java

David A Vise, Google Story

Howie Jacobson, Google AdWords For Dummies, Wiley, 2012

Avinash Kaushik, Web Analytics 2.0, SYBEX

John R Levine, Internet For Dummies

Dennis, Networking in the Internet Age

Adam Sutherland, YouTube, Hachette Kids Hodder Wayland, 2014

Joy Cho Ilasco Bonney, Blog, Inc., Chronicle Books, 2012

How to Blog Made Easy, Flame Tree Publishing Co Ltd, 2014

Infografie:

http://ro.wikipedia.org/wiki/Site_web, accesat în 26.04.2014

http://ro.wikipedia.org/wiki/Adsense, accesat în 23.04.2014

http://ro.wikipedia.org/wiki/Gmail, accesat în 23.04.2014

http://ro.wikipedia.org/wiki/Google_Cărți, accesat în 23.04.2014

http://ro.wikipedia.org/wiki/World_Wide_Web, accesat în 26.04.2014

http://ro.wikipedia.org/wiki/Hărți_Google, accesat în 30.04.2014

http://ro.wikipedia.org/wiki/Web_2.0, accesat în 26.04.2014

http://ro.wikipedia.org/wiki/YouTube, accesat în 26.04.2014

http://ro.wikipedia.org/wiki/VEVO, accesat în 26.04.2014

http://ro.wikipedia.org/wiki/Google_Earth, accesat în 27.04.2014

http://www.competentedigitale.ro/html/pagini_web.html, accesat în 30.04.2014

http://www.google.ro/intl/ro/adwords/start/benefits/, accesat în 30.04.2014

http://fanatic-web.blogspot.ro/, accesat în 27.04.2014

http://ro.wikipedia.org/wiki/HyperText_Markup_Language, accesat în 27.04.2014

http://ro.wikipedia.org/wiki/PHP, accesat în 27.04.2014

http://www.w3schools.com/html/default.asp, accesat în 29.04.2014

http://www.w3schools.com/css/default.asp, accesat în 29.04.2014

http://www.w3schools.com/js/default.asp, accesat în 29.04.2014

http://www.w3schools.com/php/default.asp, accesat în 29.04.2014

http://www.w3schools.com/sql/default.asp, accesat în 29.04.2014

ANEXE

Anexa 1

Afisarea paginilor fara pagina index.php

Anexa 2

Adobe Macromedia Dreamweaver

Anexa 3

Optiunea de “code”

Optiunea de “split”

Optiunea de “design”

Anexa 4

<div class="header">

<div>

<a href="index.php" id="logo"><img src="images/logo.png" alt="logo" border="0"></a>

<ul>

<li>

<a href="index.php">Acasa</a>

</li>

<li>

<a href="articole.php">Articole</a>

</li>

<li>

<a href="dictionar.php?dictionar=roman">Dictionar</a>

<ul>

<li>

<a href="dictionar.php?dictionar=roman">Roman-Englez</a>

</li>

<li>

<a href="dictionar.php?dictionar=englez">Englez-Roman</a>

</li>

</ul>

</li>

<li>

<a href="servicii.php">servicii </a> </li>

<li><a href="contact.php">Contact</a></li>

</ul>

</div>

Codul ”antet.php”

Anexa 5

SERVICII GOOGLE

Anexa 6

<script type="text/JavaScript">

<!–

function MM_swapImgRestore() { //v3.0

var i,x,a=document.MM_sr; for(i=0;a&&i<a.length&&(x=a[i])&&x.oSrc;i++) x.src=x.oSrc;

}

function MM_preloadImages() { //v3.0

var d=document; if(d.images){ if(!d.MM_p) d.MM_p=new Array();

var i,j=d.MM_p.length,a=MM_preloadImages.arguments; for(i=0; i<a.length; i++)

if (a[i].indexOf("#")!=0){ d.MM_p[j]=new Image; d.MM_p[j++].src=a[i];}}

}

function MM_findObj(n, d) { //v4.01

var p,i,x; if(!d) d=document; if((p=n.indexOf("?"))>0&&parent.frames.length) {

d=parent.frames[n.substring(p+1)].document; n=n.substring(0,p);}

if(!(x=d[n])&&d.all) x=d.all[n]; for (i=0;!x&&i<d.forms.length;i++) x=d.forms[i][n];

for(i=0;!x&&d.layers&&i<d.layers.length;i++) x=MM_findObj(n,d.layers[i].document);

if(!x && d.getElementById) x=d.getElementById(n); return x;

}

function MM_swapImage() { //v3.0

var i,j=0,x,a=MM_swapImage.arguments; document.MM_sr=new Array; for(i=0;i<(a.length-2);i+=3)

if ((x=MM_findObj(a[i]))!=null){document.MM_sr[j++]=x; if(!x.oSrc) x.oSrc=x.src; x.src=a[i+2];}

}

//–>

</script>

Codul scriptului java

<div class="layer1">

<a href="cauta.php" onMouseOut="MM_swapImgRestore()" onMouseOver="MM_swapImage('Image3','','images/bec2.png',1)"><img src="images/bec.png" name="Image3" width="250" height="396" border="0"></a>

Nu gasesti ceva ? E simplu. Aprinde becul !

</div>

Codul scriptului java de afisare in browser

Imaginea codului java

Anexa 7

<?php

include("conectare.php");

$afisare="SELECT * FROM blog ";

$sql=mysql_query($afisare);

$numar=0;

while($linie=mysql_fetch_array($sql) and $numar!=6)

{

echo '<div> <div>';

echo'<span>Autor : '.$linie['autor'].' | '.substr($linie["data"], 8, 20).'</span>';

echo'<h3><a href="articol.php?id='.$linie["id"].'">'.$linie['titlul'].'</a></h3></div>

<div><img src="files/'.$linie['poza'].'" width="450" height="350">

<p>'.substr($linie["continut"], 0, 500).' <br> <a href="articol.php?id='.$linie['id'].'">

[ Citeste mai mult … ]</a></p> </div> </div>';

$numar++;

}

?>

Codul paginii articole.php

Anexa 8

<form id="" action="dictionar.php">

<input name="cuvant" class="input" type="text" value="Scrie aici cuvantul"

onblur="if(this.value=='') this.value='Scrie aici cuvantul'"

onfocus="if(this.value =='Scrie aici cuvantul' ) this.value=''">

<label><input type="submit" name="Submit" value="Cauta" /> </label>

</form>

<?php

if (isset($_GET["cuvant"]))

{

include("conectare.php");

$cuvant=$_GET["cuvant"];

$gasit=0;

$sql=mysql_query("SELECT * FROM dictionar");

while($linie=mysql_fetch_array($sql))

if($linie['roman']==$cuvant)

{

echo "<br>";

echo $linie['roman'].' = '.$linie['engleza'];

$gasit=1;

}

if($gasit==0)

{

echo '<br>Cuvantul nu a fost gasit<br>' ;

echo ' Alte cuvinte asemanatoare : <br> ';

$sql=mysql_query("SELECT * FROM dictionar WHERE `roman` LIKE '$cuvant%'");

while($linie=mysql_fetch_array($sql))

{

echo "<br>";

echo $linie['roman'].' = '.$linie['engleza'];

$gasit=1;

}

}

}

?>

Codul paginii dictionar.php

Anexa 9

<div class="body">

<div class="locator">

<div class="search">

<h3 align="center">Trimite mesaj privat </h3>

<form action="privat.php">

<label for="country">Adresa de mail </label>

<input type="text" id="country" value="[anonimizat]" onBlur="if(this.value=='') this.value='[anonimizat]'" onFocus="if(this.value =='[anonimizat]' ) this.value=''">

<label for="city">mesajul</label>

<label>

<textarea name="textfield" rows="20" value="Scrie mesajul! " onBlur="if(this.value=='') this.value='Scrie mesajul ! '" onFocus="if(this.value =='Scrie mesajul ! ' ) this.value=''" ></textarea>

</label>

<input type="submit" value="Trimite mesajul ! " id="submit">

</form>

</div>

<img src="images/ContactUs.gif" width="728" height="315">

<ul>

<li>

<div>

<h4>Vaslui</h4>

<p>Strada Pacii,<br>

Bloc 364, Scara A, <br>

Apartament 4, Etaj 4, Vaslui<br>

Numar telefon : 0748 616 998 </p>

<a href="#">Contacteaza-ne</a>

</div>

</li>

<li>

<div>

<h4>sibiu</h4>

<p>

Strada revolutiei,

<br>

Nr. 3-5,

Academia Fortelor <br>

Terestre &quot; Nicolae Balcescu &quot; Sibiu<br>

Numar fax : + + 40 – 269 – 215 554</p>

<a href="#">Contacteaza-ne</a> </div>

</li>

<li>

<div>

<h4>Contact</h4>

<p>Adresa google : [anonimizat]<br>

Adresa mail : [anonimizat]<br>

Facebook : www.facebook.com/ariton<br>

Numar birou : + 40 – 0335 408 509

</p>

<a href="#">Contacteaza-ne</a> </div>

</li>

</ul>

</div>

</div>

Codul paginii contact.php

Anexa 10

if(isset($_GET['com']))

{

$id=$_GET['id'];

if(empty($_POST['comentariu']) || empty($_POST['nume']))

echo '<script>alert("Nu au fost completate toate campurile")</script>';

else

{

$comentariu=$_POST['comentariu'];

$nume=$_POST['nume'];

$coment_baza=("INSERT INTO `comentarii` (`comentariu`,`articol`,`nume`) VALUES ('$comentariu','$id','$nume')");

$adauga=mysql_query($coment_baza);

}

}

$afisare="SELECT * FROM comentarii where `articol`=$ID";

$sql=mysql_query($afisare);

while($linie=mysql_fetch_array($sql))

{

echo 'Nume :';

echo $linie['nume'];

echo '<br>';

echo 'Comentariu : ';

echo $linie['comentariu'];

echo '<hr>';

echo '<br>';

Codul scriptului de comentarii

Anexa 11

<?php

$id="root";

$parola="";

$conectare=mysql_connect("localhost",$id,$parola);

mysql_set_charset('utf8');

if(!$conectare)

{

echo "Conectare la server nereusita!";

exit;

}

$baza = mysql_select_db("licenta") ;

if(!$baza)

{

echo"Baza de date inexistenta !";

exit;

}

?>

Codul paginii conectare.php

Anexa 12

<?php

include("conectare.php");

if ( isset($_POST["titlul"]) or isset($_POST["continut"]) or isset($_POST["autor"]) or isset($_POST["cuvantromana"]) or isset($_POST["cuvantengleza"]) )

{

if($_GET["tip"]=='articol')

{

$titlul=$_POST["titlul"];

$continut=$_POST["continut"];

$autor=$_POST["autor"];

// Verificam daca toate campurile au fost completate

if(empty($titlul) || empty($continut) || empty($autor))

echo '<script> alert("Nu ati completat toate campurile ! ")</script>';

else

{

// Poza !

//titlulle fisierului.

$filename = "poza.bmp";

//Aflam extensia fisierului.

$ext = substr($filename, strpos($filename,'.'), strlen($filename)-1);

// Definim un array cu tipurile de fisiere suportate (de ex. jpg/gif/bmp/png)

$allowed_filetypes = array('.jpg','.gif','.bmp','.png','.JPG','.GIP','.BMP','.PNG','JPEG','jpeg');

// Marimea maxima a unui fisier (0.5MB)

$max_filesize = 524288;

// Definim calea catre directorul ce contine fisierele incarcate (files)

$upload_path = './files/';

// Preluam titlulle fisierului din formular

$filename = $_FILES['userfile']['name'];

// Aflam extensia fisierului

$ext = substr($filename, strpos($filename,'.'),

strlen($filename)-1);

// Verificam daca fisierul este acceptat. (jpg/gif/bmp/png)

if(!in_array($ext,$allowed_filetypes))

die('Acest fisier nu este acceptat.');

// Verificam marimea fisierului (max 0.5MB)

if(filesize($_FILES['userfile']['tmp_name']) > $max_filesize)

die('Marimea fisierului este mai mare de 0.5MB.');

// Cream folderul "files" daca acesta nu exista

if (!is_dir('files')) {

mkdir('files', 0777);

}

// Verifica daca folderul exista si poate fi accesat. (files)

if(!is_writable($upload_path))

die('Folderul specificat nu poate fi accesat. (CHMOD 777)');

// Mutam fisierul in folderul specificat. (files)

if(move_uploaded_file($_FILES['userfile']['tmp_name'],$upload_path . $filename))

echo 'Fisierul a fost salvat cu succes.<br>';

else

echo 'A aparut o eroare. Mai incearca odata.';

$poza=$filename;

// alegerea unui fus orar

date_default_timezone_set( 'Europe/Bucharest' );

$y=date( 'H.i.s d.m.Y' );

echo $y;

echo '<br>';

setlocale( LC_TIME , 'ROM_ROM' );

$x=("INSERT INTO `blog` (`titlul`,`continut`,`poza`,`data`,`autor`) VALUES ('$titlul','$continut','$poza','$y','$autor')");

$y=mysql_query($x);

if($y)

echo "Articolul a fost adaugat cu succes !";

else echo " Nu s-a adaugat niciun articol ";

echo "<br>";

echo '<meta http-equiv="refresh" content="3; url=administrator.php">';

}

}

else

if(empty($_POST['cuvantromana']) or empty($_POST['cuvantengleza']))

echo '<script> alert("Nu ati completat toate campurile ! ")</script>';

else

{

$cuvantroman=$_POST["cuvantromana"];

$cuvantenglez=$_POST["cuvantengleza"];

$x=("INSERT INTO `dictionar` (`roman`,`engleza`) VALUES ('$cuvantroman','$cuvantenglez')");

$y=mysql_query($x);

if($y)

echo "Cuvantul a fost adaugat cu succes !<br>";

else echo " Nu s-a adaugat niciun cuvant <br> ";

echo "<br>";

echo '<meta http-equiv="refresh" content="3; url=administrator.php">';

}

}

?>

<h3>Adauga articole </h3>

<table width="1158" border="0">

<tr>

<th width="457" scope="col"> <form action="administrator.php?tip=articol" method="post" enctype="multipart/form-data">

<table width="1020" border="0">

<tr>

<th width="61" scope="row"><div align="left">Titlu : </div></th>

<td width="675"><div align="left">

<input name="titlul" type="text" id="titlul" size="100" />

</div></td>

</tr>

<tr>

<th scope="row"><div align="left">Continut : </div></th>

<td><div align="left">

<textarea name="continut" cols="100" rows="35" id="continut"></textarea>

</div></td>

</tr>

<tr>

<th scope="row"><div align="left">Autor : </div></th>

<td><div align="left">

<input name="autor" type="text" id="email" size="100" />

</div></td>

</tr>

<tr>

<th scope="row"><div align="left">Upload poza profil: </div></th>

<td><div align="left">

<input name="userfile" type="file" id="file" size="50" />

</div></td>

</tr>

<tr>

<th colspan="2" scope="row"><div align="center">

<input type="submit" name="register" id="register" value="Adauga articol" />

</div></th>

</tr>

</table>

</form></th>

<form action="administrator.php?tip=dictionar" method="post">

<br />

</form>

</tr>

</table>

<hr />

<table width="697" border="0">

<tr>

<form action="administrator.php?tip=dictionar" method="post">

<th width="584" scope="col"> <table width="475" border="0">

<tr>

<th colspan="2" scope="col"><div align="left">Adauga cuvinte in dictionar </div></th>

</tr>

<tr>

<th width="276" scope="row"><div align="left">Introdu cuvantul in romana : </div></th>

<td width="183"><div align="left">

<input name="cuvantromana" type="text" id="cuvantromana" />

</div></td>

</tr>

<tr>

<th scope="row"><div align="left">Introdu cuvantul in engleza : </div></th>

<td><div align="left">

<input name="cuvantengleza" type="text" id="cuvantengleza" />

</div></td>

</tr>

<tr>

<th colspan="2" scope="row"><div align="center">

<input type="submit" name="Submit" value="Adauga cuvant" />

</div></th>

</tr>

</table></th>

<br />

</form>

</tr>

</table>

Codul paginii administrator.php

Anexa 13

Tabela “blog” din baza de date

Campurile din tabela blog

Tabela comentarii

Campurile cu informatiile introduse din tabela comentarii

Informatiile introduse din tabela blog

Tabela dictionar

Informatiile introduse in tabela dictionar

BIBLIOGRAFIE

Autori români:

Pătruț, Internet pentru începători, București, Editura Teora, 1998.

Sorin Huțanu, Crearea și programarea paginilor WEB, București, Editura L&S Infomat, 2005.

Traian Anghel, Instrumente web 2.0 utilizate in educatie, ALBASTRA

Traian Anghel, Programarea în PHP. Ghid practic, Iași, Editura Polirom, 2005.

Autori străini:

Aghaei S., Nematbakhsh M.A., Farsani H.K., Evolution of the World Wide Web: From Web 1.0 to Web 4.0, in International Journal of Web & Semantic Technology (IJWesT) vol. 3, no. 1, 2012

Knight K. SMT Tutorial 2003, disponibil la: http://people.csail.mit.edu/koehn/publications/tutorial2003.pdf

Tim O'Reilly, What Is Web 2.0

S. Buraga, Tehnologii Web, Matrix Rom, București, 2001

S. Buraga, Proiectarea siturilor Web, Polirom, Iași, 2002

Manuel Castells, The Rise Of The Network Society – Economy, Society And Culture, Blackwell Publishers, 2000

Alain Strowel, Cand google sfideaza dreptul, ROSETTI EDUCATIONAL, 2012

Robin Nixon, Learning PHP, MySQL, JavaScript, CSS & HTML5, O'REILLY,2014

Steve Suehring, PHP, MySQL, JavaScript & HTML5 All-in-one For Dummies, Wiley, 2013

Paul Dixon, Java

David A Vise, Google Story

Howie Jacobson, Google AdWords For Dummies, Wiley, 2012

Avinash Kaushik, Web Analytics 2.0, SYBEX

John R Levine, Internet For Dummies

Dennis, Networking in the Internet Age

Adam Sutherland, YouTube, Hachette Kids Hodder Wayland, 2014

Joy Cho Ilasco Bonney, Blog, Inc., Chronicle Books, 2012

How to Blog Made Easy, Flame Tree Publishing Co Ltd, 2014

Infografie:

http://ro.wikipedia.org/wiki/Site_web, accesat în 26.04.2014

http://ro.wikipedia.org/wiki/Adsense, accesat în 23.04.2014

http://ro.wikipedia.org/wiki/Gmail, accesat în 23.04.2014

http://ro.wikipedia.org/wiki/Google_Cărți, accesat în 23.04.2014

http://ro.wikipedia.org/wiki/World_Wide_Web, accesat în 26.04.2014

http://ro.wikipedia.org/wiki/Hărți_Google, accesat în 30.04.2014

http://ro.wikipedia.org/wiki/Web_2.0, accesat în 26.04.2014

http://ro.wikipedia.org/wiki/YouTube, accesat în 26.04.2014

http://ro.wikipedia.org/wiki/VEVO, accesat în 26.04.2014

http://ro.wikipedia.org/wiki/Google_Earth, accesat în 27.04.2014

http://www.competentedigitale.ro/html/pagini_web.html, accesat în 30.04.2014

http://www.google.ro/intl/ro/adwords/start/benefits/, accesat în 30.04.2014

http://fanatic-web.blogspot.ro/, accesat în 27.04.2014

http://ro.wikipedia.org/wiki/HyperText_Markup_Language, accesat în 27.04.2014

http://ro.wikipedia.org/wiki/PHP, accesat în 27.04.2014

http://www.w3schools.com/html/default.asp, accesat în 29.04.2014

http://www.w3schools.com/css/default.asp, accesat în 29.04.2014

http://www.w3schools.com/js/default.asp, accesat în 29.04.2014

http://www.w3schools.com/php/default.asp, accesat în 29.04.2014

http://www.w3schools.com/sql/default.asp, accesat în 29.04.2014

ANEXE

Anexa 1

Afisarea paginilor fara pagina index.php

Anexa 2

Adobe Macromedia Dreamweaver

Anexa 3

Optiunea de “code”

Optiunea de “split”

Optiunea de “design”

Anexa 4

<div class="header">

<div>

<a href="index.php" id="logo"><img src="images/logo.png" alt="logo" border="0"></a>

<ul>

<li>

<a href="index.php">Acasa</a>

</li>

<li>

<a href="articole.php">Articole</a>

</li>

<li>

<a href="dictionar.php?dictionar=roman">Dictionar</a>

<ul>

<li>

<a href="dictionar.php?dictionar=roman">Roman-Englez</a>

</li>

<li>

<a href="dictionar.php?dictionar=englez">Englez-Roman</a>

</li>

</ul>

</li>

<li>

<a href="servicii.php">servicii </a> </li>

<li><a href="contact.php">Contact</a></li>

</ul>

</div>

Codul ”antet.php”

Anexa 5

SERVICII GOOGLE

Anexa 6

<script type="text/JavaScript">

<!–

function MM_swapImgRestore() { //v3.0

var i,x,a=document.MM_sr; for(i=0;a&&i<a.length&&(x=a[i])&&x.oSrc;i++) x.src=x.oSrc;

}

function MM_preloadImages() { //v3.0

var d=document; if(d.images){ if(!d.MM_p) d.MM_p=new Array();

var i,j=d.MM_p.length,a=MM_preloadImages.arguments; for(i=0; i<a.length; i++)

if (a[i].indexOf("#")!=0){ d.MM_p[j]=new Image; d.MM_p[j++].src=a[i];}}

}

function MM_findObj(n, d) { //v4.01

var p,i,x; if(!d) d=document; if((p=n.indexOf("?"))>0&&parent.frames.length) {

d=parent.frames[n.substring(p+1)].document; n=n.substring(0,p);}

if(!(x=d[n])&&d.all) x=d.all[n]; for (i=0;!x&&i<d.forms.length;i++) x=d.forms[i][n];

for(i=0;!x&&d.layers&&i<d.layers.length;i++) x=MM_findObj(n,d.layers[i].document);

if(!x && d.getElementById) x=d.getElementById(n); return x;

}

function MM_swapImage() { //v3.0

var i,j=0,x,a=MM_swapImage.arguments; document.MM_sr=new Array; for(i=0;i<(a.length-2);i+=3)

if ((x=MM_findObj(a[i]))!=null){document.MM_sr[j++]=x; if(!x.oSrc) x.oSrc=x.src; x.src=a[i+2];}

}

//–>

</script>

Codul scriptului java

<div class="layer1">

<a href="cauta.php" onMouseOut="MM_swapImgRestore()" onMouseOver="MM_swapImage('Image3','','images/bec2.png',1)"><img src="images/bec.png" name="Image3" width="250" height="396" border="0"></a>

Nu gasesti ceva ? E simplu. Aprinde becul !

</div>

Codul scriptului java de afisare in browser

Imaginea codului java

Anexa 7

<?php

include("conectare.php");

$afisare="SELECT * FROM blog ";

$sql=mysql_query($afisare);

$numar=0;

while($linie=mysql_fetch_array($sql) and $numar!=6)

{

echo '<div> <div>';

echo'<span>Autor : '.$linie['autor'].' | '.substr($linie["data"], 8, 20).'</span>';

echo'<h3><a href="articol.php?id='.$linie["id"].'">'.$linie['titlul'].'</a></h3></div>

<div><img src="files/'.$linie['poza'].'" width="450" height="350">

<p>'.substr($linie["continut"], 0, 500).' <br> <a href="articol.php?id='.$linie['id'].'">

[ Citeste mai mult … ]</a></p> </div> </div>';

$numar++;

}

?>

Codul paginii articole.php

Anexa 8

<form id="" action="dictionar.php">

<input name="cuvant" class="input" type="text" value="Scrie aici cuvantul"

onblur="if(this.value=='') this.value='Scrie aici cuvantul'"

onfocus="if(this.value =='Scrie aici cuvantul' ) this.value=''">

<label><input type="submit" name="Submit" value="Cauta" /> </label>

</form>

<?php

if (isset($_GET["cuvant"]))

{

include("conectare.php");

$cuvant=$_GET["cuvant"];

$gasit=0;

$sql=mysql_query("SELECT * FROM dictionar");

while($linie=mysql_fetch_array($sql))

if($linie['roman']==$cuvant)

{

echo "<br>";

echo $linie['roman'].' = '.$linie['engleza'];

$gasit=1;

}

if($gasit==0)

{

echo '<br>Cuvantul nu a fost gasit<br>' ;

echo ' Alte cuvinte asemanatoare : <br> ';

$sql=mysql_query("SELECT * FROM dictionar WHERE `roman` LIKE '$cuvant%'");

while($linie=mysql_fetch_array($sql))

{

echo "<br>";

echo $linie['roman'].' = '.$linie['engleza'];

$gasit=1;

}

}

}

?>

Codul paginii dictionar.php

Anexa 9

<div class="body">

<div class="locator">

<div class="search">

<h3 align="center">Trimite mesaj privat </h3>

<form action="privat.php">

<label for="country">Adresa de mail </label>

<input type="text" id="country" value="[anonimizat]" onBlur="if(this.value=='') this.value='[anonimizat]'" onFocus="if(this.value =='[anonimizat]' ) this.value=''">

<label for="city">mesajul</label>

<label>

<textarea name="textfield" rows="20" value="Scrie mesajul! " onBlur="if(this.value=='') this.value='Scrie mesajul ! '" onFocus="if(this.value =='Scrie mesajul ! ' ) this.value=''" ></textarea>

</label>

<input type="submit" value="Trimite mesajul ! " id="submit">

</form>

</div>

<img src="images/ContactUs.gif" width="728" height="315">

<ul>

<li>

<div>

<h4>Vaslui</h4>

<p>Strada Pacii,<br>

Bloc 364, Scara A, <br>

Apartament 4, Etaj 4, Vaslui<br>

Numar telefon : 0748 616 998 </p>

<a href="#">Contacteaza-ne</a>

</div>

</li>

<li>

<div>

<h4>sibiu</h4>

<p>

Strada revolutiei,

<br>

Nr. 3-5,

Academia Fortelor <br>

Terestre &quot; Nicolae Balcescu &quot; Sibiu<br>

Numar fax : + + 40 – 269 – 215 554</p>

<a href="#">Contacteaza-ne</a> </div>

</li>

<li>

<div>

<h4>Contact</h4>

<p>Adresa google : [anonimizat]<br>

Adresa mail : [anonimizat]<br>

Facebook : www.facebook.com/ariton<br>

Numar birou : + 40 – 0335 408 509

</p>

<a href="#">Contacteaza-ne</a> </div>

</li>

</ul>

</div>

</div>

Codul paginii contact.php

Anexa 10

if(isset($_GET['com']))

{

$id=$_GET['id'];

if(empty($_POST['comentariu']) || empty($_POST['nume']))

echo '<script>alert("Nu au fost completate toate campurile")</script>';

else

{

$comentariu=$_POST['comentariu'];

$nume=$_POST['nume'];

$coment_baza=("INSERT INTO `comentarii` (`comentariu`,`articol`,`nume`) VALUES ('$comentariu','$id','$nume')");

$adauga=mysql_query($coment_baza);

}

}

$afisare="SELECT * FROM comentarii where `articol`=$ID";

$sql=mysql_query($afisare);

while($linie=mysql_fetch_array($sql))

{

echo 'Nume :';

echo $linie['nume'];

echo '<br>';

echo 'Comentariu : ';

echo $linie['comentariu'];

echo '<hr>';

echo '<br>';

Codul scriptului de comentarii

Anexa 11

<?php

$id="root";

$parola="";

$conectare=mysql_connect("localhost",$id,$parola);

mysql_set_charset('utf8');

if(!$conectare)

{

echo "Conectare la server nereusita!";

exit;

}

$baza = mysql_select_db("licenta") ;

if(!$baza)

{

echo"Baza de date inexistenta !";

exit;

}

?>

Codul paginii conectare.php

Anexa 12

<?php

include("conectare.php");

if ( isset($_POST["titlul"]) or isset($_POST["continut"]) or isset($_POST["autor"]) or isset($_POST["cuvantromana"]) or isset($_POST["cuvantengleza"]) )

{

if($_GET["tip"]=='articol')

{

$titlul=$_POST["titlul"];

$continut=$_POST["continut"];

$autor=$_POST["autor"];

// Verificam daca toate campurile au fost completate

if(empty($titlul) || empty($continut) || empty($autor))

echo '<script> alert("Nu ati completat toate campurile ! ")</script>';

else

{

// Poza !

//titlulle fisierului.

$filename = "poza.bmp";

//Aflam extensia fisierului.

$ext = substr($filename, strpos($filename,'.'), strlen($filename)-1);

// Definim un array cu tipurile de fisiere suportate (de ex. jpg/gif/bmp/png)

$allowed_filetypes = array('.jpg','.gif','.bmp','.png','.JPG','.GIP','.BMP','.PNG','JPEG','jpeg');

// Marimea maxima a unui fisier (0.5MB)

$max_filesize = 524288;

// Definim calea catre directorul ce contine fisierele incarcate (files)

$upload_path = './files/';

// Preluam titlulle fisierului din formular

$filename = $_FILES['userfile']['name'];

// Aflam extensia fisierului

$ext = substr($filename, strpos($filename,'.'),

strlen($filename)-1);

// Verificam daca fisierul este acceptat. (jpg/gif/bmp/png)

if(!in_array($ext,$allowed_filetypes))

die('Acest fisier nu este acceptat.');

// Verificam marimea fisierului (max 0.5MB)

if(filesize($_FILES['userfile']['tmp_name']) > $max_filesize)

die('Marimea fisierului este mai mare de 0.5MB.');

// Cream folderul "files" daca acesta nu exista

if (!is_dir('files')) {

mkdir('files', 0777);

}

// Verifica daca folderul exista si poate fi accesat. (files)

if(!is_writable($upload_path))

die('Folderul specificat nu poate fi accesat. (CHMOD 777)');

// Mutam fisierul in folderul specificat. (files)

if(move_uploaded_file($_FILES['userfile']['tmp_name'],$upload_path . $filename))

echo 'Fisierul a fost salvat cu succes.<br>';

else

echo 'A aparut o eroare. Mai incearca odata.';

$poza=$filename;

// alegerea unui fus orar

date_default_timezone_set( 'Europe/Bucharest' );

$y=date( 'H.i.s d.m.Y' );

echo $y;

echo '<br>';

setlocale( LC_TIME , 'ROM_ROM' );

$x=("INSERT INTO `blog` (`titlul`,`continut`,`poza`,`data`,`autor`) VALUES ('$titlul','$continut','$poza','$y','$autor')");

$y=mysql_query($x);

if($y)

echo "Articolul a fost adaugat cu succes !";

else echo " Nu s-a adaugat niciun articol ";

echo "<br>";

echo '<meta http-equiv="refresh" content="3; url=administrator.php">';

}

}

else

if(empty($_POST['cuvantromana']) or empty($_POST['cuvantengleza']))

echo '<script> alert("Nu ati completat toate campurile ! ")</script>';

else

{

$cuvantroman=$_POST["cuvantromana"];

$cuvantenglez=$_POST["cuvantengleza"];

$x=("INSERT INTO `dictionar` (`roman`,`engleza`) VALUES ('$cuvantroman','$cuvantenglez')");

$y=mysql_query($x);

if($y)

echo "Cuvantul a fost adaugat cu succes !<br>";

else echo " Nu s-a adaugat niciun cuvant <br> ";

echo "<br>";

echo '<meta http-equiv="refresh" content="3; url=administrator.php">';

}

}

?>

<h3>Adauga articole </h3>

<table width="1158" border="0">

<tr>

<th width="457" scope="col"> <form action="administrator.php?tip=articol" method="post" enctype="multipart/form-data">

<table width="1020" border="0">

<tr>

<th width="61" scope="row"><div align="left">Titlu : </div></th>

<td width="675"><div align="left">

<input name="titlul" type="text" id="titlul" size="100" />

</div></td>

</tr>

<tr>

<th scope="row"><div align="left">Continut : </div></th>

<td><div align="left">

<textarea name="continut" cols="100" rows="35" id="continut"></textarea>

</div></td>

</tr>

<tr>

<th scope="row"><div align="left">Autor : </div></th>

<td><div align="left">

<input name="autor" type="text" id="email" size="100" />

</div></td>

</tr>

<tr>

<th scope="row"><div align="left">Upload poza profil: </div></th>

<td><div align="left">

<input name="userfile" type="file" id="file" size="50" />

</div></td>

</tr>

<tr>

<th colspan="2" scope="row"><div align="center">

<input type="submit" name="register" id="register" value="Adauga articol" />

</div></th>

</tr>

</table>

</form></th>

<form action="administrator.php?tip=dictionar" method="post">

<br />

</form>

</tr>

</table>

<hr />

<table width="697" border="0">

<tr>

<form action="administrator.php?tip=dictionar" method="post">

<th width="584" scope="col"> <table width="475" border="0">

<tr>

<th colspan="2" scope="col"><div align="left">Adauga cuvinte in dictionar </div></th>

</tr>

<tr>

<th width="276" scope="row"><div align="left">Introdu cuvantul in romana : </div></th>

<td width="183"><div align="left">

<input name="cuvantromana" type="text" id="cuvantromana" />

</div></td>

</tr>

<tr>

<th scope="row"><div align="left">Introdu cuvantul in engleza : </div></th>

<td><div align="left">

<input name="cuvantengleza" type="text" id="cuvantengleza" />

</div></td>

</tr>

<tr>

<th colspan="2" scope="row"><div align="center">

<input type="submit" name="Submit" value="Adauga cuvant" />

</div></th>

</tr>

</table></th>

<br />

</form>

</tr>

</table>

Codul paginii administrator.php

Anexa 13

Tabela “blog” din baza de date

Campurile din tabela blog

Tabela comentarii

Campurile cu informatiile introduse din tabela comentarii

Informatiile introduse din tabela blog

Tabela dictionar

Informatiile introduse in tabela dictionar

Similar Posts