Pada pelajaran sebelumnya, kita membuat aplikasi standar menggunakan NativePHP dan membukanya di browser. Alamat defaultnya adalah: http://127.0.0.1:8000/
Halaman ini pada dasarnya adalah halaman web, jadi tidak ada masalah sama sekali. Tampilan UI NativePHP dibuat dengan HTML, CSS dan JS. Lalu bagaimana cara mengubah tampilan ini?
Semua file yang bertugas menampilkan antarmuka tersimpan di folder resources yang ada di direktori proyek
Di perangkat saya, path lengkapnya adalah sebagai berikut:
Buka folder tersebut, kamu akan melihat subfolder berikut:
Folder css untuk menyimpan style, folder js untuk skrip, sedangkan views berisi file PHP halaman. Di dalam views terdapat file-file berikut
Buka file welcome.blade.php
Bagian isinya terlihat seperti ini:
Terasa familiar kan? Ini adalah kode PHP milikmu. Mari kita coba ubah sedikit
Cari bagian subjudul:
<p class="subtitle">Your app is ready.</p>Code language: HTML, XML (xml)Tambahkan satu kalimat di bagian akhir:
<p class="subtitle">Your app is ready.welcome to foxdevelop.com</p>Code language: HTML, XML (xml)Simpan file lalu refresh halaman http://127.0.0.1:8000/
Kamu bisa melihat subjudul antarmuka sudah berubah sesuai teks yang kamu edit. Silakan coba sendiri. NativePHP tidak membatasi teknologi frontend apapun, kamu bebas menggunakan tools atau framework apapun seperti Livewire, Vue, React, Svelte, HTMX bahkan jQuery.
Pada pelajaran ini, cari dulu folder resources dan coba edit file di dalamnya untuk memahami struktur teknis NativePHP. Nanti kita akan bahas secara mendalam semua hal terkait antarmuka ini.