Ucz się Vue: koduj
Ucz się Vue: koduj — Nauka Vue.js przez tworzenie komponentów na telefonie
Ucz się Vue: koduj to bezpłatna na start aplikacja na iOS i Android, która uczy Vue.js początkujących znających podstawy HTML i JavaScript, a także deweloperów przechodzących z Options API na Composition API. Oferuje 42 kursy i 156 lekcji — od pierwszego szablonu po Pinia, Vue Router i Nuxt 3 — a komponenty jednoplikowe kompilują się na urządzeniu, dzięki czemu 20 projektów z instrukcjami, misje i Vue Lab działają bez serwera.
- Cena
- Bezpłatna, uaktualnienie do Pro
- Platformy
- iOS i Android
- Języki
- 22
- Klasyfikacja wiekowa
- 4+
- Wersja
- 82.6.0
- Wymaga
- iOS 15.1 lub nowszy
- App Store
- 3.0 ★ (2)
Komponent łatwiej zrozumieć, gdy najpierw udało Ci się go zepsuć.
Vue Lab codziennie daje Ci zepsuty komponent i prosi o znalezienie błędu, pozwala zmieniać props komponentu za pomocą interaktywnych elementów sterujących oraz pokazuje, jak zmienia się stan po kliknięciu. Komponenty jednoplikowe kompilują się na telefonie, więc podgląd psuje się i naprawia na Twoich oczach, a karta błędu wyjaśnia, co poszło nie tak.
Co to jest
Ucz się Vue: koduj to bezpłatna aplikacja na iOS i Android, która uczy Vue.js poprzez 42 kursy i 156 lekcji — od składni szablonów i wiązania danych, przez Composition API, Pinia, Vue Router i TypeScript, aż po Nuxt 3, testowanie z Vitest oraz aplikacje full-stack. Komponenty jednoplikowe kompilują się na urządzeniu, dzięki czemu projekty z instrukcjami, misje programistyczne i praktyczny Vue Lab działają na telefonie bez serwera, a mentor AI w wersji Pro wyjaśnia kod i błędy.
W aplikacji
Jak to wygląda
Kurs
Zakres kursu Vue
42 kursy i 156 lekcji z własnej listy kursów aplikacji — od pierwszego szablonu po renderowanie po stronie serwera i wzorce produkcyjne.
Rozpoczęcie pracy z Vue.js
Wprowadzenie do Vue.js, Vue CLI i struktury projektu, składni szablonów oraz wiązania danych.
Reaktywność i Composition API
Podstawy Vue 3 Composition API, składnia script setup, reaktywność i właściwości computed oraz dyrektywy Vue.
Komponenty i formularze
Podstawy komponentów i komunikacja między nimi, sloty, provide i inject, formularze i walidacja oraz cykl życia komponentu.
Ponowne wykorzystanie i dopracowanie
Composable Vue 3, przejścia i animacje, obsługa błędów oraz funkcje renderujące i JSX.
Stan i routing
Zarządzanie stanem za pomocą Pinia, Vuex, routing z Vue Router i zaawansowane wzorce routera oraz obsługa API i danych asynchronicznych.
TypeScript, i18n i narzędzia
TypeScript z Vue 3, umiędzynarodowienie, integracja ze Storybookiem oraz wdrażanie i utrzymywanie aplikacji Vue.
Nuxt 3, testowanie i czas rzeczywisty
Renderowanie po stronie serwera z Nuxt 3, testowanie komponentów za pomocą Vitest, GraphQL z Apollo oraz aplikacje czasu rzeczywistego z WebSockets.
Wzorce produkcyjne
Wydajność, dobre praktyki bezpieczeństwa, tworzenie pluginów, publikowanie biblioteki komponentów, progresywne aplikacje webowe i mikrofrontendy.
Jak to działa
Jak wygląda nauka Vue w aplikacji
Każdy kurs ma określony poziom, a każda lekcja po pierwszym bezpłatnym kursie zaczyna się od bezpłatnego podglądu, dzięki czemu możesz zobaczyć, jak wygląda dany temat, zanim zdecydujesz się uczyć dalej.
Zacznij od kursu Introduction to Vue.js
Pierwszy kurs jest bezpłatny i zaczyna się od wyjaśnienia, czym jest Vue, skonfigurowania środowiska oraz utworzenia aplikacji Hello Vue. Kursy mają oznaczenia od A1 do C1, więc łatwo sprawdzić, od czego zacząć i co czeka dalej.
Twórz i uruchamiaj komponenty na telefonie
Edytuj komponent jednoplikowy i od razu wyświetlaj jego podgląd. Projekty z instrukcjami rozwijają aplikację krok po kroku, a App Studio pozwala tworzyć wieloekranowe aplikacje z routerem i store’em na podstawie gotowych blueprintów.
Ćwicz w Vue Lab
Szukaj codziennego błędu, odtwórz docelowy projekt w Style Lab, ścigaj się z czasem w pojedynkach speed-build albo przepisz komponent Options API w stylu Composition.
Co zawiera
Co zawiera aplikacja
42
Kursy, 156 lekcji
Od składni szablonów i dyrektyw, przez cykl życia, sloty, provide i inject oraz composables, aż po Nuxt 3, GraphQL, PWA i mikrofrontendy.
20
Projekty z instrukcjami
Rozwijaj aplikację krok po kroku dzięki komponentom jednoplikowym, które kompilują się bezpośrednio na Twoim urządzeniu, oraz karcie błędu wyświetlanej, gdy podgląd przestaje działać.
28
Misje programistyczne
Ćwiczenia od łatwych do trudnych, a także blueprinty App Studio do tworzenia wieloekranowych aplikacji z routerem i store’em.
Laboratorium
Vue Lab
Inspektor reaktywności, codzienne poszukiwanie błędów, 12 poziomów Style Lab, pojedynki speed-build, dojo przejścia z Options API na Composition API oraz biblioteka My Components, którą możesz udostępnić jako kartę graficzną.
Rozmowa kwalifikacyjna
Pytania rekrutacyjne dotyczące Vue
Pytania na rozmowy kwalifikacyjne dla front-end developerów, quizy, sesje powtórek z fiszkami oraz ściągawka dostępna w każdej chwili.
AI
Mentor AI (Pro)
Zapytaj o dowolne pojęcie lub błąd, poproś o wyjaśnienie kodu albo wygeneruj własną lekcję na dowolny temat, którego chcesz się nauczyć.
Informacje
Czym jest Vue.js i czego początkujący powinien nauczyć się najpierw?
Vue to framework JavaScript do budowania interaktywnych interfejsów internetowych z komponentów — małych, wielokrotnego użytku elementów, z których każdy odpowiada za fragment szablonu, logiki i stylu. Dla początkujących jego zaletą jest łagodny próg wejścia: możesz zacząć od zwykłego HTML i odrobiny JavaScript, a następnie stopniowo dodawać strukturę. Rozsądna kolejność to szablony i wiązanie danych, potem reaktywność i komponenty, następnie Composition API, a dopiero później routing, zarządzanie stanem i renderowanie po stronie serwera.
Reaktywnośćidea w samym centrum
Zmieniasz fragment danych, a zależny od niego ekran aktualizuje się sam. Zrozumienie, które wartości są reaktywne oraz co dają właściwości computed i watchery, usuwa większość początkowych niejasności związanych z Vue.
Options API i Composition APIdwa sposoby pisania komponentu
Starsze Options API grupuje kod według rodzaju, na przykład data i methods. Composition API z script setup grupuje go według funkcji i ułatwia tworzenie wielokrotnego użytku composables. Wiele samouczków i baz kodu nadal korzysta z obu podejść, więc umiejętność czytania każdego z nich jest przydatna.
Pinia, Vuex i routerco dodaje prawdziwa aplikacja
Gdy aplikacja ma kilka ekranów, potrzebuje routingu do poruszania się między nimi oraz współdzielonego magazynu danych używanych przez więcej niż jeden komponent. Pinia to obecny store dla Vue, a Vuex jest wcześniejszym rozwiązaniem, które wciąż występuje w wielu istniejących projektach.
Nuxt i renderowanie po stronie serweragdy liczą się wyszukiwanie i szybkość
Nuxt rozszerza Vue o renderowanie stron na serwerze, co pomaga przy pierwszym ładowaniu i widoczności w wyszukiwarkach. Zwykle jest to temat na drugim etapie nauki — po opanowaniu komponentów, routingu i stanu.
Dopasowanie
Dla kogo jest — i dla kogo nie jest
To dobry wybór, jeśli
- Znasz trochę HTML i JavaScript i chcesz poznać swój pierwszy framework
- Przechodzisz z Options API na Composition API albo z Vuex na Pinia
- Przygotowujesz się do rozmowy rekrutacyjnej na stanowisko developera Vue.js albo do pierwszej pracy w obszarze front-endu
- Wolisz uczyć się przez naprawianie zepsutego komponentu niż przez czytanie o nim
- Chcesz korzystać z krótkich sesji, które zmieszczą się nawet podczas dojazdu
To nie jest odpowiednie narzędzie, jeśli
- Nie znasz jeszcze HTML ani JavaScript — najpierw zacznij od kursu JavaScript
- Chcesz wdrożyć produkcyjną aplikację z telefonu — laptop nadal jest do tego potrzebny
- Oczekujesz, że wszystko będzie bezpłatne: pierwszy kurs i podglądy są bezpłatne, a Pro odblokowuje pełny program
- Chcesz korzystać z oficjalnych materiałów Vue.js — to niezależna aplikacja edukacyjna
Pytania
Najczęściej zadawane pytania
Jaki jest najlepszy sposób na naukę Vue.js na telefonie?
Ucz się, uruchamiając komponenty, zamiast tylko o nich czytać. Ucz się Vue: koduj kompiluje komponenty jednoplikowe na urządzeniu, dzięki czemu 20 prowadzonych projektów, 28 misji i Vue Lab działają na telefonie. Krótkie lekcje w ramach 42 kursów prowadzą od składni szablonów do Nuxt 3, a pierwszy kurs jest bezpłatny, więc możesz od niego zacząć.
Czy aplikacja uczy Composition API i Pinia?
Tak. Ucz się Vue: koduj zawiera kursy dotyczące podstaw Vue 3 Composition API, składni script setup, composable oraz zarządzania stanem za pomocą Pinia, a także starszego Vuex, używanego w istniejących projektach. W Vue Lab znajduje się dojo Options to Composition API, w którym możesz przepisywać klasyczne komponenty w nowoczesnym stylu.
Jaka jest różnica między Options API a Composition API w Vue?
Options API grupuje kod komponentu według typu, takiego jak data, methods i computed, natomiast Composition API z script setup grupuje go według funkcji i ułatwia tworzenie wielokrotnego użytku composable. Ucz się Vue: koduj uczy Composition API z script setup i zawiera w Vue Lab dojo Options to Composition API do przepisywania klasycznych komponentów w nowoczesnym stylu.
Czy przed nauką Vue muszę znać JavaScript?
Podstawowa znajomość HTML i JavaScript bardzo pomaga. Ucz się Vue: koduj jest przeznaczona dla początkujących, którzy znają podstawy i chcą poznać swój pierwszy framework, dlatego wyjaśnia koncepcje Vue od początku, ale nie uczy samego JavaScript. Jeśli zmienne i funkcje są dla Ciebie nowością, najpierw zacznij od kursu JavaScript.
Czym jest Vue Lab?
Vue Lab to sekcja ćwiczeń w Ucz się Vue: koduj. Zawiera inspektor reaktywności, codzienne polowanie na błędy z zepsutym komponentem, poziomy Style Lab, w których dopasowujesz docelowy projekt za pomocą CSS, pojedynki speed-build, dojo Options to Composition API oraz bibliotekę My Components z tym, co udało Ci się zbudować.
Czy aplikacja obejmuje Nuxt 3 i renderowanie po stronie serwera?
Tak. Zaawansowane kursy w Ucz się Vue: koduj obejmują renderowanie po stronie serwera z Nuxt 3, strumieniowanie SSR z Suspense oraz full-stack Vue z Fastify i uwierzytelnianiem, a także testowanie komponentów za pomocą Vitest i aplikacje czasu rzeczywistego z WebSockets.
Czy aplikacja pomaga przygotować się do rozmów rekrutacyjnych dotyczących Vue.js?
Tak. Ucz się Vue: koduj zawiera pytania rekrutacyjne dotyczące Vue na stanowiska front-end developerów, a także quizy, sesje powtórek z fiszkami i ściągawkę. Kursy, na których się opierają, obejmują reaktywność, cykl życia, composable i zarządzanie stanem — częste tematy podczas rozmów rekrutacyjnych.
Czy Ucz się Vue: koduj jest bezpłatna?
Aplikację można pobrać bezpłatnie. Bezpłatne są pierwszy kurs, podgląd każdej lekcji, pierwszy prowadzony projekt, pierwsza misja, codzienne polowanie na błędy, trzy poziomy Style Lab, quizy, pytania rekrutacyjne i ściągawka, a wersja bezpłatna wyświetla reklamy. Pro odblokowuje pełny program i laboratorium, mentora AI oraz egzamin certyfikacyjny i usuwa reklamy.
Czy aplikacja została stworzona przez zespół Vue.js?
Nie. Ucz się Vue: koduj to niezależna aplikacja edukacyjna, która nie jest powiązana z projektem Vue.js ani przez niego rekomendowana. Uczy Vue.js jako frameworka open source za pomocą własnych kursów i ćwiczeń.
Czy dostępny jest certyfikat?
Tak. Zdanie egzaminu końcowego, który jest częścią Pro, zapewnia certyfikat ukończenia. Potwierdza on wykonaną przez Ciebie pracę, ale nie jest akredytowanym potwierdzeniem kwalifikacji, dlatego najlepiej sprawdza się w połączeniu z komponentami i projektami, które potrafisz wyjaśnić.
Jakie platformy i języki obsługuje?
Ucz się Vue: koduj działa na iPhone za pośrednictwem App Store (iOS 15.1 lub nowszy) oraz na Android za pośrednictwem Google Play. Interfejs jest dostępny w 22 językach, a aplikacja ma ocenę 4+ w App Store.
Zacznij
Zbuduj dziś swój pierwszy komponent Vue
Darmowy na początek na iOS i Android, w 22 językach.
Więcej od CoddyKit
Dostępna na iOS i Android.