Giters

DragosGhinea / GentixBank_Website

Website Tehnici Web - Proiect

Geek Repo:Geek Repo

Github PK Tool:Github PK Tool

Gentix Bank | Tehnici Web

Proiect la Tehnici Web (An I Semestru II) cu tematica site-ul unei bănci ce conține cunoștințe de bază legate de HTML, CSS, JavaScript, Node.js.

Cerințe urmărite în realizarea proiectului

Pentru realizarea proiectului au fost urmărite mai multe cerințe:

HTML și CSS

  • fisiere separate pentru HTML si CSS;

  • sa treaca testul de validare HTML (http://validator.w3.org/ ) si testul de validare CSS (https://jigsaw.w3.org/css-validator/);

  • site-ul sa fie responsive (media query, unitati relative, tipuri de display);

  • selectori CSS de baza (dupa id, clasa, tag, elementContinut, elementCopil, al n-lea copil de tipul unui tag (:nth-of-type));

  • proprietati: width, height, color, background, font-size, border, padding, margin, display;

  • layout-ul sa contina coloane (pe minim o pagina) si fie realizat fara tabele (folosind flex si grid);

  • sa contina un menu drop-down realizat cu CSS;

  • continut generat (:after, :before);

  • tranzitie care implica schimbarea mai multor proprietati la intervale diferite de timp;

  • animatie care sa modifice proprietati ale unuii element;

JavaScript

  • fisier separat JavaScript;

  • modificarea stilului unui element sau al unui grup de elemente;

  • manevrarea DOM-ului (selectare dupa id, tag, clasa, selectorCSS);

  • creare si stergere de elemente;

  • folosirea si modificarea evenimentelor generate de mouse si tastatura;

  • modificare de proprietati;

  • inputuri functionale (de exemplu: input de tip text/range/number/radio/checkbox, select, textarea);

  • setTimeout, setInterval;

  • folosirea localStorage (sa se pastreze in localStorage o colectie de elemente);

  • folosirea a cel putin unei metode din clasele: Math, Array, String, Date;

  • schimbarea aleatoare a valorilor unor proprietati (de exemplu: culoare, dimensiuni, pozitii);

  • folosirea proprietatilor classList, target, currentTarget;

  • folosirea metodelor getComputedStyle si stopPropagation cu un sens relevant;

  • validarea datelor dintr-un formular folosind expresii regulate;

Node.Js

  • cereri get/post: preluare date din formular

  • cereri Ajax cu preluare date din fisier json

  • sesiuni:login+logout

  • template-uri (de exemplu create prin EJS)

  • pagina pentru eroarea 404

Pornirea aplicației Express

Pentru realizarea proiectului s-a folosit express.js, pe port-ul 5050. Instalați node.js și rulați node app.js pentru a porni aplicația.

Bibliografie

Imagini preluate de pe internet folosite pentru realizarea proiectului:

About

Website Tehnici Web - Proiect

License:MIT License

Languages

Language:HTML 39.3%Language:CSS 34.7%Language:JavaScript 19.3%Language:EJS 6.6%