Sarcina 7: CSS flexbox.
Sarcina 7: flexbox. Creează o pagină nouă cu un layout responsive folosind Flexbox.
18.04.2024
Verginia Stolear
Front-End Developer
Despre mine
Proiecte HTML & CSS
Sarcina 6: CSS float.
Sarcina 6: float. Adaugă o bară laterală (sidebar) și un conținut principal (main content) plasate unul lângă celălalt folosind float, iar sub ele adaugă un footer curățat (cleared). Asigură-te că antetul (headerul) conține un logo și o navigare. Să folosim aici proprietăți precum float, display (cu opțiuni de tip listă și tabel), și să adăugăm ceva conținut în interiorul unor casete (box-uri).
16.04.2024
Sarcina 4: CSS box model, realizat cu ajutorul HTML5 și CSS.
Sarcina 4: CSS box model. Adaugă un fișier nou în care să inserezi cel puțin 3 imagini. Conținutul poate fi afișat cum dorești, dar trebuie să folosești componentele modelului box (box model). Adaugă o bordură și încearcă să folosești cât mai multe proprietăți posibile. Adaugă o culoare de fundal în jurul imaginilor și încearcă să folosești cât mai multe proprietăți pentru fundal.
10.04.2024
Sarcina 3: A doua formă, realizat cu ajutorul HTML5 și CSS.
Sarcina 3: A doua formă. Creează un formular cu: nume, email, URL, parolă, gen. Când câmpul este activ, culoarea chenarului (border) trebuie să fie roșie, iar în timpul introducerii textului culoarea de fundal (background) trebuie să fie roz. Un câmp, la alegerea ta, trebuie să fie dezactivat (disabled), iar culoarea de fundal a acestuia să fie gri. Dacă selectăm genul, câmpul respectiv trebuie să devină galben.
05.04.2024
Sarcina 2: Prima formă, realizat cu ajutorul HTML5.
Sarcina 2: Prima forma. Creează un formular cu câmpurile minime afișate în imagine. - 3 câmpuri trebuie să fie obligatorii, - 1 câmp trebuie să fie doar pentru citire (readonly) și să conțină date implicite, - adaugă un câmp pentru parolă cu minimum 8 caractere, - toate câmpurile trebuie să aibă placeholder, - adaugă un buton de resetare, - adaugă un câmp de tip fișier care să accepte doar imagini.
31.03.2024
Sarcina 1: Etichetele Head și Body, realizat cu ajutorul HTML5 și CSS.
Sarcina 1: Etichetele Head și Body. Inserează în body 3 blocuri cu culori sub formă de imagini; lângă fiecare imagine, afișează numele culorii. Când trec cu mouse-ul peste imagine, vreau să văd informații suplimentare despre acea culoare. Adaugă toate titlurile (headings) în ordine, de la cel mai puțin important la cel mai important. Sarcina a fost realizată folosind HTML, CSS și JavaScript.
26.03.2024
Proiecte în JavaScript
Sarcina 8: Funcții de manipulare a șirurilor de caractere, realizat cu ajutorul JS, HTML5 și CSS.
Sarcina 8: Funcții de manipulare a șirurilor de caractere. 1. Scrie o funcție pentru a extrage numerele dintr-un șir de caractere. 2. Scrie o funcție findCapitalizedWords(str) care returnează un array de cuvinte care încep cu literă mare. 3. Scrie o funcție pentru a valida formatul datei conform unui format special, de exemplu: 'YYYY-MM-DD'. 4. Scrie o funcție findDuplicateWords(str) care returnează un array de cuvinte duplicate în șirul de caractere. 5. Scrie o funcție pentru a extrage domeniul dintr-un email.
05.06.2024
Sarcina 7: Managementul Studenților, realizat cu ajutorul JS, HTML5 și CSS.
Sarcina 7: Managementul Studenților. Este dat un array de obiecte student, unde fiecare obiect student conține următoarele proprietăți: ● name: Numele studentului (string), ● scores: Un array de scoruri pe care studentul le-a obținut (array de numere), Sarcina ta este să efectuezi următoarele transformări: ● Calculează scorul mediu pentru fiecare student și adaugă-l ca o nouă proprietate numită averageScore. ● Filtrează studenții al căror scor mediu este mai mic decât un prag dat. ● Sortează studenții rămași după scorul mediu în ordine descrescătoare.
03.06.2024
Sarcina 6: Listă de cărți, realizat cu ajutorul JS, HTML5 și CSS.
Sarcina 6: Listă de cărți. Creează un array de obiecte, unde fiecare obiect descrie o carte și are proprietăți pentru titlu (string), autor (string) și dejaCitit (boolean care indică dacă ai citit-o sau nu). Iterează prin array-ul de cărți. Pentru fiecare carte, afișează titlul cărții și autorul cărții astfel: 'The Hobbit de J.R.R. Tolkien'. Acum folosește o instrucțiune if/else pentru a schimba afișarea în funcție de faptul dacă ai citit-o sau nu. Dacă ai citit-o, afișează un mesaj de genul 'Ai cititit deja 'The Hobbit' de J.R.R. Tolkien', iar dacă nu, afișează un mesaj de genul 'Încă trebuie să citești 'The Lord of the Rings' de J.R.R. Tolkien.'
29.05.2024
Sarcina 5: addEventListener pentru evenimente de click, realizat cu ajutorul JS, HTML5 și CSS.
Sarcina 5: addEventListener pentru evenimente de click. Adaugă un ascultător de evenimente (event listener) pentru evenimentele de click pe un element la alegerea ta. Ascultătorul de evenimente trebuie să păstreze un contor al numărului de click-uri pe acel element. Afișează în consolă valoarea contorului de fiecare dată când este incrementat. Adaugă un ascultător de evenimente pentru tastatură (keyboard events) pe elementul HTML al unei pagini web. Când este apăsată o combinație specifică de taste (de exemplu: a, b, c, d), afișează un mesaj specific.
29.05.2024
Sarcina 4: Găsește elementul unic și cel mai frecvent, realizat cu ajutorul JS, HTML5 și CSS.
Sarcina 4: Găsește elementul unic și cel mai frecvent. Scrie un program care va primi ca argument un array de date ce conține și valori duplicate și va returna un array cu valori unice. Ca rezultat, trebuie să afișăm și elementul cel mai frecvent din array-ul inițial. (exemplu: [1, 4, 5, 1, 5, 1] ⇒ [1, 4, 5], „cel mai frecvent este 1”).
21.05.2024
Sarcina 3: Inversează sau sortează, realizat cu ajutorul JS, HTML5 și CSS.
Sarcina 3: Inversează sau sortează. Scrie o funcție în JavaScript care, dacă primește ca argument un număr, va returna inversul acestuia. De exemplu: 345 ⇒ 543. Iar dacă primește ca argument un șir de caractere (string), va returna acel șir cu literele ordonate în ordine alfabetică. Exemplu: 'anb' ⇒ 'abn'.
20.05.2024
Sarcina 1: Convertor de temperatură °C °F, realizat cu ajutorul JS, HTML5 și CSS.
Sarcina 1: Convertor de temperatură. Stochează o temperatură în grade Celsius într-o variabilă. Convertește-o în Fahrenheit și afișează mesajul: 'nn°C înseamnă nn°F'. Acum stochează o temperatură în Fahrenheit într-o variabilă. Convertește-o în Celsius și afișează mesajul: 'nn°F înseamnă nn°C'.
02.05.2024
Proiecte realizate
Sarcina : Etichetele Head și Body, realizat cu ajutorul HTML5 și CSS.
Sarcina : Etichetele Head și Body. Inserează în body 3 blocuri cu culori sub formă de imagini; lângă fiecare imagine, afișează numele culorii. Când trec cu mouse-ul peste imagine, vreau să văd informații suplimentare despre acea culoare. Adaugă toate titlurile (headings) în ordine, de la cel mai puțin important la cel mai important. Sarcina a fost realizată folosind HTML, CSS și JavaScript.
26.03.2024
Sarcina : Etichetele Head și Body, realizat cu ajutorul HTML5 și CSS.
Sarcina : Etichetele Head și Body. Inserează în body 3 blocuri cu culori sub formă de imagini; lângă fiecare imagine, afișează numele culorii. Când trec cu mouse-ul peste imagine, vreau să văd informații suplimentare despre acea culoare. Adaugă toate titlurile (headings) în ordine, de la cel mai puțin important la cel mai important. Sarcina a fost realizată folosind HTML, CSS și JavaScript.
26.03.2024
Proiect Final, realizat cu ajutorul HTML5, CSS și JavaScript.
Proiect Final. 1. Creează un proiect nou. 2. Acest nou proiect va fi o pagină de prezentare personală ca un CV cu informațiile tale personale. 3. Această pagină de prezentare ar trebui să conțină informații precum: ● fotografie personală, ● informații de contact personale (nume, vârstă, email etc.), ● informații profesionale (experiență de muncă etc.), ● informații despre diploma ta (universitate, cursuri etc.). 4. Poți adăuga și informații despre hobby-urile tale și ceva despre tine. 5. Să adăugăm și un formular de contact unde să pui emailul și poate linkurile tale către rețelele sociale. 6. Repositorul ar trebui să conțină o structură de foldere. De exemplu: ar trebui să ai un folder general în care să ai un folder pentru css, unul pentru js, unul pentru media (imagini) și html. 7. Proiectul ar trebui să fie responsive și să arate bine pe dispozitive mobile. 8. Încearcă să lucrezi curat respectând indentarea, spațiile unde este necesar și o denumire bună pentru clase. Evită numele generice și încearcă să fii mai specific.
28.06.2024