HTML, CSS și JavaScript: de la începător până la avansat

Name: HTML, CSS și JavaScript: de la începător până la avansat
Rating: 4.3 (10 reviews)

HTML, CSS, JS, stilizare CSS, tutorial front-end, HTML5, CSS3, JavaScript pentru începători, dezvoltare web, javascript

Created byVasile Bocancea

Last updated 9/2024

Romanian

What you'll learn

HTML: Vei învăța să creezi structuri web semantice și accesibile folosind elementele esențiale din HTML.
CSS: Vei stiliza paginile web utilizând culori, fonturi și layout-uri responsiv.
JavaScript: Vei adăuga interactivitate pe paginile web, manipulând DOM-ul și gestionând evenimente.
Proiecte web: Vei integra HTML, CSS și JavaScript pentru a dezvolta site-uri și aplicații web.

Course content

3 sections • 65 lectures • 11h 11m total length

Ce vei obține la acest curs3:44
Instalare Visual Studio Code (VS Code)5:52
Afișarea textelor pe pagină19:42
Clase CSS14:17
Stilizarea textelor12:02
Imagini9:28
Imagini "alt"2:25
Div - grupare de elemente19:44
<div> este un element HTML de tip container folosit pentru a grupa alte elemente. Nu are un stil sau un comportament predefinit, dar este folosit frecvent pentru a structura și organiza conținutul unei pagini web. Stilizarea și poziționarea unui <div> se face prin CSS, fiind util pentru layout-uri complexe și secțiuni separate.
Evitarea dublării claselor în CSS5:50
Margin / Padding10:20
Diferența dintre margin și padding în CSS este:
Margin: Spațiul exterior dintre un element și alte elemente din jurul său. Afectează distanța față de alte elemente.
Padding: Spațiul interior dintre conținutul unui element și marginile acestuia. Afectează distanța dintre conținutul elementului și marginea sa interioară.
Pe scurt, margin influențează exteriorul, iar padding interiorul unui element.
Flex (Flexbox) introducere12:30
Flex (Flexbox) liste (ol/ul)3:49

Header (structura HTML)12:56
Header (Flex)9:18
Header (style)17:00
Header (responsive / flex-wrap)6:36
Elementele responsive sunt esențiale pentru a asigura că site-urile web se afișează și funcționează bine pe diferite dispozitive și dimensiuni de ecran. Acest lucru îmbunătățește experiența utilizatorului și ajută la menținerea unui site accesibil și atractiv pe telefoane, tablete și desktop-uri.
Header (responsive / @media)7:18
Elemente de cautare pe pagina (part. 1)6:33
Elemente de cautare pe pagina (part. 2)10:18
Poziționarea titlului11:39
Galerie foto (Flex, part.1)6:09
Galerie foto (Flex, part.2)4:59
Galerie foto (Flex / @media, part.3)13:38
Galerie foto (Grid)6:30
Butoane (button)10:24
Footer24:10
Footer-ul este secțiunea de la finalul unei pagini web sau a unui document, care conține de obicei informații adiționale. În cazul unei pagini web, poate include linkuri către pagini importante, cum ar fi "Contact", "Politica de confidențialitate", "Termeni și condiții", copyright sau informații despre autor.
Footer (responsive)8:40
Hover5:23
În CSS, hover este un pseudo-clasă utilizată pentru a aplica stiluri unui element atunci când utilizatorul plasează cursorul deasupra acestuia. De exemplu, când utilizatorul trece cu mouse-ul peste un buton, fundalul devine albastru, iar textul alb.

Variabile și constante24:50
Concatenarea13:32
DOM (part. 1)16:42
DOM (Document Object Model) în JavaScript este o interfață care reprezintă structura unui document HTML sau XML sub forma unui arbore. Acesta permite JavaScript-ului să acceseze și să manipuleze elementele unei pagini web, cum ar fi modificarea textului, schimbarea stilurilor, adăugarea sau eliminarea de elemente, și gestionarea evenimentelor (ex: click). Practic, DOM face legătura între paginile web și JavaScript, permițându-ți să creezi pagini dinamice și interactive.
DOM (part. 2)5:28
if / else (part. 1)29:05
if / else (part. 2)9:02
Operatorul ternar10:45
DOM + if/else9:59
Funcții (part. 1)23:48
Funcțiile în JavaScript sunt blocuri de cod reutilizabile care îndeplinesc o anumită sarcină și pot fi apelate oriunde în program. Ele pot primi parametri și pot returna un rezultat.
Funcții cu parametri (part. 2)16:06
Funcții + DOM (event)18:04
Funcții + if/else11:34
Funcții - primirea datelor din input (input value)5:34
Array (part. 1)8:10
Un array este o structură de date care permite stocarea și gestionarea unei liste ordonate de elemente. Fiecare element din array are un index numeric (începând de la 0), iar valorile pot fi de orice tip: numere, stringuri, obiecte, chiar și alte array-uri.
Array multidimensional și obiecte (part. 2)11:54
JSON (JavaScript Object Notation)3:31
JSON (JavaScript Object Notation) este un format ușor pentru schimbul de date, utilizat pe scară largă pentru a transmite date între un server și o aplicație web. Este ușor de citit și scris pentru oameni și de interpretat și generat de mașini. JSON este derivat din sintaxa obiectelor JavaScript, dar este un format text independent de limbaj, fiind suportat de majoritatea limbajelor de programare.
Structura JSON:
Obiecte: O colecție de perechi cheie-valoare, încadrată între {}.
Liste: O listă ordonată de valori, încadrată între [].
Array - adăugarea și eliminarea elementelor16:49
Array - căutarea elementelor14:25
Array - operatorul spread și sortarea elementelor5:46
For (part. 1)8:10
În JavaScript, for este o structură de control care permite repetarea unui bloc de cod de un anumit număr de ori.
For (part. 2)10:52
For (part. 3)9:39
For (part. 4)9:36
ForEach9:37
ForOf6:05
ForIn5:10
Map16:16
În JavaScript, map() este o metodă folosită pe array-uri care permite aplicarea unei funcții asupra fiecărui element dintr-un array și returnează un nou array cu rezultatele, fără a modifica array-ul inițial.
Pe scurt:
Intrare: un array original și o funcție care se aplică fiecărui element.
Ieșire: un nou array cu valorile returnate de funcție.
Filter4:34
În JavaScript, metoda filter() este utilizată pentru a crea un nou array care conține doar elementele dintr-un array existent care îndeplinesc o anumită condiție.
Pe scurt:
Filter ia un array și returnează un nou array.
Selectează doar elementele care trec un test (o funcție callback care returnează true sau false).
Reduce8:03
În JavaScript, metoda reduce() este folosită pentru a parcurge un array și a-l reduce la o singură valoare. Aceasta aplică o funcție pe fiecare element al array-ului (de la stânga la dreapta), acumulând rezultatele într-o valoare finală.
Pe scurt, funcția ia două argumente:
Acumulatorul (valorea care este actualizată la fiecare pas).
Elementul curent din array.
La final, reduce() returnează valoarea acumulată.
Practica: proiect pe compartimentul DOM și functii3:45
Practica: proiect bazat pe metodele de lucru cu un array0:02
Practica: operatorul ternar și array0:22
Practica: array0:16
API - introducere16:07
Un API (Application Programming Interface) în JavaScript este un set de funcții și reguli care permit ca diferite aplicații sau servicii să comunice între ele. Practic, un API oferă metode standardizate prin care poți solicita și primi date din alte aplicații sau servere fără să știi cum funcționează acestea în detaliu.
Web API: Permite comunicarea cu un server, cum ar fi obținerea de date de la un server printr-o cerere HTTP (folosind fetch()).
API - afișarea datelor pe pagină8:19
API - async / await și try / catch17:31
Practica: API0:36

Requirements

Nu este nevoie de experiență în programare; vei învăța tot ce trebuie să știi. Pentru cei care au deja cunoștințe în domeniu, acest curs va oferi informații suplimentare, și vei avea posibilitatea de a exersa prin câteva proiecte practice.

Description

Cursul „HTML, CSS și JavaScript: de la începător până la avansat” oferă o formare cuprinzătoare în dezvoltarea web, începând de la concepte fundamentale până la tehnici avansate. Vei învăța să creezi pagini web atractive și funcționale, să aplici stiluri complexe cu CSS și să implementezi funcționalități interactive cu JavaScript. Cursul include și aspecte precum optimizarea performanței, accesibilitatea și integrarea de API-uri. Pe lângă dobândirea unor competențe tehnice solide, vei beneficia de resurse și sfaturi pentru căutarea unui loc de muncă în domeniu, sporind astfel semnificativ șansele tale de angajare și avansare profesională.

Introducere în HTML
- Structura documentelor HTML
- Elemente și atribute
- Formatarea textului și inserarea imagini
Introducere în CSS
- Selectori și proprietăți
- Stilizare text și layout-uri
- Design responsive și media queries
Introducere în JavaScript
- Sintaxa și variabile
- Manipularea DOM și evenimente
- Funcții și obiecte
Tehnici avansate în JavaScript
- Manipularea DOM avansată
- Lucrul cu formulare și validare
- Integrarea cu API-uri externe
Suport și consultanță
- Asistență personalizată pe parcursul cursului
- Consultanță pentru proiecte și probleme tehnice
- Sfaturi pentru optimizarea portofoliului și pregătirea pentru interviuri

Încă nu ești convins? Acest curs este mai mult decât o simplă serie de lecții. Este o oportunitate de a-ți construi o carieră de succes în dezvoltarea web, sprijinit de profesioniști dedicați care sunt gata să te ajute în fiecare pas al călătoriei tale. Nu rata ocazia de a dobândi abilități esențiale și de a beneficia de suportul necesar pentru a-ți transforma visul profesional în realitate. Înscrie-te acum și începe să îți construiești viitorul în dezvoltarea web!

Who this course is for:

Acest curs este orientat pentru dezvoltatorii din domeniul front-end.
Pentru cei care doresc o schimbare în viață, să capete o nouă profesie.
Pentru studenții începători.

HTML, CSS și JavaScript: de la începător până la avansat

What you'll learn

Explore related topics

Course content

HTML / CSS12 lectures • 2hr

HTML / CSS Practica16 lectures • 2hr 42min

JavaScript - de la primele linii de cod la proiecte avansate37 lectures • 6hr 30min

Requirements

Description

Who this course is for: