DAY 12 PKL ISTN

Assalamualaikum wr wb

Masih dengan Fauzan Blog's. Gimana kabarnya nih para penghirup oksigen semua? Masih pada sehat semua kan? semoga sehat selalu ya.. Amin..

Hari keduabelas nulis di Blog, Oke langsung saja saya mulai ceritanya.. Ekhm Ekhm..

Selasa, 16 Juli 2024

Hari Keduabelas PKL

Hari keduabelas saya PKL di FSTI ISTN. Masih ditemani oleh ketiga teman saya yaitu Asep, Habib dan Parel. Hari keduabelas, Setelah kami datang sekitar jam 8.30 kami langsung mengerjakan tugas yang sudah diberikan dihari sebelumnya, kami melakukan bersih bersih sesuai dengan tugas masing masing, saya menyapu lantai laintai yang ada di lab.

gambar 1 sedang membersihkan lantai.

Setelah kami mengerjakan tugas piket masing-masing kami diberi tugas oleh pak adi untuk membuat web yang menjelaskan tentang berbagai software dan web server, tugas ini tugas untuk dua hari, sessaat setelah kami diberi tugas kami langsung mengerjakannya.

gambar 2 sedang mengerjakan web.

Website

Untuk web kali ini tidak menggunakan database karena hanya berisi penjelasan penjelasan saja, Untuk hari ini web yang saya buat baru 2 halaman yaitu index.php dan android.php untuk css nya saya menggunakan css eksternal dengan nama file styles.css.

Berikut ini tampilan, kodingan dan penjelasan halaman web 'index.php' :

gambar 3 halaman index web.

Fungsi Dashboard Web

1. Navigasi Utama:

   • Akses mudah ke halaman Home, Tentang, Layanan, Kontak, Buku Tamu, dan Login melalui menu di header.

2. Sidebar Navigasi:

   • Akses cepat ke topik pengembangan aplikasi dan basis data seperti Android Studio, Objective C, Unity 3D, HTML5, SQL-Server, dan lainnya, dengan ikon dari Font Awesome.

3. Konten Utama:

   • Menyambut pengguna dengan pesan selamat datang dan informasi singkat tentang tujuan dashboard.

4. Footer:

   • Menyediakan informasi hak cipta.

Manfaat

• Kemudahan Akses: Navigasi jelas dan terstruktur untuk menemukan informasi.
• Pengelolaan Konten: Tempat terorganisir untuk mengelola pengembangan aplikasi dan basis data.
• Desain Responsif: CSS memastikan tampilan baik di berbagai perangkat.

Dashboard Web ini berfungsi sebagai pusat informasi yang komprehensif dan mudah diakses untuk pengembangan aplikasi dan manajemen basis data.

Berikut ini tampilan, kodingan dan penjelasan halaman web 'android.php' :

gambar 4 halaman web android.

Fungsi Halaman "Android Studio" pada Sidebar Web

1. Navigasi Utama:

   • Akses mudah ke halaman Home, Tentang, Layanan, Kontak, Buku Tamu, dan Login melalui menu di header.

2. Sidebar Navigasi:

   • Akses cepat ke berbagai topik terkait pengembangan aplikasi dan basis data, termasuk Android Studio, Objective C, Unity 3D, HTML5, SQL-Server, dan lainnya, dengan ikon dari Font Awesome.

3. Konten Utama:

   • Menyambut pengguna dengan informasi tentang Android Studio.
   • Memberikan panduan dan sumber daya untuk pengembangan aplikasi Android, termasuk penggunaan fitur-fitur kunci seperti pemrograman Kotlin, manajemen proyek, dan integrasi dengan berbagai platform Android.

4. Footer:

   • Menyediakan informasi hak cipta.

Manfaat

• Kemudahan Akses: Navigasi jelas dan terstruktur untuk menemukan informasi tentang berbagai alat dan teknologi pengembangan.
• Pengelolaan Konten: Tempat terorganisir untuk mengelola informasi dan panduan terkait pengembangan aplikasi Android.
• Desain Responsif: CSS memastikan tampilan baik di berbagai perangkat.

Halaman ini berfungsi sebagai pusat informasi yang komprehensif dan mudah diakses untuk pengembangan aplikasi Android menggunakan Android Studio.

Berikut ini kodingan dan penjelasan halaman web 'styles.css' :

Fungsi CSS dalam styles.css

1. Body:

   • Mengatur font, margin, padding, dan latar belakang halaman.

2. Container:

   • Menentukan lebar maksimal konten (1200px) dan sentralisasi.

3. Header:

   • Menetapkan latar belakang gelap, teks putih, dan padding.

4. Header .container:

   • Menggunakan flexbox untuk tata letak fleksibel.

5. Header .title:

   • Mengatur elemen judul agar tumbuh untuk mengisi ruang.

6. Header h1:

   • Mengatur ukuran font dan menghilangkan margin.

7. Header nav ul:

   • Menghapus style default dan mengatur padding serta margin.

8. Header nav ul li:

   • Menampilkan elemen daftar inline dengan margin kanan.

9. Header nav ul li a:

   • Mengatur teks putih, padding, dan transisi warna latar belakang saat hover.

10. Sidebar:

    • Menetapkan lebar, latar belakang gelap, teks putih, padding, dan mengapung ke kiri.

11. Sidebar h2:

    • Mengatur ukuran font dan warna teks.

12. Sidebar nav ul:

    • Menghapus style default dan padding.

13. Sidebar nav ul li:

    • Menambahkan margin bawah pada elemen daftar.

14. Sidebar nav ul li a:

    • Mengatur teks putih, padding, tampilan blok, border-radius, dan transisi warna latar belakang saat hover.

15. Main:

    • Mengatur margin kiri untuk mengakomodasi sidebar dan menambahkan padding.

16. Footer:

    • Menetapkan latar belakang gelap, teks putih, teks berpusat, dan padding.

Manfaat

• Konsistensi Tampilan: Tampilan rapi dan konsisten untuk elemen-elemen halaman web.
• Navigasi Jelas: Menu dan sidebar dengan gaya yang mudah diakses.
• Desain Responsif: Flexbox dan margin untuk tampilan yang baik di berbagai perangkat.

CSS ini memberikan tampilan profesional, terstruktur, dan mudah diakses bagi pengguna.

Untuk Hari ini hanya itu yang baru saya buat karena saya fokus untuk mencari desain yang cocok, besok saya akan menyelesaikan web nya.

Sekian aja cerita pengalaman hari keduabelas PKL dari saya. Mohon maaf apabila ada pengetikkan yang kurang berkenan di hati karena kadang tangan ini khilaf dan terpeleset karena licinnya keyboard yang digunakan. Terima kasih telah membaca.

Wassalamualaikum wr wb