Skip to content
Home » Blog » Web Development – Struktur Direktori dan File

Web Development – Struktur Direktori dan File

Beberapa kaidah yang berlaku dalam pengembangan web di atas sebuah web server harus kita perhatikan di awal. Dalam tutorial ini, diasumsikan kita memakai web server Apache bundle XAMPP dan tempat binary file berada di directory C:\xampp.

Aturan struktur direktori dan file dalam pengembangan web di atas web server tersebut(XAMPP) yaitu diantaranya:

  1. Directory root untuk web yang dibaca oleh server berada di \htdocs\directorywebkita
  2. File index disajikan secara default oleh web server jika file index ditemukan
  3. File index pada subdirektori tetap akan dipanggil secara default ketika aktif pada subdirektori
  4. Dengan konfigurasi default Apache, kita bisa membuka web yang dikembangkan dengan mengunjungi alamat pada browser: http://localhost/directorywebkita

Langkah-langkah pembuatan web baru di atas web server Apache di localhost:

  1. Buka directory XAMPP C:\xampp kemudian masuk ke directory htdocs
  2. Buat directory baru sebagai web root directory dengan nama praktisimengajar
  3. Kemudian kita gunakan Visual Studio Code untuk memulai ngoding
  4. Klik kanan pada directory yang telah dibuat, kemudian pilih Open with Visual Studio Code
  5. Klik kanan pada file browser vscode kemudian create new file, beri nama index.html
  6. Masukkan source code singkat berikut:
<html>
<head>
<title>Hello World Title</title>
</head>
<body>

<h1>This is a Heading of Our Web</h1>
<p>This is a paragraph One.</p>

</body>
</html>
  1. Kemudian buka browser(contoh Google Chrome) dan ketikkan pada address bar: http://localhost/praktisimengajar. Maka akan tampil halaman web sederhana seperti berikut:

Jika tampilan akhir setelah dicek pada browser sudah sesuai, maka kita sudah berhasil membuat aplikasi web sederhana di atas server Apache dengan beberapa tag HTML seperti html, body, dan p.

Untuk selanjutnya kita siap untuk memulai membangun aplikasi web lebih lanjut di chapter berikutnya. Semoga bermanfaat.

Salam.

Leave a Reply

Your email address will not be published. Required fields are marked *