Vue.js

Vue.js, to obecnie trzeci (po React.js i Angular) pod względem popularności framework JavaScript. Wiele jednak wskazuje na to, że jeszcze w tym roku się to zmieni. Jako ogromnego fana Vue.js zupełnie mnie to nie dziwi. Mam nadzieję, że po zapoznaniu się z kursem Vue, którego pierwszy odcinek właśnie czytasz, również podzielisz moją pasję do tego frameworka.

Mamy dostępne 2 darmowe kursy

Mirek / nrm
Michał Miszczyszyn / typeofweb

Mirek / nrm

Mirek / nrm

Krótki opis
Kurs Vue.js krok po kroku – wprowadzenie i hello world Dokładając swoją cegiełkę do popularności vue.js chciałbym przedstawić poniższy kurs jako wprowadzenie i pierwsze kroki z tym frameworkiem. Kurs przejdzie od totalnych podstaw, poprowadzi za rękę i doprowadzi cię do miejsca w którym wykonasz już proste komponenty i będziesz mógł dalej zgłębiać swoją wiedzę w tym temacie.
Kurs Vue.js krok po kroku – Chrome DevTools Zanim przejdziemy do praktycznej części kursu warto wykonać jeszcze jeden drobny krok i zainstalować vue-devtools. To rozszerzenie dla przeglądarki Chrome, która bardzo ułatwia pracę z vue.js. W prosty i czytelny sposób pokazuje nam „debug mode” naszej aplikacji i ułatwia pracę na poszczególnych elementach.
Kurs Vue.js krok po kroku – warunki i pętle Po dwóch odcinkach wprowadzających wreszcie możemy przystąpić do konkretów. Dzisiaj nauczymy się jak korzystać z warunków i pętli w Vue.js. V-IF, V-ELSE, V-SHOW, V-FOR.
Kurs Vue.js krok po kroku – Zdarzenia i metody W tym odcinku dowiemy się czym są i jak działają zdarzenia oraz jak definiujemy metody w Vue.js. Bohaterem dzisiejszego odcinka jest dyrektywa v-on, która..
Kurs Vue.js krok po kroku – Przypisywanie atrybutów Dzisiaj zajmiemy się przypisywaniem wartości do różnych atrybutów HTML. Coś co w zasadzie będziemy robili bardzo często i coś co jest absurdalnie proste (jak w zasadzie wszystko inne w Vue.js).
Kurs Vue.js krok po kroku – Obliczone właściwości Kurs Vue.js krok po kroku. Dzisiaj zajmiemy się „obliczonymi właściwościami” czyli „computed properties”. Co to jest i jak to stosujemy we Vue.js?
Kurs Vue.js krok po kroku – Komponenty Czym są komponenty w Vue.js? Jak je tworzyć? Prosty przykład jak zdefiniować swój pierwszy komponent w Vue.js i jak go wykorzystać w swojej aplikacji.
Kurs Vue.js krok po kroku – vue-loader Jak zapanować nad rozrastającą się aplikacją w Vue.js? Jak rozbić nasze komponenty na pliki? Czym jest vue-loader i jak z niego korzystać?
Michał Miszczyszyn / typeofweb

Michał Miszczyszyn / typeofweb

Krótki opis
Wprowadzenie do kursu Vue.js od podstaw Oto kurs Vue.js! Moje gratulacje za podjęcie tego tematu! Vue.js to bardzo popularna biblioteka i warto ją poznać! Poznaj framework JavaScript Vue!
Pierwszy komponent Vue.js Type of Web - Dla front-end i back-end developerów. Trochę o urokach pracy zdalnej, ale przede wszystkim o: JavaScript, React, Vue, Angular, node.js, TypeScript, HapiJS… Vue.js jest reaktywnym frameworkiem JavaScript. Znaczy to, że dowolna zmiana danych używanych do wyświetlania strony sprawia, że widok automatycznie jest aktualizowany tak, aby odzwierciedlić tę zmianę. Dodanie Vue.js do strony Żeby zacząć korzystać z Vue, wystarczy, że dodasz odpowiedni tag do pliku html: W dalszych częściach kursu omówimy bardziej skomplikowane techniki dołączania Vue.js do Twojej strony, ale pamiętaj, …
Dynamiczne atrybuty w Vue.js – dyrektywa v-bind Type of Web - Dla front-end i back-end developerów. Trochę o urokach pracy zdalnej, ale przede wszystkim o: JavaScript, React, Vue, Angular, node.js, TypeScript, HapiJS… W poprzednim wpisie pokazałem Ci jak wyświetlić dynamiczne dane w Vue.js za pomocą wąsów, czyli podwójnych nawiasów klamrowych ({{ nazwaZmiennej }}). Dziś dowiesz się jak przekazać je do atrybutów elementu HTML za pomocą dyrektywy v-bind. Dyrektywa v-bind Dyrektywy w Vue.js to specjalne atrybuty z przedrostkiem v-. Wartością takiej dyrektywy jest wyrażenie JavaScript. Dyrektywy mają za zadanie reaktywne aktualizowanie drzewa …
Dyrektywy warunkowe w Vue.js Type of Web - Dla front-end i back-end developerów. Trochę o urokach pracy zdalnej, ale przede wszystkim o: JavaScript, React, Vue, Angular, node.js, TypeScript, HapiJS… Pisząc aplikacje w Vue.js często spotkasz się z sytuacją, w której wyświetlenie lub nie danego elementu będzie zależało od wartości zmiennej. Właśnie do tego służą dyrektywy warunkowe v-if, v-else, v-else-if, (oraz w pewnym sensie v-show), które odpowiadają instrukcjom warunkowym znanym z JavaScript. To właśnie te dyrektywy Ci dziś zademonstruję. Pokazywanie i ukrywanie elementów za pomocą dyrektywy v-if Najbardziej podstawową dyrektywą umożliwiającą pokazywanie elementów …
Pętle w Vue.js z użyciem dyrektywy v-for Type of Web - Dla front-end i back-end developerów. Trochę o urokach pracy zdalnej, ale przede wszystkim o: JavaScript, React, Vue, Angular, node.js, TypeScript, HapiJS… Pisząc aplikacje w Vue.js bardzo często bedziesz chciał(a) wyświetlić listę elementów w pętli na podstawie tablicy. Właśnie w tym celu „język szablonów” wbudowany w Vue.js udostępnia dyrektywę v-for. W najprostszej postaci odpowiada ona pętli for znanej z JavaScriptu. Wyświetlanie listy przy użyciu dyrektywy v-for Dyrektywa v-for używa specjalnej składni aktualnyElementy in tablicaZDanymi gdzie tablicaZDanymi jest… źródłową tablicą …
Atrybuty class i style w Vue.js Vue traktuje inaczej dwa atrybuty html - `class` i `style` - sprawiając, że korzystanie z tego frameworka jest przyjemniejsze i łatwiejsze.
Metody oraz pola typu computed w Vue.js Metody oraz pola typu computed pozwalają zgrabnie enkapsulować logikę wyliczania wartości na podstawie pól danych komponentu i prowadzą do lepszego kodu.