JavaScript onlinekurs. Professionell utveckling av webbgränssnitt - gratis kurs från HTML Academy, utbildning 9 veckor, datum 15 oktober 2023.

Avsnitt 1 Introduktion till JavaScript
Låt oss titta på hur kursen fungerar, vilka verktyg du behöver och hur du ställer in dem. Låt oss titta på vad JavaScript-språket är, inklusive ECMAScript-specifikationen och webbläsaren.

Hur fungerar kursen? Organisatoriska frågor.

Arbetsschema på kursen.
Genomgång av projekt.
Kvalitetskriterier.

JavaScript-språk

ECMAScript-specifikation.
Vad ger webbläsaren JavaScript?

JavaScript grunderna.

Grundläggande syntax: parenteser, hängslen, operatorer, reserverade ord, kommentarer.
De grundläggande byggstenarna är variabler och funktioner.
Primitiver och komplexa datatyper.

Verktyg.

Kodredigerare.
Linters.
Utvecklingsserver.

Avsnitt 2 Grundläggande JavaScript-funktioner
Låt oss börja studera de grundläggande konstruktionerna av JavaScript, särskilt funktioner. Låt oss titta på nyanserna av att deklarera variabler. Låt oss bekanta oss med utvecklarverktygen.

Variabler.

Siktområden.

Villkorliga uttalanden.

Ternär operatör.
Flervalsoperatörsomkopplare.

Cyklar.

Kasta.

Funktioner.

Pilfunktioner.
Standardfunktionsparametrar.

viloparametrar.

Hissning av variabler och funktioner.

Introduktion till DevTools (utvecklarverktyg).

Avsnitt 3 Objekt och matriser
Sektion utan live

Du kommer att bli bekant med komplexa datatyper: arrayer och objekt. Lär dig att skapa och hantera dem.

Komplexa datatyper.

Matriser.

Grundläggande array-metoder.

Föremål.

Återuppringningar (återuppringningsfunktioner).

Avsnitt 4 Inbyggda objekt och funktioner
Låt oss titta på de objekt och funktioner som finns i själva JavaScript-språket. Låt oss beröra utförandekontexten för detta. Låt oss köra och felsöka koden i konsolen för utvecklarverktyg.

Destrukturering.

sprid syntax.

Inbyggda objekt och deras metoder.

Sträng.
Siffra.
Boolean.
Datum.
Matematik.

Operatör ny.

JavaScript inbyggda funktioner.

Funktionssammanhang.

Nyckelordet är detta.
Förlust av miljö.

DevTools. Använda konsolen.

Avsnitt 5 Kodorganisation
Låt oss titta på begreppet omfattningar. Låt oss diskutera DRY-principen (upprepa inte dig själv) och hur man använder den för att skriva mindre kod och ändå få mer gjort. Låt oss lära oss vad moduler är och hur man "bryter" kod på dem; Vad är en ingångspunkt?

Siktområden.

Global omfattning av fönstret.
Stängningar

Modularitet.

Kod återanvändning, DRY princip.
Konceptet med en modul.
Ingångspunkt.
ECMAScript-moduler, import och export syntax.

DevTools: felsöka kod med hjälp av källor.

Avsnitt 6 DOM och evenemang
Sektion utan live

Du kommer att bli bekant med Document Object Model. Document Object Model eller DOM). Tänk på hur du ska beskriva reaktioner på användaråtgärder: textinmatning, klicka på vissa element, rullning, etc.

DOM-träd.

dokument är roten till allt.
DOM-trädstruktur.
Sök efter element på en sida.
Hantera elementattribut.

Mallar och data.

Händelser på sidan.

Händelsehanterare.

Avsnitt 7 DOM-manipulation
Låt oss försöka skapa, ta bort, flytta och manipulera DOM-element. Med hjälp av mallar kommer vi att rita data som skapats tidigare.

DOM-trädhantering.

Hantera DOM-elementattribut.
Flytta element i DOM-trädet.

Tillvägagångssätt för att skapa DOM-element.

Skapa DOM-objekt.
Markup management: append, prepend, insertAdjacentHTML, innerHTML, textContent.

Mallar.

Strängmall (mallsträngar).
Specialetikett

Avsnitt 8 Arbeta med evenemang
Vi kommer att hantera användarinteraktion så att sidan svarar på textinmatning i formulär, klicka på vissa element, rulla osv. Låt oss titta på hur man gör denna interaktion tillgänglig.

Evenemang.

Händelseobjekt, händelsehantering: preventDefault och stopPropagation.
Eventfaser och delegering.
Tangentbordsevenemang och tillgänglighet.

Event Loop.

Form validering.

Pristine är ett formulärvalideringsbibliotek.

Validering med reguljära uttryck.

DevTools: Elements (inspektör) funktioner för att arbeta med DOM och händelser.

Avsnitt 9 Externa API: er och tredjepartsbibliotek
Låt oss titta på hur man inte "skriver din egen cykel", utan att återanvända någon annans erfarenhet och kod. Låt oss bekanta oss med konceptet med ett mjukvarugränssnitt. Application Programming Interface eller API), överväg API: et för tredjeparts JavaScript-bibliotek och JavaScript API: et för karttjänster. Låt oss ta en snabb titt på API: erna som webbläsaren tillhandahåller utvecklare.

Begreppet API.

Karttjänster och deras JavaScript API.

OpenStreetMap.
Folder.

Tredje parts bibliotek.

Varför behövs bibliotek?
Hur man ansluter till ett projekt.
noUiSlider.

Översikt över webbläsarens API.

Avsnitt 10 Nätverk
Sektion utan live

Du kommer att titta på HTTP-protokollet och JSON-dataformatet på egen hand. Fundera på hur användarens interaktion med webbplatsen förändras när nätverket används och vad som kan gå fel.

HTTP-protokoll och dataformat.

JSON.

Undantagshantering.

försök fånga.

Verktyg för att arbeta med nätverksförfrågningar.

Avsnitt 11 Asynkroni. Nätverk
Låt oss titta på begreppet asynkroni och hur man uppnår det med löften. Lova lova). Låt oss bekanta oss med tekniker som låter dig göra förfrågningar till servern från en webbläsare. Låt oss titta på hur man hanterar fel i praktiken när man arbetar med nätverket om något går fel.

Asynkroni.

setTimeout och setInterval.
Löfte.

Arbeta med nätverket.

hämta för att kontakta servern.
Hantering av fel i förfrågningar.

DevTools: arbetar med nätverksförfrågningar i nätverket.

Första veckan i försvaret
Avslutande av arbetet med projektet och förberedelser inför disputationen.

Avsnitt 12 Feedback och optimering
Vi optimerar arbetet med data och händelser på vår hemsida. Vi implementerar tydlig och användarvänlig gränssnittsfeedback.

Avancerat arbete med arrayer.

Sortering.
Filtrering.

Prestandaoptimeringar.

Tappa ramar - strypning.
Eliminering av studs - debounce.

Fil API.

URL.createObjectURL().
FileReader.

Andra veckan i försvaret
Den första bedömningen av projektet av den granskande mentorn enligt kvalitetskriterier.

Tredje veckans försvar
Förbättra projektet baserat på kommentarerna från den granskande mentorn och skicka in det för en andra bedömning.

Avsnitt 13 Final
Låt oss sammanfatta kursen och sedan diskutera funktionerna i JavaScript som du kan behöva stöta på på jobbet. Begreppet äldre kod och vad man ska göra med den, med koden. Låt oss ta en snabb titt på de avancerade front-end utvecklarverktygen så att du kan förstå var du ska gå härnäst.

Speciell JavaScript.

Strikt läge 'använd strikt'.
Valfria semikolon.

Äldre kod.

jQuery.
var och funktionell omfattning.
XMLHttpRequest.

Konstruktörsfunktioner.

Prototyper.

Avancerade verktyg.

Webpack.

Transpilatorer och polyfills.

Babel.

Fjärde försvarsveckan
Göra slutredigeringar och få ett slutbetyg.