PricingLoginStart free
Frontend Academy logo
HTMLPemulaWebTahap A1 → C222 bahasa

Frontend Academy

Bangunkan laman web yang menarik secara visual dan responsif dengan Akademi Pembangunan Bahagian Hadapan. Laluan pembelajaran CoddyKit yang merangkumi 41 kursus pendek dan 163 pelajaran interaktif, dengan tutor kecerdasan buatan 24/7 di sisi anda.

Kursus
41
Pelajaran
163
Langkah interaktif
2,186
Percuma untuk bermula
Kursus 1
GET IT ONGoogle PlayDownload on theApp Store
Kurikulum

41 kursus dalam laluan ini

Setiap kursus dalam laluan Frontend Academy, mengikut urutan pembelajaran. Kursus pertama adalah percuma.

1

A13 pelajaranPercuma

Fahami perkara yang dilakukan oleh pembangun frontend, sebab ini merupakan salah satu kerjaya teknologi yang paling banyak diperlukan dan kreatif serta cara HTML, CSS dan JavaScript berfungsi bersama.

  1. 1Apakah Pembangunan Frontend?
  2. 2Trio Teknologi Frontend
  3. 3Masa Depan Anda sebagai Pembangun Frontend
Mula belajar secara percuma
2

A14 pelajaranPRO

Fahami asas web: cara pelayar meminta halaman, fungsi DNS, cara HTTP berfungsi dan perkara yang berlaku apabila anda menaip URL. Anda akan selesai dengan pemahaman tepat tentang tindakan pelayar sebe…

  1. 1DNS dan HTTP Pelayar: Kitar Hayat Permintaan
  2. 2HTML, CSS dan JavaScript: Tugas Setiap Lapisan
  3. 3Cara Halaman Dipaparkan: Penghurai DOM CSSOM, Susun Atur dan Cat
  4. +1 lagi
Mula belajar secara percumaDapatkan akses dengan PRO
3

A14 pelajaranPRO

Pelajari blok binaan setiap halaman web. Tulis dokumen HTML5 yang sah menggunakan unsur semantik, susun kandungan dengan tajuk dan senarai, benamkan imej serta pautan dan bina borang yang boleh diaks…

  1. 1Struktur Dokumen: DOCTYPE html head body
  2. 2Tag Semantik: header nav main article footer
  3. 3Teks, Imej, Pautan dan Senarai
  4. +1 lagi
Mula belajar secara percumaDapatkan akses dengan PRO
4

A14 pelajaranPRO

Gayakan HTML anda dengan yakin. Pelajari cara lata dan kekhususan berfungsi, gunakan warna dan tipografi, kuasai model kotak serta kawal susun atur dengan sifat paparan dan peletakan.

  1. 1Pemilih dan Lata
  2. 2Warna, Tipografi dan Model Kotak
  3. 3Asas Display: block inline flex grid
  4. +1 lagi
Mula belajar secara percumaDapatkan akses dengan PRO
5

A14 pelajaranPRO

Tulis atur cara JavaScript pertama anda. Pelajari cara mengisytiharkan pemboleh ubah, bekerja dengan jenis data primitif, mentakrifkan fungsi dan mengawal aliran atur cara dengan syarat serta gelung.

  1. 1Pemboleh Ubah: let const var dan Skop
  2. 2Jenis Data: string number boolean null undefined
  3. 3Fungsi: Pengisytiharan, Ungkapan dan Fungsi Anak Panah
  4. +1 lagi
Mula belajar secara percumaDapatkan akses dengan PRO
6

A14 pelajaranPRO

Bekerjalah seperti pembangun frontend profesional. Kuasai Chrome DevTools untuk memeriksa dan menyahpepijat, konfigurasikan VSCode dengan sambungan yang berguna, serta sediakan alat kualiti kod seper…

  1. 1Chrome DevTools: Elements Console Network
  2. 2VSCode: Sambungan, Emmet dan Pintasan
  3. 3Persediaan Prettier dan ESLint
  4. +1 lagi
Mula belajar secara percumaDapatkan akses dengan PRO
7

A24 pelajaranPRO

Tambahkan jenis pada JavaScript dan kesan pepijat sebelum sampai ke pelayar. Pelajari sistem jenis TypeScript, anotasi pemboleh ubah dan fungsi, takrifkan antara muka, serta susun TypeScript kepada J…

  1. 1Mengapa TypeScript: Jenis Mengesan Pepijat Semasa Kompilasi
  2. 2Jenis Primitif, Union dan Alias Jenis
  3. 3Interface dan Jenis Objek
  4. +1 lagi
Mula belajar secara percumaDapatkan akses dengan PRO
8

A24 pelajaranPRO

Jadikan HTML anda interaktif dengan JavaScript. Pilih unsur, dengar peristiwa, baca dan ubah kandungan serta cipta atau buang unsur secara dinamik menggunakan Document Object Model.

  1. 1querySelector dan querySelectorAll
  2. 2addEventListener dan Objek Peristiwa
  3. 3Menukar Kandungan: textContent innerHTML classList
  4. +1 lagi
Mula belajar secara percumaDapatkan akses dengan PRO
9

A24 pelajaranPRO

Bina susun atur yang berfungsi pada sebarang saiz skrin. Pelajari teg meta viewport, gunakan Flexbox dan Grid untuk susun atur anjal, serta tulis pertanyaan media dengan pendekatan mengutamakan mudah…

  1. 1Tag Meta Ruang Pandang
  2. 2Flexbox untuk Susun Atur
  3. 3CSS Grid untuk Susun Atur
  4. +1 lagi
Mula belajar secara percumaDapatkan akses dengan PRO
10

A24 pelajaranPRO

Dalami pengetahuan HTML anda. Bina borang yang boleh diakses sepenuhnya dengan atribut ARIA, gunakan semua jenis input HTML5, manfaatkan pengesahan terbina dalam, serta tulis penanda yang menyampaika…

  1. 1Kawalan Borang: jenis input, select dan textarea
  2. 2ARIA dan Kebolehcapaian: label role aria-*
  3. 3HTML5 Semantik: semantik berbanding sup div
  4. +1 lagi
Mula belajar secara percumaDapatkan akses dengan PRO
11

A24 pelajaranPRO

Tingkatkan kemahiran JavaScript anda dengan sintaks moden dan kaedah terbina dalam yang berkuasa. Manipulasikan tatasusunan dengan map, filter dan reduce, lakukan pemusnahan objek, kembangkan data, g…

  1. 1Kaedah Array: map filter reduce find
  2. 2Pemusnahan Struktur dan Spread Objek
  3. 3Literal Templat dan Chaining Pilihan
  4. +1 lagi
Mula belajar secara percumaDapatkan akses dengan PRO
12

A24 pelajaranPRO

Gunakan Git dengan berkesan sebagai pembangun frontend. Pelajari arahan teras untuk menyimpan kerja, fahami percabangan bagi pembangunan ciri, hantar ke GitHub, serta bekerjasama melalui permintaan t…

  1. 1git init add commit dan status
  2. 2Percabangan: branch checkout merge
  3. 3Repositori Jauh: push pull clone
  4. +1 lagi
Mula belajar secara percumaDapatkan akses dengan PRO
13

A24 pelajaranPRO

Hidupkan antara muka dengan gerakan CSS. Gunakan sifat tersuai untuk token reka bentuk yang mudah diselenggara, tambahkan peralihan lancar pada perubahan keadaan, bina animasi bingkai utama, serta ho…

  1. 1Sifat Tersuai CSS: mengisytiharkan dan mengemas kini
  2. 2Peralihan: sifat tempoh pemasaan
  3. 3Animasi @keyframes
  4. +1 lagi
Mula belajar secara percumaDapatkan akses dengan PRO
14

B14 pelajaranPRO

Langkaui asas untuk benar-benar menguasai susun atur CSS. Terokai penjajaran dan pembalutan Flexbox secara mendalam, manfaatkan kawasan templat CSS Grid dan auto-fit, gabungkan kedua-dua teknik, sert…

  1. 1Selam Mendalam Flexbox: Penjajaran, Pembalutan dan Susunan
  2. 2CSS Grid: template-areas auto-fit minmax
  3. 3Menggabungkan Flexbox dan Grid
  4. +1 lagi
Mula belajar secara percumaDapatkan akses dengan PRO
15

B14 pelajaranPRO

Fahami rangkaian alat JavaScript moden. Gunakan sintaks modul ES, urus pakej dengan npm, mulakan pelayan pembangunan segera dengan Vite, serta pelajari konsep penggabungan yang memastikan himpunan pe…

  1. 1Modul ES: import export dan dynamic import
  2. 2npm dan package.json: kebergantungan skrip
  3. 3Vite: pelayan pembangunan dan binaan
  4. +1 lagi
Mula belajar secara percumaDapatkan akses dengan PRO
16

B14 pelajaranPRO

Dalami sistem jenis TypeScript. Tulis fungsi generik yang boleh diguna semula, gunakan jenis utiliti untuk mengubah antara muka, bina jenis terpetakan dan bersyarat, serta kecilkan jenis dengan selam…

  1. 1Generik: T extends dan kekangan
  2. 2Jenis Utiliti: Partial Required Pick Omit
  3. 3Jenis Dipetakan dan Jenis Bersyarat
  4. +1 lagi
Mula belajar secara percumaDapatkan akses dengan PRO
17

B14 pelajaranPRO

Bina aplikasi React pertama anda. Fahami sintaks JSX, susun UI daripada komponen berfungsi, hantarkan data dengan props, serta urus keadaan setempat dengan cangkuk useState untuk menghasilkan antara…

  1. 1JSX: Sintaks dan Transpilasi
  2. 2Komponen Fungsian dan Props
  3. 3Hook useState: State dan Pemaparan Semula
  4. +1 lagi
Mula belajar secara percumaDapatkan akses dengan PRO
18

B14 pelajaranPRO

Selaraskan komponen React dengan sistem luaran. Pelajari cara useEffect berfungsi, ambil data daripada API semasa pemasangan, paparkan keadaan pemuatan dan ralat, serta bersihkan kesan sampingan deng…

  1. 1Asas useEffect: Kebergantungan dan Pembersihan
  2. 2Mengambil Data Semasa Mount
  3. 3Mengendalikan State Pemuatan dan Error
  4. +1 lagi
Mula belajar secara percumaDapatkan akses dengan PRO
19

B14 pelajaranPRO

Bina aplikasi Vue 3 pertama anda menggunakan Komponen Satu Fail. Pelajari API Options, arahan teras, serta cara berkomunikasi antara komponen induk dan anak dengan props dan emits.

  1. 1Vue SFC: script template style
  2. 2API Options: data methods computed
  3. 3Arahan: v-if v-for v-bind v-on
  4. +1 lagi
Mula belajar secara percumaDapatkan akses dengan PRO
20

B14 pelajaranPRO

Bina antara muka yang boleh digunakan oleh semua orang. Fahami tahap pematuhan WCAG, gunakan HTML semantik sebagai asas kebolehcapaian, gunakan peranan dan atribut ARIA dengan betul, serta pastikan n…

  1. 1Tahap WCAG A AA AAA
  2. 2HTML Semantik sebagai Asas
  3. 3Peranan dan Atribut ARIA
  4. +1 lagi
Mula belajar secara percumaDapatkan akses dengan PRO
21

B24 pelajaranPRO

Kuasai JavaScript tak segerak dari asas. Fahami gelung peristiwa, beralih daripada corak panggil balik kepada Promise, serta tulis kod async/await yang kemas dengan pengendalian ralat yang betul.

  1. 1Gelung Peristiwa: Call Stack Queue Microtasks
  2. 2Callback dan Callback Hell
  3. 3Promise: then catch finally Promise.all
  4. +1 lagi
Mula belajar secara percumaDapatkan akses dengan PRO
22

B24 pelajaranPRO

Kuasai keseluruhan API cangkuk React. Kongsi data tanpa meneruskan props secara berlapis menggunakan useContext, urus keadaan kompleks dengan useReducer, optimumkan prestasi dengan useMemo dan useCal…

  1. 1useContext untuk State Global
  2. 2useReducer untuk State Kompleks
  3. 3useMemo dan useCallback untuk Prestasi
  4. +1 lagi
Mula belajar secara percumaDapatkan akses dengan PRO
23

B24 pelajaranPRO

Manfaatkan sepenuhnya kuasa Vue 3 dengan API Composition. Gunakan ref dan reactive untuk keadaan reaktif, computed dan watch untuk nilai terbitan serta kesan sampingan, dan bina composable yang boleh…

  1. 1ref() dan reactive()
  2. 2computed() dan watch()
  3. 3Fungsi setup() dan script setup
  4. +1 lagi
Mula belajar secara percumaDapatkan akses dengan PRO
24

B24 pelajaranPRO

Urus keadaan seluruh aplikasi dengan berkesan. Pelajari Redux Toolkit untuk React, Zustand yang ringan sebagai alternatif lebih ringkas, Pinia untuk Vue, serta prinsip yang membantu anda menentukan b…

  1. 1Redux Toolkit: createSlice dan configureStore
  2. 2Zustand untuk State React Ringan
  3. 3Pinia untuk Vue: defineStore dan storeToRefs
  4. +1 lagi
Mula belajar secara percumaDapatkan akses dengan PRO
25

B24 pelajaranPRO

Tulis ujian automatik untuk kod frontend anda. Sediakan Jest, uji komponen React dengan Testing Library, uji komponen Vue, serta palsukan modul dan panggilan API supaya ujian kekal pantas dan berasin…

  1. 1Persediaan Jest dan Ujian Asas
  2. 2@testing-library/react: render userEvent
  3. 3@testing-library/vue: memasang komponen
  4. +1 lagi
Mula belajar secara percumaDapatkan akses dengan PRO
26

B24 pelajaranPRO

Tulis CSS yang boleh berkembang. Pelajari konvensyen penamaan BEM untuk pemilih yang boleh dijangka, hadkan skop gaya dengan Modul CSS, tambah CSS terus dalam JavaScript dengan styled-components dan…

  1. 1Metodologi BEM: Blok Elemen Pengubah
  2. 2Modul CSS: Nama Kelas Berskop
  3. 3CSS-in-JS: Styled-components dan Emotion
  4. +1 lagi
Mula belajar secara percumaDapatkan akses dengan PRO
27

B24 pelajaranPRO

Sambungkan frontend anda kepada API backend. Gunakan Fetch API asli untuk semua kaedah HTTP, tambahkan Axios untuk pencegat dan URL asas, kendalikan ralat HTTP dengan baik, serta cache data pelayan d…

  1. 1Fetch API: GET POST PUT DELETE
  2. 2Axios: Interceptor dan URL Asas
  3. 3Pengendalian Ralat: Kod Status HTTP
  4. +1 lagi
Mula belajar secara percumaDapatkan akses dengan PRO
28

B24 pelajaranPRO

Bina aplikasi React pengeluaran dengan Next.js. Fahami Pages Router dan App Router moden, bezakan Komponen Pelayan daripada Komponen Klien, pilih strategi pemaparan yang sesuai, serta tambahkan lalua…

  1. 1Penghala Pages berbanding Penghala App
  2. 2Komponen Pelayan dan Komponen Klien
  3. 3SSG, SSR dan ISR
  4. +1 lagi
Mula belajar secara percumaDapatkan akses dengan PRO
29

B24 pelajaranPRO

Bina aplikasi Vue tindanan penuh dengan Nuxt 3. Gunakan penghalaan berasaskan fail dan import automatik untuk menghapuskan kod berlebihan, ambil data pelayan dengan composable, lanjutkan fungsi denga…

  1. 1Penghalaan Berasaskan Fail dan Import Automatik
  2. 2useFetch dan useAsyncData
  3. 3Modul Nuxt: Imej, Pengesahan dan i18n
  4. +1 lagi
Mula belajar secara percumaDapatkan akses dengan PRO
30

B24 pelajaranPRO

Tukarkan laman web kepada pengalaman seperti aplikasi. Tulis Manifest Aplikasi Web untuk kebolehpemasangan, daftarkan Service Worker untuk sokongan luar talian, laksanakan strategi caching, serta tam…

  1. 1Manifest Aplikasi Web
  2. 2Pendaftaran dan Kitar Hayat Service Worker
  3. 3Strategi Cache Luar Talian: CacheFirst dan NetworkFirst
  4. +1 lagi
Mula belajar secara percumaDapatkan akses dengan PRO
31

B24 pelajaranPRO

Bina antara muka pengguna masa nyata. Gunakan API WebSocket asli, integrasikan pustaka klien Socket.io, terima peristiwa yang dihantar pelayan untuk aliran data sehala, serta gunakan corak UI untuk d…

  1. 1API WebSocket: buka, mesej, tutup dan ralat
  2. 2Penyepaduan Klien Socket.io
  3. 3Server-Sent Events untuk Penstriman Sehala
  4. +1 lagi
Mula belajar secara percumaDapatkan akses dengan PRO
32

B24 pelajaranPRO

Kuasai rangkaian alat JavaScript yang berkembang pesat. Lanjutkan Vite dengan pemalam dan gunakannya untuk SSR, fahami cara esbuild mencapai kelajuannya, urus ruang kerja dengan pnpm, serta percepat…

  1. 1Vite: Sistem Pemalam dan Mod SSR
  2. 2esbuild: Kelajuan dan Had
  3. 3Workspace pnpm untuk Monorepo
  4. +1 lagi
Mula belajar secara percumaDapatkan akses dengan PRO
33

C14 pelajaranPRO

Jadikan laman anda pantas dan ukur peningkatannya. Fahami Core Web Vitals, jalankan audit Lighthouse, optimumkan imej untuk web, serta kurangkan saiz muatan JavaScript dengan pembahagian kod dan pemu…

  1. 1Vital Web Teras: LCP FID CLS
  2. 2Audit dan Pemarkahan Lighthouse
  3. 3Pengoptimuman Imej: pemuatan malas format WebP
  4. +1 lagi
Mula belajar secara percumaDapatkan akses dengan PRO
34

C14 pelajaranPRO

Tolak TypeScript hingga ke hadnya. Bina jenis dengan jenis literal templat, anotasi komponen dan cangkuk React dengan generik yang tepat, aktifkan mod ketat untuk menghapuskan penggunaan any yang tid…

  1. 1Jenis Literal Templat
  2. 2Penghias dan Metadata
  3. 3TypeScript dengan React: Generik FC dan Hook
  4. +1 lagi
Mula belajar secara percumaDapatkan akses dengan PRO
35

C14 pelajaranPRO

Tulis kod React seperti pengarang pustaka. Bina komponen gabungan yang disokong Context, gunakan props pemaparan dan HOC untuk berkongsi keperluan merentas fungsi, paparkan kandungan di luar pepohon…

  1. 1Komponen Gubahan dengan Context
  2. 2Props Render dan Corak HOC
  3. 3Portal untuk Modal dan Petua Alat
  4. +1 lagi
Mula belajar secara percumaDapatkan akses dengan PRO
36

C14 pelajaranPRO

Kuasai corak Vue 3 lanjutan yang digunakan dalam aplikasi profesional. Kongsi logik merentasi pepohon komponen dengan provide/inject, muatkan komponen secara tak segerak dengan Suspense, tulis arahan…

  1. 1provide() dan inject() untuk Suntikan Kebergantungan
  2. 2Komponen Tak Segerak dan Suspense
  3. 3Arahan Tersuai
  4. +1 lagi
Mula belajar secara percumaDapatkan akses dengan PRO
37

C14 pelajaranPRO

Reka aplikasi frontend yang boleh berkembang untuk pasukan besar. Gunakan Atomic Design pada hierarki komponen, urus berbilang pakej dengan monorepo Turborepo, laksanakan Module Federation mikro-fron…

  1. 1Reka Bentuk Atomik: Atom, Molekul dan Organisma
  2. 2Persediaan Monorepo dengan Turborepo
  3. 3Micro-frontend: Module Federation
  4. +1 lagi
Mula belajar secara percumaDapatkan akses dengan PRO
38

C14 pelajaranPRO

Bina dan selenggara pustaka komponen dikongsi. Dokumentasikan komponen dalam Storybook, takrifkan token reka bentuk dengan Style Dictionary, beri versi dan terbitkan ke npm, serta integrasikan sistem…

  1. 1Storybook: Stories, Kawalan dan Dokumentasi
  2. 2Token Reka Bentuk dengan Style Dictionary
  3. 3Pemberian Versi dan Penerbitan ke npm
  4. +1 lagi
Mula belajar secara percumaDapatkan akses dengan PRO
39

C14 pelajaranPRO

Lindungi pengguna anda daripada ancaman keselamatan web. Cegah XSS dengan pengekodan output dan Content Security Policy, lindungi daripada CSRF dengan kuki dan token SameSite, konfigurasikan pengepal…

  1. 1Pencegahan XSS: Pengekodan Output dan CSP
  2. 2CSRF: Kuki dan Token SameSite
  3. 3Content Security Policy: nonce dan hash
  4. +1 lagi
Mula belajar secara percumaDapatkan akses dengan PRO
40

C14 pelajaranPRO

Automatikkan penghantaran frontend anda. Tulis aliran kerja GitHub Actions untuk menjalankan lint, ujian dan binaan pada setiap tolakan, lancarkan secara automatik ke Vercel, Netlify dan Cloudflare P…

  1. 1GitHub Actions untuk Frontend: lint, ujian dan binaan
  2. 2Pelancaran ke Vercel, Netlify dan Cloudflare Pages
  3. 3Pemboleh Ubah Persekitaran dalam CI
  4. +1 lagi
Mula belajar secara percumaDapatkan akses dengan PRO
41

C24 pelajaranPRO

Bekerjalah pada tahap kanan. Hadapi temu duga reka bentuk sistem dengan rangka kerja khusus frontend, pupuk budaya semakan kod yang sihat, kembangkan jurutera junior melalui bimbingan dan dokumentasi…

  1. 1Temu Duga Reka Bentuk Sistem Frontend
  2. 2Budaya Semakan Kod dan Amalan Terbaik PR
  3. 3Pementoran dan Dokumentasi Teknikal
  4. +1 lagi
Mula belajar secara percumaDapatkan akses dengan PRO
CoddyKit PRO

Dapatkan akses kepada kesemua 41 kursus dalam laluan ini dan semua laluan lain

Tutor AI, peperiksaan pensijilan dan sijil. Berfungsi di laman web, iOS dan Android.

Lihat semua pelan
Tahunan$29.90 / tahunKira-kira $2.49 sebulanBayar sekaliSeumur hidup$69.99 sekaliTiada pembaharuan. PRO selama-lamanya.
Gambaran Keseluruhan Kursus

Bina Spektrum Penuh Frontend Moden

Pembangunan frontend ialah bidang yang menukarkan kod kepada segala perkara yang dilihat dan digunakan oleh pengguna dalam pelayar — struktur HTML, persembahan CSS, tingkah laku JavaScript, serta rangka kerja dan alat yang menggabungkan semuanya pada skala produksi. Laluan ini merangkumi keseluruhan susunan teknologi: daripada cara web menghantar halaman hingga menulis aplikasi React dan Vue yang selamat dari segi jenis data, mengoptimumkan prestasi, serta melancarkannya melalui saluran CI/CD.

Perkara yang Akan Dipelajari

Anda akan bermula dengan asas HTML, CSS dan JavaScript, kemudian menguasai TypeScript, DOM dan API pelayar, reka bentuk responsif, serta corak ES6+ termasuk pengaturcaraan tak segerak dan modul. Selepas itu, anda akan mempelajari React (cangkuk, corak lanjutan, SSR Next.js) dan Vue 3 (Composition API, SSR Nuxt 3), pengurusan keadaan, pengujian frontend, seni bina CSS, serta antara muka masa nyata dengan WebSockets. Laluan ini diakhiri dengan pengoptimuman prestasi web, keselamatan frontend, sistem reka bentuk, serta CI/CD dan DevOps frontend.

Laluan Pembelajaran

Empat puluh satu kursus merangkumi tahap A1 hingga C2. Kursus A1 dan A2 membina asas — cara web berfungsi, penandaan semantik, animasi CSS, Git dan pengenalan kepada TypeScript. Kursus B1 dan B2 membina kecekapan profesional: Penguasaan Susun Atur CSS, Modul JavaScript dan Alat Binaan, asas React dan Vue 3, penyepaduan API, Aplikasi Web Progresif, serta Pemaparan Sebelah Pelayan dengan Next.js dan Nuxt 3. Kursus C1 menangani keperluan peringkat kanan: TypeScript Lanjutan untuk Frontend, Corak Lanjutan React, Corak Lanjutan Vue, Seni Bina Frontend, Sistem Reka Bentuk dan Pustaka Komponen, Keselamatan Frontend, serta CI/CD dan DevOps Frontend. Laluan ini berakhir pada tahap C2 dengan Kejuruteraan Frontend Peringkat Kanan, yang menggabungkan semuanya menjadi amalan bertaraf produksi.

Cara Ia Berfungsi

Setiap kursus dibahagikan kepada pelajaran ringkas dan praktikal yang anda siapkan dalam penyunting kod terbina dalam dengan maklum balas masa nyata. Tutor AI tersedia apabila anda menghadapi kesukaran, dan setiap konsep diperkukuh melalui latihan yang mencerminkan tingkah laku sebenar pelayar dan rangka kerja, bukannya contoh yang dibuat-buat.

Alat

Berlatih dengan AI, bukan sekadar membaca

Tingkatkan pembelajaran anda dengan alat dan ciri berkuasa AI

Penjana Kod AIJana kod menggunakan AIPembetulan Pepijat AICari dan baiki ralat kodPROWawasan AIAnalisis kod mendalamPROSembang AIBerbual dengan tutor AITanya Soalan SuperDapatkan jawapan bertaraf pakarPROCipta PelajaranPembina pelajaran berkuasa AIPROMulakan Peperiksaan PensijilanDapatkan sijil andaPROPenyunting KodTulis dan jalankan kodMulakan CabaranUji kemahiran anda

Cara Anda Belajar

  1. 01

    Pelajaran Interaktif

    Latihan pengekodan amali dengan maklum balas masa nyata

  2. 02

    Tutor AI

    Dapatkan bantuan segera daripada AI kami apabila anda buntu

  3. 03

    Penyunting Terbina Dalam

    Tulis dan jalankan kod terus dalam pelayar anda

  4. 04

    Sijil

    Dapatkan sijil selepas melengkapkan kursus

Terus meneroka

Laluan pembelajaran berkaitan

HTML for Kids logoHTML for KidsIntroduce kids to web development with fun and easy HTML lessons at HTML for Kids.HTML Academy logoHTML AcademyBuild strong foundations in web development by learning HTML at HTML Academy.Angular Academy logoAngular AcademyLearn Angular to build scalable and modern web applications with Angular Academy.Vue Academy logoVue AcademyCreate interactive and efficient user interfaces with Vue.js through Vue Academy.Sveltejs Academy logoSveltejs AcademyBuild fast and simple user interfaces with modern techniques at Svelte Academy.Web Accessibility Academy logoWeb Accessibility AcademyBuild inclusive websites everyone can use. Master semantic HTML, ARIA, keyboard and scree…
FAQ

Soalan Lazim

Adakah kursus Frontend Academy percuma?

Ya. Anda boleh memulakan kursus Frontend Academy secara percuma dan mengikuti pelajaran interaktifnya tanpa sebarang bayaran. Langganan PRO pilihan membuka akses kepada alat kecerdasan buatan lanjutan dan sijil yang boleh dikongsi.

Adakah saya memerlukan pengalaman terdahulu untuk mempelajari HTML?

Tidak. Kursus ini bermula dengan asas dan beralih secara beransur-ansur kepada topik yang lebih maju, jadi anda boleh bermula walaupun tanpa pengalaman terdahulu dalam HTML.

Bagaimanakah saya akan mempelajari HTML di CoddyKit?

Anda belajar melalui amali. Pelajaran interaktif yang ringkas menggabungkan penerangan yang jelas dengan latihan pengekodan praktikal yang berjalan dalam masa nyata, manakala tutor kecerdasan buatan 24/7 memberikan bantuan yang diperibadikan apabila anda menghadapi kesukaran.

Adakah saya mendapat sijil selepas menamatkan Frontend Academy?

Ya. Pelajar PRO boleh menduduki peperiksaan dan memperoleh sijil tamat kursus yang boleh dikongsi, lengkap dengan kod yang boleh disahkan untuk kursus Frontend Academy.

Bolehkah saya mempelajari HTML melalui telefon saya?

Ya. CoddyKit tersedia di web dan sebagai aplikasi asli iOS serta Android, jadi anda boleh mempelajari HTML pada mana-mana peranti dan kemajuan anda disegerakkan merentas semua peranti.

Berapakah kos CoddyKit PRO?

Kursus pertama dalam Frontend Academy adalah percuma. CoddyKit PRO membuka akses kepada setiap kursus: $5.90 seminggu, $7.90 sebulan, $29.90 setahun atau $69.99 sekali untuk akses seumur hidup tanpa pembaharuan.

Berapa lama masa yang diperlukan untuk melengkapkan Frontend Academy?

Frontend Academy mempunyai 41 kursus dan 163 pelajaran. Kebanyakan pelajaran mengambil masa kira-kira 5–10 minit, jadi keseluruhan laluan ini memerlukan sekitar 19 jam latihan amali, mengikut rentak anda sendiri.

Mulakan Frontend Academy Sekarang

Sertai ribuan pelajar yang menguasai pengaturcaraan melalui pelajaran berkuasa kecerdasan buatan.

Mula belajar secara percumaSemak Semua Kursus