JavaScript a ES6

Yablko (Roman Hraška)

Level
Kapitol: 190
Kategória: Programovanie
Hodnotenie: 4,9 z 5
Dĺžka: 22h 34min
Jazyk: SK

Skillmea Premium Obľúbené

42 €

mesačne (ročná platba)

Skillmea Online Kurzy

21 €

mesačne (ročná platba)

Kúpiť samostatný kurz

149,00 €

doživotný prístup

Popis online kurzu JavaScript a ES6

JavaScript je najpopulárnejší programovací jazyk súčasnosti. Má najživšiu vývojársku komunitu, o pracovné ponuky nie je núdza. React, Angular, Vue a Node patria medzi najžiadanejšie technológie. Všetky z nich vyžadujú moderný JavaScript. Tento kurz ťa naučí moderný JavaScript.

V tomto online kurze sa naučíš používať JavaScript v prehliadači. JavaScript začal ako skriptovací jazyk internetových prehliadačov. Slúžil na overenie, čo si správne vyplnil formulár. Dnes toho vie oveľa viac. Vieš ním:

čítať, upravovať a mazať HTML a CSS
reagovať na udalosti v prehliadači
reagovať na akcie používateľa
ovládať prehliadač samotný
robiť tak stránky interaktívnymi a meniť ich na aplikácie

Dnes JavaScript existuje aj mimo prehliadača. Node.js ti dovolí jazykom JavaScript programovať na serveri, tým pádom JavaScript dnes vie nahradiť aj PHP, Ruby či Python. Ak sa zameriaš na JavaScript, nebudeš potrebovať žiaden iný programovací jazyk na vytvorenie plnohodnotnej webovej aplikácie.

Tento online kurz sa venuje JavaScriptu v prehliadači. Na skutočných príkladoch sa naučíš syntax a pravidlá jazyka, ktoré platia všade, aj keby neskôr skočíš na server.

Na konci budeš vedieť JavaScript používať v prehliadači aj bez knižníc, ako jQuery. Ale hlavne sa naučíš písať dosť moderného JavaScriptu na to, aby si vedel používať Angular, React, Node, Vue a čokoľvek ďalšie, čo príde v budúcnosti.

Čo sa naučíš

Okrem iného sa naučíš:

syntax a pravidlá jazyka JavaScript
JavaScript v prehliadači
moderný ES6/ES7 JavaScript
npm / yarn
skrotiť Document Object Model
zvládnuť Event Loop
SVG animácie
Webpack / Babel
ES6 moduly
asynchrónne programovanie, async/await, promises

Prvá polovica online kurzu ťa oboznámi s jazykom na menších príkladoch. Dostaneš tiež kopu praktických rád pre prácu s Developer Tools v prehliadači. A pochopíš, čím sa JavaScript líši od iných programovacích jazykov.

Druhá polovica sa venuje ES6, tzv. modernému JavaScriptu. Modulom, bundlerom, package manažérom. Všetko veci, ktoré potrebuješ zvládnuť pre Angular či React.

Čo všetko dostaneš

nadupaných 170 kapitol online kurzu,
viac ako 22 hodín videotutoriálov,
zdrojové kódy na stiahnutie,
certifikát o absolvovaní online kurzu JavaScript a ES6,
garancia vrátenia peňazí v prípade, ak nebudeš s kurzom spokojný.

Kapitoly online kurzu

JavaScript je tu ⁽¹⁰⁾

Ukážka zdarma

4:44

Ukážka zdarma

4:25

03 Dám ti knihy od múdrejších ľudí, MDN = áno

5:42

Ukážka zdarma

8:33

★ Zadanie 01

Naučím ťa programovať hry!

0:44

Ukážka zdarma

6:26

Ukážka zdarma

7:28

Ukážka zdarma

9:27

Tipy, rady a pravidlá pre každý kurz

5:54

Inštaluj si, nastavím ti ⁽⁴⁾

★ Zadanie 02

08 Install #1 Node, npm, package manažéri, Terminal

5:53

09 Install #2 Textové editory, Sublime nastavenia, JS package

9:29

10 Install #3 Lepšie dopĺňanie kódu cez Tern.js

10:12

JS v prehliadači ⁽¹⁶⁾

★ Zadanie 03

Ukážka zdarma

10:28

12 Click na mašinu, String vs Number, Type Coercion

7:39

13 Kolekcia na pole, NodeList vs Array, poľná frustrácia

6:23

14 DOM Polyfill Shim, si sochár, vyhadzuj kód veselo

9:30

15 _lodash, externé knižnice, otherDude

8:00

16 localStorage - ako cookies, len sexy

7:07

17 JSON formát, náš kamarát, v localStorage

5:59

18 localStorage limitácie a kde sa používa naozaj

4:45

★ Zadanie 04

19 JSON, tučné triky v Devtools konzole

4:52

20 Default operátor || "všetko je fajn, keď mám funkciu"

9:59

21 Document vs. Window object, globálne premenné, JS environment

8:21

22 MODULE PATTERN #1 anonymné IIFE, local function scope

7:39

23 MODULE PATTERN #2 fun Declaration vs. Expression, Hoisting

10:15

Nemusíš všetko (+ frustrujúce úlohy)

11:02

JavaScriptové špecialitky 1 ⁽¹⁴⁾

24 Ak začínaš + ktorý jazyk si vybrať (či neskoro na takú otázku?)

7:00

25 Špecialitky #1 JavaScript wat

8:45

26 Špecialitky #2 Začiatky JS, ECMAScript, Node.js, V8

5:44

27 Špecialitky #3 JS dnes, JS nemá Classy, letmý stret s Prototypom

7:36

28 Špecialitky #4 Elegantný kód, Java vs JavaScript

8:09

29 Špecialitky #5 String, Number, Math.object()

9:20

★ Zadanie 05

30 Špecialitky #6 NaN a Infinity, číselné kuriozity (to sa rýmuje)

4:26

31 Špecialitky #7 Truthy/Falsy && Coercion || == vs === comedy !!

8:07

32 Špecialitky #8 Premenné, Hoisting, Scope, for a VAR vs. LET

8:37

33 Špecialitky #9 {object} [array] prototype, srandy s FOR cyklom

9:18

34 Špecialitky #10 funkcie() expression/stmnt, arguments.obj(), hodnota this

6:21

35 Špecialitky #X-II funkcie() call/apply, "konštruktor" cez new

6:24

★ Zadanie 06

SVG (a strict mode) ⁽¹¹⁾

Ukážka zdarma

11:12

37 SVG formát, SVG HTML element, vektory sú tvoj kamarát

6:09

38 SVG atribúty, smeksi animácie, appky a galérie SVG ikoniek

7:36

39 SVG v HTML, aký máš dlhý a nebuď deprecated 👎 😭

7:58

40 Keď píšem do inputu, SVG kruh sa vypĺňa jak treba

8:00

41 Ja som mal trojku z matiky, čo sa bojíš

6:52

42 Točíme kruh, už sa hráme s farbami, dočkal si sa, juch

6:16

43 Classlist.toggle(), SVG stroke zdedil farbu z color

6:15

44 SVG + CSS3 bounce animácia, máme spinner jak nišť

6:14

45 Kompatibilitititalita s vieš čím, finálne SVG slová, úlohy

9:04

★ Zadanie 07

NPM a Babel ⁽¹³⁾

46 Úvod do ES6 alebo ES2015, pretože je to to isté ale ES6 je kratšie

4:28

47 Tvoj prvý ES6 kód (...rest, => fun, class)

5:56

48 Ešte stále tvoj prvý ES6 kód (default params, method(), BABEL)

8:48

49 NPM a rozprávka o moduloch, sadnite si deti

5:35

50 NPM, Code Reuse, Modul vs Package, [n]ode [p]ackage [m]anager

5:46

51 NPM, konzolový rýchlokurz, local vs global inštalácia

6:04

52 NPM init, package.json súbor, sladké dependencies

7:11

53 NPM, node_modules, koľko ti zaberá? pošli mi tvoj package

5:03

54 NPM, devDependencies, Production vs Development prostredie

7:26

55 (npm) BABEL, moderný kód v starých prehliadačoch, Babel pluginy

8:43

56 (npm) BABEL, ES2015+/ES6+ polyfill veď, watcher

8:54

57 (npm) BABEL, transpiller, večná súčasť života nášho

7:04

ESLint a VSCode videá

1:07

ES6+ / ES2015+ ⁽³²⁾

58 ES6/01 ES6 v zmysle ES2015+

1:44

Ukážka zdarma

4:32

60 ES6/03 Arrow functions(2) => pravidlá pre this

6:00

61 ES6/04 Arrow functions(3) nemá this => non-binding this

7:24

62 ES6/05 { block scope } 01 let, hoisting, implicit/explicit block

5:26

63 ES6/06 { block scope } 02 let v cykloch, async programovanie

7:17

64 ES6/07 CONST vs. VAR vs. LET, style guides

7:41

65 ES6/08 Object Literal Extensions, objekty sú fajn a teraz ešte viac

5:11

66 ES6/09 Object destructuring / Destructuring assignment

8:14

67 ES6/10 ...rest / spread... parametre

6:54

68 ES6/11 Default parameters vs. Default operator

5:06

69 ES6/12 Template `Strings`, Smart Strings

5:54

70 ES6/13 Novinky v String / Number / Math

5:27

71 ES6/14 Novinky v Array

6:04

72 ES6/15 Iterators, nový FOR...OF cyklus

4:11

73 ES6/16 Generator functions* 1

5:13

74 ES6/17 Generator functions* 2, idGenerator

5:06

Ukážka zdarma

10:02

76 ES6/19 Promises 02 - timer cez sľub, all, race (prax)

12:46

77 ES6/20 Asynchrónne programovanie, ASYNC/AWAIT (teória)

10:42

78 ES6/21 ASYNC/AWAIT (prax), callback hell choď preč

8:31

79 ES6/22 SET (ako pole, kde každá hodnota je unikát)

9:27

80 ES6/23 MAP (ako objekt, kde kľúč môže byť aj ne-string)

9:42

81 ES6/24 Symbol (nový dátový typ)

7:49

Ukážka zdarma

7:21

83 ES6/26 Proxies, sprav si špióna, zostaneš čistý

8:18

84 ES6/27 Chuťovky z budúcnosti, Exponentiation, UNICODE, viac

8:03

85 ES6/28 Class, extends, super()

9:16

86 ES6 Modules 01, rozbi kód na súbory (teória)

6:22

87 ES6 Modules 02, z Patternu na Modul

6:00

88 ES6 Modules 03, IMPORT / EXPORT

12:37

89 ES6 moduly zatiaľ pomalé, prepáč

3:21

Vue.js a jQuery BONUSY ⁽⁶⁾

Ukážka zdarma

10:06

91 [BONUS] Vue.js appka 02: reaktívne elementy

10:42

92 [BONUS] Vue.js appka 03: animácie

9:43

🔥Vue.js + SPA kurz! 🔥

1:39

★ Zadanie 08

93 [BONUS] Email obfuscation, skry ho pred robotom;)

20:23

Efektívny JavaScript a animácie ⁽³⁵⁾

94 Efektívny kód, async/defer

12:48

95 link="preload" prefetch preconnect, daj súborom prioritu

12:13

96 Performance 01 / ako spúšťať menej kódu, Progress Indicator 01

6:10

97 Performance 02 / Progress Indicator 02

8:53

98 Performance 03 / odmeraj si FPS (lebo chceš 60fps a nemáš)

7:43

99 Throttle

8:21

100 Debounce (video 100, ha!)

9:39

★ Zadanie 09

101 DevTools PerfTools (zmákni Performance Tab v DevTools)

9:57

102 Rendering / Painting / Scripting / Reflow / Layout v prehliadači

10:42

103 Ako nájsť BOTTLENECK v kóde cez Performance Tools

10:37

104 Svižné animácie 01 / ScaleX brácho

9:31

105 Svižné animácie 02 / žiadny PAINT cez TRANSFORM

9:25

106 Svižné animácie 03 / oklam oko cez EASING

9:13

107 Top/Left vs CSS transform (gule nablýskané)

12:43

108 Compositing

6:14

109 Čo môžeš a NESMIEŠ meniť, ak chceš rýchle animácie

5:50

110 will-change

8:06

111 DOM výkon 01 / odmeraj si koľko ti trvá (kód)

8:35

112 DOM výkon 02 / prvý veľký performance test

7:11

113 DOM výkon 03 / 5 spôsobov rýchlej DOM manipulácie

10:07

114 requestAnimationFrame (a nie setTimeout/setInterval)

9:08

115 requestAnimationFrame - zosynchronizuj sa s monitorom

7:02

116 setInterval vs setTimeout vs rAF (kedy ktorý? jeden nikdy)

6:05

117 Multithreading, buď vláčna, vláknatá

6:25

118 Web Workers 01

6:35

119 Web Workers 02, sieťový roboš

9:44

120 Micro Tasks (rozbi masívny náklad na kúsky)

9:02

★ Zadanie 10

121 269 tipov pre rýchly JavaScript

6:54

122 Ďalších 167 tipov pre rýchly JavaScript

8:34

123 Animačné knižnice

8:00

124 anime.js

10:41

125 Posledný trik a finále JS efektivity

4:36

★ Zadanie 11

Module Bundler (Parcel) a YARN ⁽¹⁸⁾

126 Používam BUNDLER, kradnem z Redditu 01

6:38

127 Používam BUNDLER, kradnem z Redditu 02

10:46

128 Čo je MODULE BUNDLER? PARCEL vs WEBPACK

10:03

129 Užitočné NPM package, tvoj švédsky stôl technológií, nažer sa

9:38

130 PARCEL WORKFLOW 01 sass, babel, autoprefix

10:55

131 PARCEL WORKFLOW 02 postcss-uncss, build

12:17

132 BUILD STEP, DEV vs PRODUCTION server, Document Root

10:48

133 YARN vs NPM

9:51

134 JavaScript frontend 2018, toto všetko musím vedieť? Spoiler: NIE

7:09

135 yarn outdated, upgrade-interactive, package.json ~verzie

5:26

136 Návrh nového projektu, Vanilla Dudes, Class pre formuláre

5:27

137 Form.js Getters/Setters, žiadne bodkočiarky??

8:22

138 EVENT DELEGATION

6:43

139 Create new dude, z Formu do DOMu

6:26

140 Validácia, HTML5 dataset

6:19

141 Z JSONu do stránky, default parameters

10:41

142 Môj proces™, ako som to spravil naozaj, každý je iný #verydeep

9:11

★ Zadanie 12

NPM build tool (vs Grunt/Gulp) ⁽⁴⁾

Ukážka zdarma

4:32

Ukážka zdarma

9:59

Ukážka zdarma

11:34

★ Zadanie 13

Webpack (Module Bundler) ⁽¹⁴⁾

146 WEBPACK

4:28

147 WEBPACK 4+ zero config - bundling ÁNO, konfigurák NIE

10:36

148 WEBPACK config file, source maps, cache busting

7:28

149 WEBPACK plugins, CleanWebpackPlugin, HtmlWebpackPlugin

8:24

150 WEBPACK config pre DEV a PRODUCTION, Webpack DEV SERVER

9:18

151 WEBPACK loaders 01, babel, regex, config generátory

9:54

152 WEBPACK loaders 02, Sass, CSS, style

7:39

153 WEBPACK extract CSS to file, CleanCSS, PostCSS, PurifyCSS

8:59

154 WEBPACK img/file loaders, obrázky, CHUNKHASH vs HASH

6:53

155 Webpack TREE SHAKING (automaticky vysekne nepoužívaný JS kód)

12:29

156 Náš kód je prerastené prasa, ale taký je život (+ ENV variables)

5:24

157 WEBPACK ezoterično (Hot Module Replacement, ImageOptim a tak)

6:20

158 jQuery je mŕtve? Sám si! (pozor: padnú nadávky, rúham sa)

8:33

159 WEBPACK Visualizer

3:01

JavaScriptové špecialitky 2 ⁽⁸⁾

160 JavaScript špecialitky #2, stiahni si moje šťavnaté PDF

5:37

161 Nečakané CSS tipy a takmer že až programátorské rady

8:00

162 CLOSURES

6:11

163 Ukradni mi dáta z kurzov, vypočímatematikuj priemernú dĺžku videí

10:38

164 PROTOTYPE

6:17

165 3 spôsoby ako zadeliť DEDIČNOSŤ v JS

5:54

166 OLOO vs ES6 Class

4:41

★ Zadanie na koniec

Vlastný NPM package ⁽⁵⁾

Ukážka zdarma

7:28

Ukážka zdarma

8:28

169 Vlastný NPM package, Maštalizátor 03, NPM PUBLISH, Tomáš žije

10:52

170 Sme tu, sme povznesení

1:33

Poď ma sledovať, creep

1:38

Lektor online kurzu

Yablko (Roman Hraška)

Front-end, back-end

Ďalšie programátorské tutoriály (a rady pre život v IT svete) nájdeš na mojom youtube rob web s yablkom. Na internete pôsobím roky. Som autorom kurzu WEBREBEL. Predtým Nauč sa jQuery, Nauč sa CodeIgniter, Yablkov TurboTip, Robíme WordPress a potom desiatok ďalších kurzov, ktoré nájdeš aj tu. Napísal som kopu článkov pre zajtra.sk, brm.sk, medium a inde. Všade ma nájdeš ako yablko. Napríklad na yablko.sk alebo youtube.com/yablko.

4,9 Hodnotenie

Hodnotenia študentov

Hodnotenia od študentov zapísaných v kurze na Skillmea.

4,9 z 5 · 105 hodnotení

Michal Š.

pred viac ako rokom

Perketny kurz s uzasnym MASTER. May, The Force Be With You.

Zsolt G.

pred asi 3 rokmi

Pracovať bez srandy by nebolo ono!!! Len tak ďalej Yablko...

Tibor G.

pred asi 3 rokmi

nice

Luboslav S.

pred takmer 4 rokmi

Poviem Ti to úprimne - tvoje premazovanie mi ide na nervy. Je to také detinské a neprofesionálne. Ak sa chceš premazovať, môžeš to robiť na inom youtube kanály. Ale tu som si zaplatil za kurz, kde sa chcem naučiť po profesionálnej stránke. Ak budem chcieť počúvať tvoje premazovania sa, zapnem si iný kanál. Dúfam, že si ma pochopil.

Odporúčané online kurzy

Skillmea Premium Obľúbené

42 €

mesačne (ročná platba)

Skillmea Online Kurzy

21 €

mesačne (ročná platba)

Kúpiť samostatný kurz

149,00 €

doživotný prístup