FluentStack

Menyiapkan Folder Project Lokal

Mode tersedia: dark, light, paper
MasukDaftar
Beginner · Level 3: CSS Fundamentals and LayoutBeginner35 menitBahasa Indonesia

Menyiapkan Folder Project Lokal

Buat folder project sederhana dan siapkan file awal untuk website statis.

StatusMemuat progres
ProgresMemuat...

...

Memuat progres

Menyiapkan langkah berikutnya

Tujuan belajar

  • Memahami fungsi folder project
  • Membuat struktur file sederhana untuk website statis
  • Mengenal index.html dan style.css sebagai file awal
  • Menyiapkan project tanpa npm, framework, atau bundler
Local WorkflowHTMLProject Setup

Isi lesson

5 blok
  1. 1.
    Mulai dari folder kerjaBelum selesaiWajib
  2. 2.
    Struktur folder awalBelum selesaiWajib
  3. 3.
    Checklist local taskBelum selesaiWajib
  4. 4.
    Jangan mulai dari tool yang terlalu beratBelum selesaiOpsional
  5. 5.
    RingkasanBelum selesaiWajib

Mulai dari folder kerja

Wajib

Project lokal adalah folder kerja di perangkat kamu sendiri. Di module ini, tool yang dipakai bertahap: code editor untuk mengedit file, browser untuk membuka halaman, DevTools untuk inspect HTML/CSS, Git untuk menyimpan riwayat perubahan, dan GitHub untuk menyimpan repository online.

Untuk milestone ini, kamu belum perlu npm, React, Next.js, bundler, framework, package manager, atau deployment. Website statis sederhana cukup dimulai dari file HTML dan CSS yang bisa dibuka langsung di browser.

Fokusnya adalah memahami workflow dasar: membuat folder, menulis file, menyimpan perubahan, membuka di browser, lalu nanti menyimpan progres dengan Git.

Bagian ini memengaruhi progres lesson.

Struktur folder awal

Wajib
bash
my-static-site/
  index.html
  style.css

index.html berisi struktur halaman. style.css berisi tampilan halaman. Untuk awal, simpan keduanya di folder yang sama agar hubungan file mudah dipahami.

Bagian ini memengaruhi progres lesson.

Checklist local task

Wajib

Kerjakan di perangkat kamu:

  • Pastikan kamu punya code editor atau aplikasi text editor yang nyaman.
  • Pastikan kamu punya browser modern seperti Chrome, Firefox, Edge, atau Safari.
  • Buat folder project, misalnya my-static-site.
  • Buat file index.html di dalam folder itu.
  • Buat file style.css di folder yang sama.
  • Pastikan nama file ditulis persis: index.html dan style.css.

Checklist ini tidak diperiksa otomatis oleh FluentStack. Tandai selesai setelah kamu benar-benar membuat file lokalnya.

Bagian ini memengaruhi progres lesson.

Catatan penting

Opsional

Jangan mulai dari tool yang terlalu berat

Untuk milestone ini, tujuan utamanya bukan setup modern yang lengkap. Tujuannya adalah memahami file lokal, browser, editor, dan alur kerja dasar tanpa framework.

Opsional, tidak menghambat penyelesaian lesson.

Ringkasan

Wajib
  • Project lokal adalah folder kerja di perangkat sendiri.
  • Website statis sederhana bisa dimulai dari index.html dan style.css.
  • Kamu belum perlu npm, framework, bundler, atau deployment.
  • Berikutnya kamu akan membuka folder project ini di code editor.

Bagian ini memengaruhi progres lesson.

Langkah berikutnya

Selesaikan bagian penting lesson ini

Lanjutkan blok wajib berikutnya: Mulai dari folder kerja.

Memuat progresReview module