Co je Vue

Vítejte ve Vue! Vue (čte se jako anglické view, tedy „vjú“) je javascriptový framework pro tvorbu webových aplikací, tedy stránek, které reagují na to, co děláte. Framework je hotový kód, na kterém vaše aplikace stojí: udělá za vás práci, kterou potřebuje každá aplikace, a vy napíšete to, čím je ta vaše jiná. Používá ho spousta firem a je známý tím, jak snadno se s ním začíná. V tomto kurzu si krok za krokem postavíte aplikaci na objednávky pro Kavárnu Na Rohu: její nabídku, objednávku zákazníka a celkovou cenu.

V editoru už je malá aplikace ve Vue. Klikněte na Spustit: náhled ukáže nabídku kavárny. Klikněte u několika nápojů na Přidat a sledujte čísla pod nabídkou.

Vzpomeňte si, jak jste stránku měnili v kurzu JavaScriptu: našli jste prvek pomocí querySelector(), změnili jeho textContent a nové prvky vytvořili pomocí createElement(). Stránce jste krok za krokem říkali, co má změnit.

Vue na to jde obráceně. Napíšete šablonu: HTML, které říká, co stránka ukazuje, s místy pro vaše data. Vue ze šablony a dat vytvoří stránku, a když se data změní, automaticky ji aktualizuje. Podívejte se do App.vue: nápoje jsou v poli nabidka a seznam na stránce vzniká z něj. Nikde tam není querySelector() ani textContent. Funkce pridejDoObjednavky jen změní dvě čísla, pocet a celkem, a jejich nové hodnoty ukáže Vue.

Nevadí, když zatím nerozumíte každému řádku v App.vue. Seznamy pomocí v-for se naučíte psát v lekci Podmínky a seznamy a tlačítka s @click v lekci Stav a události. Do konce kurzu celou aplikaci napíšete sami, a ještě mnohem víc.