Gestionarea Activitatilor Sportive

Universitatea din Pitesti

Facultatea de Matematică Infotmatică

Domeniul de licență Informatică

Lucrare de licență

Gestionarea activităților sportive

Coordonator științific: Absolventa

Lector univ.dr. Țurcanu Adrian Neculae Eliza

Cuprins

Intoducere……………………………………..

Capitolul 1

Notiuni Teoretice din domeniul aplicațiilor web

1.1 World Wide Web reprezinta sistemul de distribuție locala sau globală a informațiilor hypermedia . Web-ul nu trebuie confundat cu internetul, el reprezintă cea mai spectaculoasă component software a internetului. WWW a fost dezvoltat de a lungul timpului, în present lista actuala a rapoartelor tehnice poate fi vizualizată pe www.w3.org.

WWW a fost publicat pentru prima data în anul 1990, tot atunci a aparut si prima aplicație wev- un server Web care rula pe calculatoare NeXT, în același an Nicola Pellow începe să dezvolte un navigator text. După anul 1995 a evoluat foarte mult.

Berners-Lee și echipa sa au realizat primele versiuni pentru patru componente cheie necesare serviciului web, și anume:

protocolul de intercomunicație HTTP;

limbajul de descriere a hipertextului HTML, pentru a putea fi afișat de browser;

serverul de web;

browserul.

Clienții si serverele Web.

Pentru a putea acesa www, trebuie să folosim un program client( browser) și să cunoastem adresele pare dorim să le vizităm. Exista o multitudine de navigatoare, cele mai cunoascute fiind: Mozilla Firefox, Google Chrome, Opera Safari, Internet Explorer. WWW ne ofera suportul pentru limbajele pecifice de programare folosite la realizarea aplicatiilor web, aici avem in vedere atat documentele dinamice –Java, javaScript, cât și foile de stiluri .-CSS si cele de stocare a datelor –HTML, XHTML.

WWW se bazeaza pe modulpe modul de programare client /server. Aplicația este imparțită în două mari categorii:

Client- care solicită informații de la componenta server

Server- care răspunde la cererile clienților- Apache, Microsoft Internet Information Server, Netscape .

Principalele caracteristici ale navigatorului www sunt:

Posibilitatea de a folosii mai multe ferestre de navigare grupate sub

forma de tag-uri

Suporul pentru frame-uri

Asigurarea suportului pentru diferite limbaje de programare folosite la realizarea

documentelor Web

Integrarea aplicațiilor care ușureaza accesul la alte servicii de internet

La baza aplicațiilor web stau anumite standarde. Principalele standare sunt:

(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;

Cascading Style Sheets (CSS)

JavaScript

1.2 Hyper-Text Transport Protocol reprezintă un protocol bazat pe stivă de protocoale (TCP/IP). HTTP a fost folosit în anul 1990 si a fost dezvoltat împreuna cu Web. Prima versiune HTTP 0.9, a reprezentat in simplu protocol de transfer da date prin Internet. În versiunea 1.1 au fost implementate mai multe funcționalitați , precum mecanismele de căutare , actualizare, având suport pentru URI ( Uniform Resource Indentifier), specificand adresele de locatie (URL) . Deasemenea oferea suport pentru FTP (File Transport Protocol) HTTP este un protocol de tip cerere/ răspuns .

HTTP cea mai utilizată metodă de accesare a informațiilor DIN Internet,aceste informații sunt păstrate pe servere.Este protocolul implicit al WWW. Adică, dacă un URL nu conține partea de protocol, aceasta se consideră ca fiind http. HTTP presupune că pe calculatorul destinație rulează un program care înțelege protocolul. Fișierul trimis la destinație poate fi un document HTML (abreviație de la HyperText Markup Language), un fișier grafic, de sunet, animație sau video, de asemenea un program executabil pe server-ul respectiv sau și un editor de text. După clasificarea după modelul de referință OSI, protocolul HTTP este un protocol de nivel aplicație. Realizarea și evoluția sa este coordonată de către World Wide Web Consortium (W3C).

HTTP este un protocol nesigur , informațiile sunt transmise direct între server si client, pentru a nu satisfice cerințtele unei conexiuni sigure există alternative precum Secure HTTP. Functionalitatea este destul de simpla , odata ce a primit informațiile de la pagina HTML , conexiunea numai este activă, ea se activează în momentul în care executam click.

Protocolul generează și erori, cele mai întalnite eroari sunt:

404, este afișată în momentul în care serverul nu a găsit nimic care să

corespundp cererii URL. Nu se dau indicații desspre condiția remporară sau permanentă.

505-serverul nu suportă sau refuze să suporte versiunea de protocol a HTTP

care a fost folosită în dormularea cererii.

EXEMPLU DE HTTP

Cererea clientului:

GET / HTTP/1.1

Host: www.example.com

Răspunsul serverului:

HTTP/1.1 200 OK

Date: Sun, 23 June 2016 22:38:34

Server: Apache/1.3.27 (Unix) (Red-Hat/Linux)

Last-Modified: Wed, 08 May 2015 23:11:55 GMT

Etag: "3f80f-1b6-3e1cb03b"

Accept-Ranges: bytes

Content-Length: 438

Connection: close

Content-Type: text/html

In urmatorul capirol o sa prezint formarea documenteleor web care are la bază liombajul specific denimit HTML

1.1 Hyper Text Markup Language HTML este unul din elementele fundamentale ale WORLD WIDE WEB. HTML este un limbaj de tip markup, utilizat pentru crearea paginilor web. Pentru scrierea lui se poate ulitiza orice editor de text simplu. Pentru a usura munca celor ce scriu cod Html au aparut editoare de text care ușureaza munca, generând o parte din codul de baza.Insa pentru a putea folosii aceste editoare avem nevoie de cunoștiinte solide in cea ce priveste limbajul HTML.

Limbajul Html a fost dezvoltat si imbunatațit de-a lungul anilor:

HTML 1.0 SI HTML+ au ap[rut in 199 respectiv 1993

HTML 2.0 a aparut in 1994 si con’inea 49 de taguri

HTML 3.0 a aparut in 1995 si contnea marcaje petru notiuni matematice.

HTML 3.2 a aparut in 1996

HTML 4.01 a apărut în 1999 ofera cele trei variante: Strict, Transitional si Frameset

HTML 5 a apărut în 2012

Cu fiecare versiune apărută lucrurile s-au îmbunatațit vizibil. Atât pentru utilizatori cât și pentru clienți.

Orice document Html incepe cu eticheta <HTML> si se incheie cu </HTML> si este format din doua componente principale:

Versiunea Html a documentului

Antent(head)- incepe cu eticheta <HEAD> si se incheie cu </HEAD>, in

interiorul acestei etichete gasim titlul documentului <TITLE></TITLE> precum si anumte scripturi pentru a crea legaturi intre html si foaia de stil ,inserarea anumitor fonduri sau conexiunea cu anumite coduri dinamice .Aceste scripturi sunt executate la incarcarea documentului in browser

Corp(body)- incepe cu eticheta <BODY> si se incheie cu </BODY>,in

interiorul etichetelor gasim codul propriu zis.

O eticheta poate fi scrisa atat cu litere mari, cat si cu litere mici.

Html a usutat munca multor oameni de-a lungul timpului, el era folosit pentru scrierea tabelelor, ca si suport lingvistic, pentru tratarea eventimentelor.

Cele mai utilizate elemente ale unui cod HTML sunt:

<h1>…<h6> șase nivele

<div> diviziune

<p> paragraf

<ul> liosta neordonata

<ol> lista ordonata

<img> continut grafic

<table> tabel

Cel mai comun mod de a stiliza codul HTML îl ofera Css însa avem posibilitatea de a stiliza codul fără a fi nevoie sa folosim o legătura externa .css, tot ce trebuie să facem este să adaugam stilurile dorite în interiorul etichetei folosind atributul “style”.

In randurile ce urmeaza o sa urmarim un exemplu de cod html in care am creat un model de turneu .

Exemplu :

<html>

<head>

<title>Turneu</title>

</head>

<body>

<div style="text-align: center; float: left; width:450px;">

<div style="float: right; width: 100px; height: 8em; font-weight: bold;line-height: 8em;">Stefan</div>

<div style="float: left; width: 300px; height: 4em;">

<div style="line-height: 6.5em; float: right; width: 150px; height: 4em; border-bottom: 1px solid #000;">Matei</div>

<div style="float: left; width: 150px; height: 2em; line-height: 2.5em;"><a href="">Andrei</a></div>

<div style="float: left; height: 2em; width: 149px; border-top: 1px solid #000; border-right: 1px solid #000;">Matei</div>

</div>

<div style="float: left; width: 300px; height: 4em;">

<div style="float: right; height: 4em; width: 149px; border-top: 1px solid #000;">Stefan</div>

<div style="width: 149px; border-bottom: 1px solid #000; border-right: 1px solid #000;">Ionut</div>

<div class="float: left; width: 150px; height: 2em;">Stefan</div>

</div>

</div>

</body>

</html>

Putem sa creem un bracket cu o complexitate redusa, medie, sau avansata, totul depinde de ce avem nevoie, dupa cum putem observa, putem sa modificam codul cum dorim,

In urmatoarele subcapitole o sa introduc alte limbaje de programare web care ne usureaza munca cum ar fi CSS si Javascript SI PHP și ne oferă posibiltatea sa personalizăm și sa modernizăm codul Html. Aceste limbaje reduc consierabil timpul de lucru si ne ajuta sa relizam o aplicatie web exact cum ne dorim , fara nici macar o restrictie. Pare aproape imposbil , dar avem nevoie doar de imaginatie si de putin timp pentru a aprofunda arta aplicatiilor web.

1.2 Cascading Style Sheets (CSS) ofera posibilitatea de a structura un fisier Html. S-a dovedit de-a lungul timpului că fisierul intern .css ofera posibilitatea de a personaliza un documnet html dupa bunul plac, avem nevoie doar de imaginatie si de cunoștinte.

CSS a fost propus prima data in anul 1994 , deoarece limbajul HTML a evoluat foarte mult avea nevoie de o foaie de stil separata care sa-i oefere codului o fizibilitate mult mai buna. In anul 1996 CSS a fost gata sa devina oficial asa ca a aparut CSS1.

Grupul de lucru CSS a inceput sa imbunatateasca CSS1, asa ca in anul 1998 a aparut CSS2, In anul 2014 a fost publicat CSS3 care ne ofera multe avantaje.

Voi prezenta proprietatile pe care este capabil sa le faca CSS3

Border-radius: ii ofera unui elemente” colturi rotunde”. Putem folosii aceasta

proprietate pentru toate 4 coturi odata : border-radius 5px 5px 10px 15px, sau separat daca dorim, dar exista 4 reguli: folosint 4, 3,2 sau 1 valoare

Exemplu pentru 2 valoari: prima valoare se aplică colțul din stânga sus și de jos-dreapta, iar a doua valoare este valabilă pentru partea de sus-dreapta și colțul de jos-stânga

#val1 {

border-radius: 15px 50px;

background: #000;

padding: 20px;

width: 200px;

height: 150px;

}

<p>border-radius: 15px 50px:</p>

<p id="val1"></p>

Background- css3 contine cateva noi proprietati de font care permit un control mai mare

background-size ne permite sa specificam dimensiunea imaginilor din fundal,

orice dimeniune poate fi exprimanta in:

– pixeli: redimensioneaza lungimea si latimea

– procente: redimensiuneaza imaginea in procente la elementul parinte, nu la imaginea

– contain: poza este marita sau micsoarata astfel incat sa acopere toata suprafata fundalului

– contain: poza este marita sau micsorata ca sa intre in zona de continut

background-origin: specifica zona de pozitionare, are trei valori:

– padding-box: pozitie relativa in stanga sus de unde incepe paddingul

– border-box: pozitia e relativa in stanga sus a bordurii

-content-bix- imaginea pentru backgrpund este pozitionata de la stanga sus de unde incepe continutul

background-clip: specifia zona de colorare e fundalului, putem sa o folosim

atunci cand dorim sa stim daca backgrpund-ul se extinde pana la imagini, are aceeleasi proprieteati ca si background origini.

Shadow efect- ne ofera posibilitatea de a adauga un efect de umbre. Este alcatuit din doua proprietati:

1 text-shadow- ne ofera posibilitatea de a adauga umbre textului .

Exemplu:

text-shadow: 2px 3px 3px #a0a1fe;

2, box-shadow- ne poermite sa adaugam efectul de umbra boxurilor.

Exeplu:

box-shadow: 10px 10px grey;

3d Transforms: Versiunea CSS2 ne oferea posibilitatea de a realiza o traansformare 2d

insa noua proprietate a css3 ne ofera posibilitatea de a transforma 3d. Avem 3 metode de transformare:

-rotateX()- transform:rotateY(130deg);

-rotateY()- transform:rotateZ(90deg);

-rotateZ()-transform:rotateX(150deg);

CSS3 transitons ne permite sa schimbam valorile proprietatilor de la una la alta pe o

anumita durata de timp. Pentru a crea o asemenea tranzitie avem nevoie de locul unde dorim sa adaugam efectul si durata acestuia, daca nu adaugam durata nu o sa avem parte de niciun efect.

Exemplu:

div{
width:100px;
height:100px;
background:red;

div:hover{
width:300px;

transition:width 2s;

transiton: height:5s;
}

In acest exeplu in momentul cand se afiseaza avem un patrat cu o lungime si latime de 100 de pixeli in momentul in care punem mouse ul peste patrat drespectiv o sa observam cum patratul nostru se transforma intr-un dreptunghi si atinge o lungime de 300de pixeli in 2 secunde

CSS3 Animations acum putem adauga animatii intr-un fisier HTML fara sa folism

limbajul Javascript. Aceasta animatie ne permite sa scimba treptat stilurile , ne ofera sa modificam stilurile de cate ori dorim.Pentru a utiliza animatiile avem nevoie de keyframes.

Aceasta proprietate ofera foarte multe avantajem sa coloram un patrat de 5 ori in 5 secunde si in acelasi timp sa se si deplaseze. Punem sa setam sa faca acest lucru la infinit, sau invers.

width:100px;
height:100px;
    position: relative;
    background-color: red;
    animation-name: example;
    animation-duration: 4s;
    animation-iteration-count: infinite;

CSS3 COLOR: ne ofera posibilitatea de a folosii :

Valori rgba: este o extensie a RGB numai ca aici este specificata si opacitatea

culorii. Exemplu:rgba(255, 0, 0, 0.6); avem specificate culorile rosu verde albastru si alfa . Acest exeplu va afisa o culoare rosu cu o opacitate de 0,6, opacitatea poate fi cuprinsa intre 0,1 si 1,0.

Mai degrabă o valoare decât o proprietate, declarația de culoare în CSS3 este poate cel mai bun lucru care i s-a întâmplat internetului de la ancoră încoace. Acum putem defini culori folosind Hue, Saturation și Lightness, adică hsl(0, 0%, 0%) și, mai important, le putem oferi un factor de opacitate. Asta înseamnă atât hsla(0, 0%, 0%, .3) cât și rgba(0, 0, 0, .5) (unde .3 și .5 reprezintă opacitatea culorii și pot lua valori între 0 și 1).

CSS3 Gadient ne ofera posibilitatea sa realizam o tranzatie lina intre doua culori sau

mai multe . In css2 pentru a adauga acest efect avea nevoie de imagini, acum insa este mult mai usor putem sa realiza aceasta tranzitie cu cate culori dorim si la ce dimeniune dorim fara a insera nimi in pagina.

CSS3 defineste doua tipuri de gradienti:

Gradient liniar parcurs: sus, jos, stanga, dreapta/ diagonala

Gradient radical : pleaca din centrul lor

Aceasta proprietate ne ofera urmatoarele avantaje:

Lund exemplu doua culori: rosu si verde, putem folosi gradientul fie de la stnag, fie de la dreapra respectiv sus si jos.

Exemplu:  background: -webkit-linear-gradient(left top, red, yellow) .

Putem sa folosim si transparenta care ne ajuta sa obtinem un efect pierdut, pentru a adauga aceasta transparenta avem nevoie de functia rgba .

Exemplu background: linear-gradient(to right, rgba(255,0,0,0), rgba(255,0,0,1))

Cu ajutorul gradientului radial putem oferi un efect de culoare din mijloc si putem sa alegem cat la suta ne dorim din fiecare culoare . Exemplu background: radial-gradient(red 5%, yellow 15%, green 60%)

Media Queries: aceasta proprietate ne ofera posibilitatea de a realiza un site

responsive, aplicatiile responsive nu sunt o noutate, Beneficiile sunt enorme de la anumite dimensiuni putem practica sa rearanjam intregul continut al paginii. Au fost create pentru a usura navigatia pe mobile si tableta, .

Pentru a aranja un anumit site avem in vedere urmatoarele queriuriȘ

/* Smartphones (portrait and landscape) –––– */

@media only screen

and (min-device-width : 320px)

and (max-device-width : 480px) {

/* Styles */

}

/* Smartphones (landscape) –––– */

@media only screen

and (min-width : 321px) {

/* Styles */

}

/* Smartphones (portrait) –––– */

@media only screen

and (max-width : 320px) {

/* Styles */

}

/* iPads (portrait and landscape) –––– */

@media only screen

and (min-device-width : 768px)

and (max-device-width : 1024px) {

/* Styles */

}

/* iPads (landscape) –––– */

@media only screen

and (min-device-width : 768px)

and (max-device-width : 1024px)

and (orientation : landscape) {

/* Styles */

}

/* iPads (portrait) –––– */

@media only screen

and (min-device-width : 768px)

and (max-device-width : 1024px)

and (orientation : portrait) {

/* Styles */

}

/* Desktops and laptops –––– */

@media only screen

and (min-width : 1224px) {

/* Styles */

}

/* Large screens –––– */

@media only screen

and (min-width : 1824px) {

/* Styles */

}

/* iPhone 4 –––– */

@media

only screen and (-webkit-min-device-pixel-ratio : 1.5),

only screen and (min-device-pixel-ratio : 1.5) {

/* Styles */

}

Alegem minimul si maximul intre care dorim sa rearanjam continutul paginii.

Hypertext Procesor(PHP) – este un limbaj de tip script pentru Web care ruleaza pe server. Codul PHP se insereaza in pagina Web si este citit defiecare data cand accesam pagina.

Limbajul PHP a fost conceput în anul 1994. El a trecut prin 3 etape , pana ajuns modelul pe care îl folosim acum.PHP este cel mai cunoscut limbaj de scripting folositv pentr crearea siteuri-lor Web interactive.

PHP permite folosirea unor elemente specifice limbajelor de programare. Iesirea standard a script-ului PHP devine intrarea standard pentru programul de navigare care vizualizeaza pagina. Asadar, la iesirea standard poate fi scris (de exemplu, prin intermediul comenzii echo) orice tip de cod HTML, acesta fiind interpretat de catre borwser.
Pe langa manipularea continutului paginilor de web, PHP poate trimite headere HTTP pentru autentificare, seta cookie-uri sau redirectiona utilizatorii. Php parcurge documentul până când întalnește un marcaj, care îi specifică faptul ca acel cod este PHP și trebuie interpretat, codul este citit până în momentul când se întalnește marcajul de inchidere.Exista mai multe marcaje care idica secventa uui cod PHP, dar noi folosim doar 2Ș

?php
     //cod PHP
?>

Cea de-a doua posibilitate este utilizarea marcajului <SCRIPT> intr-o maniera asemanatoare celei folosite pentru includerea de script-uri JavaScript. Sintaxa este urmatoarea:

<SCRIPT language = "php">
    //cod PHP
</SCRIPT>

Orice secvențp de PHP începe cu ; php și se termina cu ?:.Tot codul este cuprins între acesti delimitatori .

Cu ajutorul PHP putem crea meniuri pentru a importa categoriile si subcategoriile meniurilor trebuie sa ne conecta la baza de date si avem nevoie de urmaroarea secventa de cod

<?php

// conectare la server

$conn = new mysqli('localhost', 'root', 'pass', 'dbname');

// verifica conexiunea

if (mysqli_connect_errno()) {

exit('Connect failed: '. mysqli_connect_error());

}

?>

Codul PHP este alcatuit dinȘ

Variabile- elemente care au o anumita valoare. Etapele pe care le pargurg variabilele sunt :

Declararea variabilelor Ș<nume variabila> = <valoare>;

Atribuirea de valori

Ștergerea variabilelor: unset( $variabila );$variabila = null;

Afisarea variabilelor

$variabila = "Text";

$randNou = "<br>";

print $variabila;

print $randNou;

// echivalent cu cele doua instructiuni print

echo $variabila, $randNou;

Expresii și operatori.

O expresie poate fi un numar,o variabila sau un sir de caractere.Limbajul PHP este construit în jurul expresiilor.Operatori in Php sunt elemnte de limbaj aplicate extensiilor dând naștere unor noi expresii.

Operatori disponibili

Operatori de comparare

Operatorii de comparare sunt folositi de cele mai multe ori in cadrul

instructiunii if pentru a exprima conditia ce trebuie verificata.

$a == $b // egal

$a === $b // identic (aceeasi valoare si acelasi tip)

$a != $b // diferit

$a <> $b // diferit

$a !== $b // ne-identic

$a < $b // strict mai mic

$a <= $b // mai mic sau egal

$a > $b // strict mai mare

$a >= $b // mai mare sau egal

Operatorul ternar

PHP ofera un operator care are 3 termeni si a carui evaluare returneaza o valoare. Sintaxa lui este urmatoarea:

(conditie ? adevarat : fals )

Operatori de incrementare/decrementare

Incrementar sau cresterea valorii, de obicei cu o unitate, iar decrementarea operatia inversa. PHP ofera posibilitatea ca incrementarea/decrementarea sa se faca printr-un operator, fara sa fie nevoie de o instructiune separata.

Spre exemplu:

$a = 1; // initializare

// pentru a-l creste pe $a cu o unitate, normal am scrie:

$a = $a + 1;

// folosind operatorul de incrementare scriem:

$a++;

// sau

++$a;

// pentru a afisa noua valoare, putem aplica operatorul direct din instructiunea print:

print ++$a;

Operatori pentru siruri de caractere

In aceasta categorie sunt inclusi 2 operatori ".=" (operator de atribuire prin concatenare – vezi mai sus) si "."

Punctul (.) este operatorul de concatenare (legare) stringuri.

print "test" . " legat de " . "Test2"; // afiseaza Test legat de Test2

$a = "Eu realizez";

print $a . " Licemta"; // afiseaza Eu realizez Licenta;

Functii :

Functia mail()- aceasta functie poate face ca PHp să trimita mailuri daca este

instalat un server de email. Cel mai des este întalnit pe serverele ce ofera gazduire site-urilor

<?php

// trimitere mesaj simplu

mail('[anonimizat]', 'Subiect mesaj', 'Mesaj simplu');

// trimiterea unui mesaj in care se specifica date aditionale

$to = '[anonimizat]';

$subject = 'Subiect mesaj';

$message = 'Mesaj simplu cu date aditionale';

$headers = 'From: [anonimizat]' . "\r\n" .

'Reply-To: [anonimizat]' . "\r\n" .

'X-Mailer: PHP/' . phpversion();

mail($to, $subject, $message, $headers);

?>

Functii matrematice- Php are la ispozitie majoritatea funcțiilor matematice.

Abs-Valoare absoluta

Sin-Functia sinus

Base_convert-Conversia intr-o baza

Round-Rotunjirea

Rand(10,20)-Afisarea unui număr aleator dintr-un interval specificat

Terminarea execuției in unele cazuri dorim oprirea execuției unui script PHP . Acest

lucru este posibil utilizat funcțiile

<?php

exit( "Script terminat" );

die( "Script terminat" );

print "Acesta linie nu se afiseaza niciodata";

?>

Limbajul MYSQL- este o arhivă de date ele sunt utilizate pentru a stoca date in vedrea accesării acestora.

Bazele de date sunt manipulate cu ajutorul unor sisteme software de gestiune a bazelor de date

PhpMyAdmin este o aplicatie de scris in php care permite gestionarea bazei de date prin intermediul unui browser web. Utilizarea acestei aplicatii a inceput sa ia amploare deoarece ne ofera posibilitatea de a crea baza de date și tabelele cu ușurință, usurează munca și ofera flexibilitate si mai ales siguranta. PhpMyAdmin ne oferă posibilitatea de a face backup oricând dorim.

Crearea bazei de date este simpla tot ce avem de facut este sa intram in administrarea site-ului(cpanel) si in seciunea MySQL® Database Wizard

Sa alegem numele bazei de date

Generam parola sau adaugam ce parola dorm noi

Selectam privilegiile dorite

Gestionarea bazei de date este simplista, panoul de comanda ne ofera posibilitati extraordinare : putem crea tabele, impora sau exporta baza de date.

Javascript este folosit în special pentru crearea de pagini web dinamice.

JavaScript oferă proiectanților HTML un instrument de programare JavaScript este un limbaj cu o sintaxă foarte simplă și aproape oricine poate insera mici secvențe de cod în paginile JavaScript poate citi și scrie elementele HTML – Un cod JavaScript poate citi și modifica conținutul unui element HTML JavaScript poate fi folosit pentru a valida datele – Un cod JavaScript poate fi folosit pentru a valida datele înainte de a fi trimise către server. În acest fel serverul nu mai face procesări suplimentare. JavaScript poate fi folosit pentru a detecta browserul utilizatorului – Un cod JavaScript poate detecta tipul browserului și poate încărca o pagină proiectată special pentru tipul respectiv de browser 15 JavaScript poate fi folosit pentru a crea cookies – Un cod JavaScript poate fi utilizat pentru a stoca și extrage informații pe calculatorul vizitatorului paginii HTML

Pentru a insera Javascript intr-o pagina HTML folosim tagul ; script:

Exista doua moetode de inserare a scripturilorȘ

In ; head: si este executat numai cand este apelat, asa avem siguranta ca scrptul a fost citi inainte de a fi executat. Exemplu: <script type=”text/javascript”>

In <body> scriturile sunt executate pe parcurs ce pagina se incarca, ele vor genera continutul paginii.

Deasemenea putem folosii si scripturi externe, fara a scrie codul in interoriul codului HTML, aceasta practica este cea mai folosita deoarece nu incarca codul HTML si ne ofera o vizibilitate mai buna si o editare mai usora. Tot ce trebuie sa facem este sa inseram tagul:< script type=”text/javascript” src=”javascript/.js”></scroipt>

Stuctura limajului Javascrpt este foare asemanatoare ca cea a limbajului Php, contine operatori, variabile, instructiuni conditionale.

Unul din avantajele codului Java script este Caseta de popup, care usureaza munca programatorilor web

Caseta Alert este mult mai usor sa gasim erorile in momentul in care aflam exact pana unde se pargurge codul. Exista momente in care nu ne dam seama exact pana unde a fost parcursa secventa . Cand caseta este afisata actionam butonul”OK” pentru a putea continua, asa ne dam seama ca pargurgerea a ajung pana la caseta de alerta.

Exemplu: <html>

<head>

<script type="text/javascript">

function afiseaza_alert()

{

alert("Caseta de alertare!");

}

</script>

</head>

<body>

<h3>Apasa butonul</h3> <hr/>

<input type="button" onclick="afiseaza_alert()"

value="Apasa" />

</body>

</html>

Functiile in Jvascript- ajuta la diviziunea mai mult sarcini pe care trebuie sa le execute un program. Functiile pot contine mai multe comenzi si mai multe instructiuni.functiile ne ajuta sa impartim liniile de cod petru a le utiliza separate acolo unde este nevoie, deobicei cand codul este complex.

Functiile sunt de doua feluri:

Create de programator care retrneaza sau nu returneaza o valoare

– functii predefinite.

In tagul head definim functia si o fiolosim in cadrul paginii prin apelarea ei. Sintaxa este usoara folosim expresia function urmata de numele pe care dorim sa-l atribuim functiei, dupa care adaugam argumentele separate prin virgule daca sunt mai multe.

Forma generala a unei functii este urmatoarea:

function nume_functie(argument1, argument, …) { 
    codul care va fi executat 
}

Argumentele sunt variabile folosite de functie si a caror valoare este preluata la apelarea functiei. 

 Apelarea functiilor

Dupa ce am creat o functie, pentru a fi folosita, fuctia trebuie apelata. 
– O functie care contine argumente se apeleaza in felul urmator:

nume_functie(argument1, argument, …)

– O functie fara argumente se apeleaza in felul urmator:

nume_functie()

Utilizând JavaScript, putem crea pagini web dinamice. Evenimentele sunt acțiuni ce pot fi detectate de JavaScript. Fiecare element dintr-o pagină web are un anumit număr de evenimente care pot declanșa un script. Spre exemplu, putem utiliza evenimentul onClick al unui buton pentru a indica ce funcție va fi executată dacă utilizatorul acționează butonul respectiv. Evenimentele sunt definite în tagurile HTML. Exemple de evenimente Un click de mouse Încărcarea unei pagini web sau a unei imagini Mișcarea mouse-ului peste o anumită zonă din pagina web Selectarea unui câmp de intrare dintr-un formular HTML Submiterea unui formular HTML Apăsarea unei taste

Validarea formularelor

Javascript este utilizat pesntru a verifica validarea formularelor, când terminam de codat un formular primele lucrui care trebuie sa le avem în vedere sunt:

– validitatea adresei de email- este ușor sa aflam valididateta adresei de emial, verificam dacă avem aront și punct,

– intorducerea de text într-un câmp pentru cod numeric

– campuri ogligatorii ramase necompletate- pentru a verifica dacă au rămas campuri obligatori intorducem un script care ne va alerta și va returna false

Animatiile.

Scriptul este cel care acorda imaginilor și butoanelor animație, exista o multitudine de animati, însă cele mai folosite sunt cele care implica onmouseover și onmouseout.

Onmouseover-este evenimentul care ii spune browserului ca în momentul în care trece mouseul peste imagine trebuie sa apeleze scriptul.

Onmouseout–este evenimentul care ii spune browserului ca în momentul în care tde îndepărtează de imagine trebuie sa apeleze scriptul.

MouseOver și mouseOut() sunt folosite pentru a realiya animații în stil .gif

De luat din carte

O imagine mapată (image-map) este o imagine care are zone ce pot fi acționate cu mouse-ul. În mod normal, fiecare zonă are un hiperlink asociat. În tagurile din imaginea mapată pot fi adăugate evenimente care apelează funcții JavaScript. Tagul suportă evenimentele onClick, onDblClick, onMouseDown, onMouseUp, onMouseOver, 100 onMouseMove, onMouseOut, onKeyPress, onKeyDown, onKeyUp, onFocus și onBlur

WordPress este o platforma de blogging cu sursa deschisă . Se bazeaya în mare pare pe PHP și folosește sistemul MVSQL pentru gestionarea bazelor de date . Poate fi instalat atât pe un site care are gazduire când și pe un calculator care functioneaya cu un server local, avem nevoie doar de arhiva wordpress.zip.Acesta a fost lansat în anul 2003 și avea câteva mii se site-uri. Acum în 2016, are de o rata de 26,4% din 10 milioane de site-uri.

Este atât de popular datorită avantajelor enorme pe care le ofera. Fiind bayat în pare parte pe PHP ,HTML și CSS, având un sistem de gestionare a bayelor de date , WordPress este asul din mâneca a mult programatori web .

Deși pare simplu să ne creem propriu site personalizat avem nevoie de cunostiinte solide de limbaje specifice pentru a putea mofidica structura unui site .

Odata urcat in gazduirea site ului tot ce trebuie sa facem este sa dezarhivam si sa accesa www.exemplu.ro/wp-admin si vom fi transfertati catre interfata de instalarea, tot ce trebuie sa facem este sa selectam limba si sa trecem la poasul urmtor, adica conexiunea cu baza de date.

Scriem numele bazei de date, usernameul si parola. Datahostul ramane nemodificat doar daca instalam wordpresul pe domniu, daca instalam pe un subdomeniu va trebui sa inseram calea.

Ce face daca totusi am vrea sa adaugam o conexiune cu o alta baza de date dupa ce am instalat wordpresul? Tot ce trebuie sa facem este sa mergem in fisierul wp-config.php si sa modificam cu datele de conectare de la noua baza de date.

In interfata grafica in momentul cand accesam/wp-admin

Pnetru a începe realizarea unui site pe platforma wordpres, trebuie să ne familiarizam prima data cu platforma.Pentru a înțelege mai bine cum se uitilizeaza platforma , o să fac o mica preyentare a panoului de control și o să încerc sa explic functionalitatea fiecarei componente.

Aricole-pentru a fost creat pentru bloging prima componenta este cea a articoleler+ în aceasta componenta putem crea și gestiona articolele.

-Media- wordpress ne ofera posibilitatea de a insera imagini și video. Putem deasemenea sa formama și galerii. Media este un plus , usureaza munca, putem insera acolo imagini și putem copia linkul pentru al insera în site.

-Pagini principala și cea mai folositoare componenta a platofrmei, ne ofera posibilitatea de a crea și edita paginile cu ușurința. O pagina ne ofera posiilitatea de a adauga text în mod vizual și în mod text- ca și cod HTML., deasemnea avem și tools urti care ne permit sa editam textul rapid:-blond, italic, b-quote, del, ul, ol.

-Aspect-aceasta componenta ne ofera cea mai mare varietate de tools uri:

-Teme: Ficare tema din wordpress se regaseste in folder themes al instalarii , tema este alcatuita in mare parte dintr-un fiser style.css care ne ofera posibilitatea de a personaliza interfa site-ului, , tema suporta cea mai noua tehnologie a CSS3, deși vine predefinita, noi puteam adauga și sterge linii de cod pentru a o adapta cerintelor noastră.Fisierul functions.php conține orice logica aditionala de cxare are nevoie tema. Aici includem functionalitati de tip plugin, dar putem sa adaugam și propriile noastră functionalitati.

Personalizare+ ne usureaya munca, putem sa personaliyam tema în timp real.

Piese+ ne permite sa adaugam și sa aranjam cu ușurința aproape tot continutul site+ului nostru- WordPressul vine în general cu piese standar ca „bara laterala”, „Header Area”,”Main Area”, însă dacă deținem cunostiintele necesare putem sa adaugam câte piese dorim noi, tot ce trebuie să facem este sa intoducem codul în fișierul function.php.Datorita interfetwei drag&drop,putem sa modificam și sa structuram foarte bine. În iinteriorul subcategoriei numita și piese disponibile gasimt toate pisele pe care le+am instalat și piesele care au fost instalate odată cu instalarea wordpresului.

4, Meniurile fac ca wordpresuul să fie foarte puternic ca sistem de gestionare a continutului. Putem crea propriile meniuri, alcătuite din pafini, cateori sau linkuri. Deasemenea datorită interfetei drag&drop putem sa ordibnam elementele cum dorim , chiar sa adaugam și părinți. Putem deasemenea sa creem meniuri diferite pentru locuri diferite. Putem crea un meniu pentru header, unul pentru sidebar și unul pentru footer.. Setarile meniurilor- adaugarea automata-paginile sunt adaugat în momentul creari acestora. -Locatiile temei putem selecta ca și meniu principal.

Edittor teme+ ne este oferit accesul la codul sursa, dacă nu benefieciem de o conectare ftp sau de un firebug instalat în browser, putem modifica astepectele temei din aceasta categorie.Tot ce trebuie să facem este sa selectam tema și fișierul pe care dorim sa+l modificam, însă trebuie sa fim foarte atenți și sa deținem cunoștințe avansate atât de wordpress cât și de limbaje de programare. Orice modificare care nu este corespunzatoare și nu indeplineste standardele , poate face ca aplicația sa întoarcă către noi o eroare.

Module sunt compuse din scripturi php cre extind functionalitatea WordPress . Modulele sunt obstionale în functe de necesitatea utiliyatorului de acea nu sunt incorporater în wordpress de baza. Ele sunt concepute de către contribuabili voluntari .Exista mii de module care au functionalitati inimaginabile. De la securitate pana la progroza meteo. Componenta module are 3 subcomponente:

Lista modulele în care ne sunt prezentate toate modulele pe care le-am instal, dacă găsim modulele aici asta nu înseamnă ca sunt preyente și în aplicație, avem posibilitatea de a activa sau deyactiva modulele.

Adaugarea modulelor. Exsita doua moduriprin care putem adauga)instala? Un modul, fie căutam modulul de care avem nevoie în bara de search, fie instalam propriul modul, sua un modul pe care l+am găsit pe internet și nu este găsit în lista de module wordpress , folosind butonul „Incarcare module” și incarcam modulul din propriul calculator. In momentul în care iunseram un modul din calculator trebuie sa avem în vedere faptuil ca modului se afla intr+o arhiva de tip .zip.

Editor de module, cum editam temele așa putem edita și modulele, funcționează pe același principu, aceasta subcategorie este folosită în momentul incare dorim sa schim,bam anumite date din module sau anumite functionalitati, însă avem nevoie de cunoștințe solide pentru a modifica un modul.

Utilizatori :WordPress oferă șase tipuri de utilizatori:

Super Admin – este un administrator cu drepturi de administrare pe întreaga rețea, se folosește la rețelele de bloguri (fostul WordPress MU)

Administrator – utilizator cu drepturi depline de administrare a site-ului

Editor – utilizator ce poate gestiona paginile, posturi, comentarii, linkuri fără pluginuri și setări de site

Author – utilizator ce poate gestiona strict articolele proprii, nu are acces de administrare asupra articolelor scrie de alți autori, poate doar vizualiza celelalte postări

Contributor – utilizator ce poate adăuga postări, edita și șterge doar postările proprii fără a putea uploada fișiere și fără a putea publica

Subscriber – utilizator abonat, poate comenta și vizualiza articole și pagini private

Uneltele Orice marketer știe că de multe ori uneltele sunt cele care fac diferența atunci când vorbim despre performanță în afiliere, de aceea este important să folosim unelte care ne ușurează munca și ne permit să ne concentrăm pe sporirea ratei de conversie, în loc să pierdem timp prețios. locul unde ga convertind.linkurile magazinelor în linkuri de afiliat sau schimbând manual banere pe propriul site. Aici este locul unde se afiseaza modulele instalate, si functionalitatile lor, este ca un panou de control care ne ajuta sa gestionam toate modulele mult mai usor.

Setari: Campul de setari ne ofera posibilitatea de a modifica din adminsitrare . Aceasta categorie are 6 subcategorii:

Setarile generale , in ineriorul caroa putem sa definim titlul si sloganul site-ului, adresa instalari si adresele principale, adresa de email- adresa e email inserata ina cest camp va fi adresa de email catre care vor fi directionate toate emailurile, atat cele trimise de wordpress cat si cele din formularele de contact.

Setari de scriere- folosite mai mult pentru bloguri

Setarile de afisare ne ofera posibilitatea de a aele pagina principalaa site0ului si pagina articolelor , deasemenea avem si posibilitatea de a descuraja mtoaree de cautare sa indexeze site ul , lucrur care ne permite sa lucram in liniste pana la terminarea site-ului fara sa ne fie frica ca cineva o sa ne poata vizualiza din intanmmplare munca.

Setari discutii -tine elementele principale din blog: -comentarii articole.

Setari media- de aici controlam dimensiunile fisierelor media -dimeniunea minima, medie si maxima.

Setări legături permanente

WordPress îți oferă abilitatea de a crea o structură personalizată de URL-uri pentru legăturile tale permanente și arhive. Structurile personalizate de URL-uri pot îmbunătăți estetica, ușurința utilizării și compatibilitatea în viitor pentru legăturile tale. Aici găsești un număr de etichete disponibile (en) și câteva exemple cu care poți începe.

GESTIONAREA ACTIVITATILOR SPORTIVE- este tema aleasa de mine, prin aceasta aplicatie am sa incerc sa pun in valoare avantajele pe care le are wordpresul pentru a gestiona chiar si un site tip club sportiv. Pentru a putea gestiona anumite activitati avem nevoie de un mod de administrare care sa ne ofere simplitate si sa ne economiseasca tip, de aceea am ales wordpress, indeplineste toate cerintele necesare pentru realizarea aplicatiei mele. Poentru optimizarea site-ului am ales sa creez totul structurat . In pagina de Servicii, mi s-a parut best parctice sa ofer “clientului”sansa sa-si faca o rezervare fara sa fie nevoit sa sune sau sa se deplaseze pana la destinatie, asa ca am adaugat un calendat si un formular de contact prin care popsibilul client isi alege si rezerva ziua in care doreste sa inchirieze. Acest mesaj o sa apara in admministrarea wordpresului in format:

Bine inteles ca va intrebati, daca stau toata ziua ca sa verific wordpress ul sa vad daca nu cumva cineva si- a facut reszervare. Nici macar, in momenul in care clientul a trimis cererea de rezervare, primesc instant si mail cu toate datele pe care mi le a oferit clientul

Formularul de contact, am creat un formular de contact pentru echipe care doresc sa se inscrie la turneu, functioneaza pe acelasi principiu.Este mul mai usort sa gestionezi lucrurile atunci cand stim sa utilizam tehnologia.

Wordpess este bazat pe o platformă de bloging care in anul 2001 avea cateva mii de instalari.Acum la aproape 6 ani de la dezoltare ,platforma are peste 22 de milioame de instalari. Daca la inceput platforma a fost dezvoltata pentru bloguri, acum a inceput sa sustina chiar si magazinele online.

Platforma pune la dispozitie sute de teme si mii de pluginuri care care permit o dybctionalitate crescuta.

Este important sa nu se confunde paginile si postarile cu tema ș nu ai nici macar o legatura.

Fiecare tema se gaseste in directorul teme, putem allege o tema sau putem sa personalizam una dupa bunul plac, wordpress ofera foarte multe posibilitati- putem lua o tema- sau putem dezvolta un site de la 0.

Temele au 3 componente impoirtanteȘ

Prezentarea unde gasim fisierul style.css

Continutul

Logistica unde gasim un fisier numit function.php care ne ofera posibilitatea sa configuram tema dupa bunul plac.

Incercand sa explic cat mai bine avantajele WordPress am atasat o poza din panoul de controlȘ

In seciunea de Pagini-putem sa ne creem paginile, cate vrem si avem posibilitatea de a stiliza dupa bunul plac.

Media si linkuri – ne ofera posibilitatea de a insera imagini si linkuri.

Widgeturi- ne permit sa adaugam sis a gestionam cu usurinta aproape toata aplicatiaȘ- bara laterala, antentul, continutul si footerul . Putem insera cate widgeturi dorim.

Meniurile- ofera unul din cele mai mare avantaje ale wordpresului, ca si la widheturi , putem crea cate m,eniuri dorim, si le putem gestiona dupa bunul plac- usurinta cu care le putem posta in tema este uimitoare , doar cu un singur click.

Un avantaj pe care il ofera wordpress ul este Acela ca putem adauga si suprascrie codul initial fara nici o restrictie. Practic daca detinem cunostiinte avanasate de Html , Css , Php si Java script, ne putem crea propria aplicatie web , personalizata si unica.