Balíčkovací systém npm

35. hodina MVOP WBF

Matěj Cajthaml — SSPŠ

©

Propojování souborů

Proč bychom potřebovali propojovat soubory?

Propojování souborů

  • často potřebujeme propojit více souborů dohromady
  • přehledný kód
  • modularita, skvělé pro OOP

require(path)

  • vloží do proměnné exportovaný obsah z jiného souboru
  • provede veškeré příkazy v souboru

data.js

require.js

Propojení

Společná práce práce

Zjistěte, jestli můžeme exportovat funkce, třídy či další objekty. Případně na ukázce předveďte jak.

Co je to Node.js?

npm

npm

  • balíčkovací systém
  • pro Node.js
  • baliček = knihovna = library, ...

balíčky

  • instalujeme jako projekt
  • instalujeme globálně
  • 1.3 milionu balíčků zaregistrováno

package.json

  • ukládání informací o projektu
  • seznam knihoven, jejich verze
  • příkazy a další nastavení

npm

  • npm se instaluje společně s Node.js

Založíme projekt!

npm init

npm init

  • interaktivní příkaz
  • založení projektu
  • dle zadaných informací vygeneruje package.json

npm run compile

npm run run

Balíčky

Instalace

  • nyní budeme instalovat pro projekt
  • npm install <jmeno balíčku>

Po instalaci

  • upraví/vytvoří se složka node_modules, obsahující dané knihovny
  • upraví se soubor package.json - bude obsahot knihovnu a její verzi
  • upraví/vytvoří se soubor package-lock.json, který obsahuje přesnější informace o nainstalovaných knihovnách

Soubor package-lock.json a node_modules nikdy nedáváme na verzovací systém (git).

Každý balíček / knihovna se chová různě. Vždy je potřeba číst dokumentaci.

Vstup uživatele v JS

Společná práce

  • založte nový projekt
  • nainstalujte balíček entoli
  • přečtěte si dokumentaci
  • vytvořte program dle videa
  • program spouštějte pomocí npm

Balíčky

Společná práce

Prohledejte internet a nalezněte zajimavé (možná i zvláštní) npm balíčky.

Programování v JS

Domácí práce

https://ssps.cajthaml.eu/3-mvop-wbf/work/34-programovani-v-js

Test příští hodinu

Opakování

https://ssps.cajthaml.eu/3-mvop-wbf/selfstudy/test-2

Shrnutí

Lze porovnávat asynchronní funkce a promises?
K čemu se nám hodí dědičnost?
Co je to undefined v JavaScriptu?
Můžeme kombinovat statické a neveřejné modifikátory?
Jak se liší UI a UX?
Jakým tagem se definuje řádek tabulky?

Děkuji za pozornost!

  • matej.cajthaml@ssps.cz
  • https://ssps.cajthaml.eu/