vesmir-helcl

zapisky od Nely

WEB KOMPONENT

1. npm install @vue/cli-service
2. npm install @vue/cli-plugin-babel
3. npm install @vue/cli-plugin-eslint
4. npm install vue-template-compiler

LOCALHOST

py -m http.server

API JSON TOKEN

1. curl adresa (pak.asgard.odbornaskola.cz)
2. curl -H "Autorization: Token token" adresa (http://pak.asgard.odbornaskola.cz/pack/ !POZOR NA MEZERY A PŘEKLEPY!

ctrl + shift + P + format selection = mezery

POMIO KONZULTACCE

❤️ Wagtail py manage.py app startapp galerie

• výhoda bootstrap

❤️ Javascript + css

• scroll event + (zjednodušení pomocí bootstrapu)
• hlavně o stylovaní = pozadí/obrázky na pozadí + responsivita
• pozicování (absolute/relative)
• grid
• transition!!!!!

❤️ Javascript + json

• token chybí = api bude

• událost Click/change

• pomocí JS vytvořit HTMLelement (nebo přes jquery $("...") .html("...")

  let e = document.querySelector("..."); let p = document.createElement("p"); e.appendChild(p)

❤️ Web komponent

• Vue

• npm run build -> dist

  data = [ {jmeno: "neco", obrazek: "url", ..}, {jmeno: "neco", obrazek: "url", ..}, {jmeno: "neco", obrazek: "url", ..}, ]

• • metoda

• v-for

• v-if

❤️ Nasazení na server pro úkoly 2, 3 nebo 4

• klasika webmaster@ipadresa
• vpn.asgard.odbornaskola.cz *už přihlášen na serveru
• git clone adresa
• nano /etc/nginx/sites-enabled/webproject ---> za lomitko root /home/webmaster/vesmir