Belajar Vue: Kod & Bina
Belajar Vue: Kod & Bina — Belajar Vue.js dengan membina components pada telefon anda
Belajar Vue: Kod & Bina ialah app iOS dan Android yang percuma untuk bermula, yang mengajar Vue.js kepada pemula yang mengetahui sedikit HTML dan JavaScript, serta developer yang beralih daripada Options API kepada Composition API. App ini mempunyai 42 kursus dan 156 pelajaran, daripada template pertama anda hingga Pinia, Vue Router dan Nuxt 3, manakala single-file components compile pada peranti anda — jadi 20 projek berpandu, misi dan Vue Lab boleh dijalankan tanpa server.
- Harga
- Percuma, naik taraf Pro
- Platform
- iOS dan Android
- Bahasa
- 22
- Penarafan umur
- 4+
- Versi
- 82.6.0
- Memerlukan
- iOS 15.1 atau lebih baharu
- App Store
- 3.0 ★ (2)
Sesuatu component lebih mudah difahami selepas anda memecahkannya.
Vue Lab memberikan anda satu component yang rosak setiap hari dan meminta anda mencari pepijatnya, membolehkan anda mengubah props component dengan kawalan langsung, serta menunjukkan perubahan state semasa anda mengklik. Single-file components di-compile pada telefon, jadi preview rosak dan pulih di depan mata anda, bersama kad ralat yang menerangkan perkara yang berlaku.
Apakah aplikasi ini
Belajar Vue: Kod & Bina ialah app iOS dan Android percuma yang mengajar Vue.js melalui 42 kursus dan 156 pelajaran, daripada sintaks template dan data binding hingga Composition API, Pinia, Vue Router dan TypeScript, seterusnya Nuxt 3, testing dengan Vitest dan app full-stack. Single-file components di-compile pada peranti, jadi projek berpandu, misi coding dan Vue Lab yang praktikal boleh dijalankan pada telefon tanpa server, manakala mentor AI dalam Pro menerangkan code dan ralat.
Dalam aplikasi
Rupa aplikasi ini
Kursus
Kandungan kursus Vue
42 kursus dan 156 pelajaran daripada senarai kursus aplikasi sendiri, daripada templat pertama hingga pemaparan pelayan dan corak produksi.
Bermula dengan Vue.js
Pengenalan kepada Vue.js, Vue CLI dan struktur projek, sintaks templat serta pengikatan data.
Reaktiviti dan Composition API
Asas Vue 3 Composition API, sintaks script setup, reaktiviti dan computed properties, serta arahan Vue.
Komponen dan Borang
Asas komponen dan komunikasi, slots, provide dan inject, borang dan pengesahan, serta kitar hayat komponen.
Guna Semula dan Kemaskan
Vue 3 composables, peralihan dan animasi, pengendalian ralat, serta fungsi render dan JSX.
State dan Routing
Pengurusan state dengan Pinia, Vuex, routing menggunakan Vue Router dan corak router lanjutan, serta pengendalian API dan data tak segerak.
TypeScript, i18n dan Alatan
TypeScript dengan Vue 3, pengantarabangsaan, integrasi Storybook, serta penggunaan dan penyelenggaraan aplikasi Vue.
Nuxt 3, Pengujian dan Masa Nyata
Pemaparan sisi pelayan dengan Nuxt 3, pengujian komponen dengan Vitest, GraphQL dengan Apollo, serta aplikasi masa nyata dengan WebSockets.
Corak Produksi
Prestasi, amalan terbaik keselamatan, pembangunan plugin, penerbitan pustaka komponen, aplikasi web progresif dan mikrofrontend.
Cara ia berfungsi
Cara pembelajaran Vue dalam app
Setiap kursus mempunyai tahap, dan setiap pelajaran selepas kursus pertama yang percuma bermula dengan preview percuma, supaya anda boleh melihat rupa sesuatu topik sebelum memutuskan untuk meneruskannya.
Mulakan dengan Introduction to Vue.js
Kursus pertama adalah percuma dan bermula dengan pengenalan kepada Vue, penyediaan environment serta app Hello Vue. Kursus dilabel dari A1 hingga C1, jadi jelas tempat untuk bermula dan perkara yang akan dipelajari seterusnya.
Bina dan jalankan components pada telefon
Edit single-file component dan preview hasilnya serta-merta. Projek berpandu mengembangkan app langkah demi langkah, manakala App Studio membolehkan anda membina app berbilang screen dengan router dan store daripada blueprint sedia ada.
Berlatih dalam Vue Lab
Cari pepijat harian, padankan design sasaran dalam Style Lab, berlumba dengan masa dalam speed-build duels atau tulis semula component Options API mengikut gaya Composition.
Kandungan
Kandungan app
42
Kursus, 156 pelajaran
Daripada sintaks template dan directives hingga lifecycle, slots, provide dan inject serta composables, seterusnya Nuxt 3, GraphQL, PWAs dan micro-frontends.
20
Projek berpandu
Kembangkan app langkah demi langkah, dengan single-file components yang di-compile terus pada peranti anda serta kad ralat apabila preview rosak.
28
Misi coding
Latihan daripada mudah hingga sukar, bersama blueprint App Studio untuk app berbilang screen dengan router dan store.
Lab
Vue Lab
Inspector reactivity, pencarian pepijat harian, 12 tahap Style Lab, speed-build duels, dojo Options kepada Composition API serta pustaka My Components yang boleh anda kongsikan sebagai kad imej.
Temu duga
Soalan temu duga Vue
Soalan untuk temu duga developer front-end, bersama kuiz, sesi ulang kaji flashcard dan cheat sheet yang boleh dibuka pada bila-bila masa.
AI
Mentor AI (Pro)
Tanya tentang sesuatu konsep atau ralat, minta code anda diterangkan atau jana pelajaran tersuai tentang apa-apa topik yang ingin anda pelajari.
Latar belakang
Apakah Vue.js, dan apakah yang patut dipelajari oleh pemula terlebih dahulu?
Vue ialah framework JavaScript untuk membina interface web interaktif daripada components: bahagian kecil yang boleh digunakan semula, dan setiap satunya mengandungi sedikit template, logic dan style. Tarikannya kepada pemula ialah permulaan yang mudah, kerana anda boleh bermula dengan HTML biasa dan sedikit JavaScript, kemudian menambah struktur secara berperingkat. Urutan yang sesuai ialah templates dan data binding, kemudian reactivity dan components, diikuti Composition API, dan hanya selepas itu routing, state management dan server rendering.
Reactivityidea terasnya
Anda mengubah sebahagian data, lalu screen yang bergantung padanya dikemas kini secara automatik. Memahami value yang reactive serta perkara yang ditambahkan oleh computed properties dan watchers menghilangkan kebanyakan kekeliruan awal dalam Vue.
Options API dan Composition APIdua cara menulis component
Options API yang lebih lama mengumpulkan code mengikut jenis, seperti data dan methods. Composition API dengan script setup mengumpulkannya mengikut feature dan memudahkan penciptaan composables yang boleh digunakan semula. Banyak tutorial dan codebase masih menggunakan kedua-duanya, jadi kebolehan membaca mana-mana satu ialah kemahiran yang berguna.
Pinia, Vuex dan routerperkara yang ditambahkan oleh app sebenar
Apabila app mempunyai beberapa screen, ia memerlukan routing untuk bergerak antara screen tersebut serta shared store untuk data yang digunakan oleh lebih daripada satu component. Pinia ialah store semasa untuk Vue, manakala Vuex ialah store terdahulu yang masih digunakan oleh banyak projek sedia ada.
Nuxt dan server renderingapabila carian dan kelajuan penting
Nuxt dibina berasaskan Vue untuk merender halaman pada server, yang membantu pemuatan pertama dan keterlihatan dalam carian. Biasanya, ini ialah topik peringkat kedua, selepas components, routing dan state sudah anda kuasai dengan selesa.
Sesuai
Untuk siapa — dan bukan untuk siapa
Sesuai untuk anda jika anda
- Tahu sedikit HTML dan JavaScript serta mahukan framework pertama
- Sedang beralih daripada Options API kepada Composition API, atau daripada Vuex kepada Pinia
- Sedang membuat persediaan untuk temu duga pembangun Vue.js atau pekerjaan front-end pertama
- Belajar dengan lebih baik melalui pembaikan komponen yang rosak berbanding membaca tentangnya
- Mahukan sesi ringkas yang boleh disesuaikan dengan perjalanan ulang-alik
Bukan alat yang sesuai jika anda
- Belum pernah melihat HTML atau JavaScript — mulakan dengan kursus JavaScript terlebih dahulu
- Mahukan aplikasi produksi yang boleh dihantar terus dari telefon — komputer riba masih diperlukan untuk melakukannya
- Mengharapkan semuanya percuma: kursus pertama dan pratonton adalah percuma, manakala Pro membuka keseluruhan kurikulum
- Mahukan bahan rasmi Vue.js — ini ialah aplikasi pembelajaran bebas
Soalan
Soalan lazim
Apakah cara terbaik untuk mempelajari Vue.js pada telefon?
Belajar dengan menjalankan komponen, bukan sekadar membaca tentangnya. Belajar Vue: Kod & Bina menyusun single-file components pada peranti, jadi 20 projek berpandu, 28 misi dan Vue Lab semuanya boleh dijalankan pada telefon. Pelajaran ringkas merentasi 42 kursus membawa anda daripada sintaks templat hingga Nuxt 3, dengan kursus pertama percuma untuk memulakan pembelajaran.
Adakah aplikasi ini mengajar Composition API dan Pinia?
Ya. Belajar Vue: Kod & Bina mempunyai kursus tentang asas Vue 3 Composition API, sintaks script setup, composables dan pengurusan state Pinia, serta Vuex yang lebih lama untuk projek sedia ada. Dojo Options to Composition API dalam Vue Lab membolehkan anda menulis semula komponen klasik dalam gaya moden.
Apakah perbezaan antara Options API dan Composition API dalam Vue?
Options API mengumpulkan kod komponen mengikut jenis, seperti data, methods dan computed, manakala Composition API dengan script setup mengumpulkannya mengikut ciri dan memudahkan penggunaan composables yang boleh diguna semula. Belajar Vue: Kod & Bina mengajar Composition API dengan script setup dan menyertakan dojo Options to Composition API dalam Vue Lab untuk menulis semula komponen klasik dalam gaya moden.
Perlukah saya mengetahui JavaScript sebelum mempelajari Vue?
Sedikit pengetahuan HTML dan JavaScript sangat membantu. Belajar Vue: Kod & Bina ditujukan kepada pemula yang mengetahui asas dan mahukan framework pertama mereka, jadi aplikasi ini menerangkan konsep Vue dari awal tetapi tidak mengajar JavaScript itu sendiri. Jika pemboleh ubah dan fungsi masih baharu bagi anda, kursus JavaScript patut diambil terlebih dahulu.
Apakah Vue Lab?
Vue Lab ialah ruang latihan dalam Belajar Vue: Kod & Bina. Ia mempunyai pemeriksa reaktiviti, pemburuan pepijat harian dengan komponen yang rosak, tahap Style Lab untuk memadankan reka bentuk sasaran menggunakan CSS, pertarungan binaan pantas, dojo Options to Composition API dan pustaka My Components yang mengandungi hasil binaan anda.
Adakah ia merangkumi Nuxt 3 dan pemaparan sisi pelayan?
Ya. Kursus lanjutan dalam Belajar Vue: Kod & Bina merangkumi pemaparan sisi pelayan dengan Nuxt 3, penstriman SSR dengan Suspense dan Vue full-stack dengan Fastify serta pengesahan, di samping pengujian komponen dengan Vitest dan aplikasi masa nyata dengan WebSockets.
Adakah ia membantu untuk temu duga Vue.js?
Ya. Belajar Vue: Kod & Bina menyertakan soalan temu duga Vue untuk jawatan pembangun front-end, bersama kuiz, sesi ulang kaji kad imbas dan cheat sheet. Kursus yang berkaitan merangkumi reaktiviti, kitar hayat, composables dan pengurusan state, yang merupakan topik temu duga biasa.
Adakah Belajar Vue: Kod & Bina percuma?
Aplikasi ini percuma untuk dimuat turun. Kursus pertama, pratonton setiap pelajaran, projek berpandu pertama, misi pertama, pemburuan pepijat harian, tiga tahap Style Lab, kuiz, soalan temu duga dan cheat sheet adalah percuma, manakala versi percuma memaparkan iklan. Pro membuka keseluruhan kurikulum dan lab, mentor AI serta peperiksaan sijil, dan membuang iklan.
Adakah aplikasi ini dibuat oleh pasukan Vue.js?
Tidak. Belajar Vue: Kod & Bina ialah aplikasi pembelajaran bebas dan tidak bergabung dengan atau disokong oleh projek Vue.js. Aplikasi ini mengajar Vue.js sebagai framework sumber terbuka melalui kursus dan latihan tersendiri.
Adakah terdapat sijil?
Ya. Lulus peperiksaan akhir, yang merupakan sebahagian daripada Pro, memberi anda sijil tamat. Sijil ini menunjukkan hasil kerja yang telah anda siapkan dan bukan kelayakan bertauliah, jadi ia paling sesuai disertakan bersama komponen dan projek yang boleh anda terangkan.
Apakah platform dan bahasa yang disokong?
Belajar Vue: Kod & Bina tersedia pada iPhone melalui App Store (iOS 15.1 atau lebih baharu) dan pada Android melalui Google Play. Antara muka tersedia dalam 22 bahasa, dan aplikasi ini mendapat penarafan 4+ di App Store.
Mulakan
Bina komponen Vue pertama anda hari ini
Percuma untuk bermula pada iOS dan Android, dalam 22 bahasa.
Lagi daripada CoddyKit
Tersedia di iOS dan Android.