EAS - Pemrograman Web (A)

Nama: Nadya Permata Sari

NRP: 5025201015

Penjelasan Soal EAS

Sebuah lembaga kursus ingin membuat aplikasi e-learning. Aplikasinya mempunyai modul :

admin halaman
admin tutors
admin partners
admin Admission
admin contact
login

Sedangkan menu yang ada di aplikasi adalah :

Home
Courses
Tutors
Partners
Admission
Contact
Sign Up

Berdasarkan hal di atas:

Jelaskan perbedaan front end dan Back End
Kompetensi apa saja yang harus dikuasai oleh Front End Engineer, dan Back End Developer
Buatlah struktur tabel dari aplikasi
Desainkan bentuk masing-masing menu
Implementasikan keseluruhan modul
Buat video presentasi dan dokumentasikan keseluruhan program ke dalam blog. Tuliskan komen di halaman EAS ini link blog Anda

JAWABAN:

1.Front end dan back end merupakan komponen penting dalam suatu perangkat lunak atau website. Secara mudah, front end adalah apa yang kita dapat lihat sementara back end adalah apa yang tidak bisa kita lihat secara langsung.

Front end merupakan bagian dari aplikasi yang berhubungan langsung dengan pengguna. Hal ini mencakup elemen-elemen yang terlihat dan dirasakan oleh pengguna saat menggunakan aplikasi, seperti antarmuka pengguna, tata letak, tombol, formulir, animasi, dan lain-lain. Tiga teknologi utama yang ada di front end adalah HTML, CSS, dan Javascript.

HTML (HyperText Markup Language) adalah bahasa markup yang digunakan untuk membuat struktur dan mengatur konten sebuah halaman web. HTML menggunakan elemen-elemen tag untuk mengidentifikasi dan memformat berbagai jenis konten seperti teks, gambar, tautan, tabel, formulir, video, dan banyak lagi.

Contoh sederhana kode HTML untuk membuat paragraf:

<p>Ini adalah contoh paragraf.</p>

Dalam contoh di atas, <p> adalah tag pembuka yang menandakan awal dari paragraf, dan </p> adalah tag penutup yang menandakan akhir dari paragraf.

CSS (Cascading Style Sheets) adalah bahasa yang digunakan untuk mengatur tampilan dan gaya visual dari elemen-elemen yang ditampilkan dalam halaman web. Dengan CSS, kita dapat mengontrol warna, ukuran, tata letak, tipografi, animasi, dan berbagai aspek tampilan lainnya.

Contoh sederhana kode CSS untuk mengubah warna teks paragraf:

p {

color: blue;

}

Dalam contoh di atas, p adalah selector yang memilih elemen paragraf, dan color: blue; adalah properti CSS yang mengatur warna teks menjadi biru.

JavaScript adalah bahasa pemrograman yang digunakan untuk memberikan interaktivitas dan fungsi dinamis pada halaman web. Dengan JavaScript, Anda dapat merespons tindakan pengguna, memanipulasi elemen halaman, mengambil dan memanipulasi data, serta berkomunikasi dengan server.

Contoh sederhana kode JavaScript untuk memberikan pesan pop-up saat tombol diklik:

<button onclick="myFunction()">Klik Saya</button>

<script>

function myFunction() {

alert("Halo, dunia!");

}

</script>

Dalam contoh di atas, saat tombol diklik, fungsi myFunction() akan dipanggil dan sebuah pesan pop-up dengan teks "Halo, dunia!" akan ditampilkan.

Back end merupakan bagian dari aplikasi yang berada di sisi server. Bagian ini bertanggung jawab untuk mengelola dan memproses data, serta menjalankan logika bisnis yang mendasari suatu aplikasi. Beberapa komponen yang terlibat dalam pengembangan back end antara lain server, database, Bahasa pemrograman server-side, dan API.

Server adalah sebuah server yang menyediakan lingkungan untuk menjalankan aplikasi dan melayani permintaan dari klien (pengguna).

Database adalah tempat penyimpanan data aplikasi. Database digunakan untuk menyimpan dan mengelola data yang diperlukan oleh aplikasi, seperti informasi pengguna, konten, konfigurasi, dan lain-lain.

Bahasa pemrograman server-side adalah bahasa pemrograman seperti PHP, Python, Ruby, Java, atau JavaScript (Node.js) digunakan untuk mengembangkan logika bisnis dan menghubungkan antara front end dengan database.

API (Application Programming Interface) digunakan untuk mengizinkan interaksi antara front end dan back end. Melalui API, data dapat dipertukarkan antara klien dan server.

Berikut jika ditampilkan perbedaan dalam tabel:

No	Front End	Back End
1	Fokus pada presentasi dan interaksi dengan pengguna.	Fokus pada pemrosesan data dan logika bisnis.
2	Menggunakan teknologi seperti HTML, CSS, dan JavaScript.	Menggunakan bahasa pemrograman server-side seperti PHP, Python, Ruby, Java, atau JavaScript (Node.js).
3	Front end developer bertanggung jawab merancang, mengembangkan, dan memelihara front end aplikasi.	Back end developer bertanggung jawab merancang, mengembangkan, dan memelihara komponen back end aplikasi.
4	Memastikan tampilan yang menarik, responsif, dan mudah digunakan oleh pengguna.	Berinteraksi dengan database, sistem operasi, dan sumber daya server lainnya.
5	Berhubungan langsung dengan browser pengguna.	Tidak langsung berhubungan dengan pengguna, tetapi memberikan dukungan yang dibutuhkan oleh front end.

2. Sesuai penjelasan yang ada di nomer satu yaitu Front end bertanggung jawab untuk tampilan dan interaksi dengan pengguna, sementara back end mengelola pemrosesan data dan logika bisnis di sisi server. Hal ini juga tentunya akan memiliki hubungan dengan kompetensi yang harus dikuasai oleh Front End Engineer dan Back End Engineer.

Front end developer bertanggung jawab merancang, mengembangkan, dan memelihara front end aplikasi. Lalu, Back end developer bertanggung jawab merancang, mengembangkan, dan memelihara komponen back end aplikasi.

Hal yang pertama yaitu dari Bahasa pemrograman. Seorang front end developer harus menguasai HTML untuk membangun struktur halaman web, CSS untuk mengatur tampilan dan gaya, serta JavaScript untuk menghadirkan interaktivitas dan fungsi pada halaman. Untuk Back end developer harus menguasai satu atau beberapa bahasa pemrograman server-side seperti PHP, Python, Ruby, Java, atau JavaScript (Node.js). Mereka perlu memahami konsep pemrograman dan logika bisnis untuk mengembangkan fungsi dan pemrosesan data di sisi server.

Selanjutnya, Front end developer perlu memahami prinsip-prinsip desain antarmuka pengguna (UI/UX) yang baik, responsivitas, dan aksesibilitas. Mereka harus dapat mengoptimalkan tampilan dan interaksi agar pengguna memiliki pengalaman yang baik. Kemampuan dalam desain grafis, seperti penggunaan alat desain dan pemahaman tentang prinsip desain visual, dapat membantu front end developer dalam menciptakan tampilan yang menarik dan estetis.

Sebagai Back end developer harus memahami konsep dasar basis data dan memiliki kemampuan dalam mendesain dan mengelola basis data. Mereka perlu menguasai bahasa kueri seperti SQL dan memahami cara menghubungkan aplikasi dengan basis data. Selain itu, Keamanan aplikasi adalah aspek penting yang harus diperhatikan oleh back end developer. Mereka harus memahami praktik pengamanan yang baik, melindungi data sensitif, dan menerapkan langkah-langkah keamanan yang diperlukan. Back end developer perlu memiliki pemahaman tentang konsep dan implementasi API. Mereka harus mampu membuat dan mengelola API yang dapat berinteraksi dengan aplikasi lain atau menyediakan akses ke data dan fungsi aplikasi.

3. Struktur tabel dari aplikasi adalah