JavaRush /Java Blog /Random-ID /Rehat kopi #157. Menggunakan Java untuk aplikasi web fron...

Rehat kopi #157. Menggunakan Java untuk aplikasi web front-end pada tahun 2022

Dipublikasikan di grup Random-ID
Sumber: Nocodefunctions Kami menyampaikan kepada Anda sebuah artikel tentang pengalaman mengembangkan aplikasi web independen menggunakan Java. Rehat kopi #157.  Menggunakan Java untuk aplikasi web front-end pada tahun 2022 - 1

Java untuk frontend - apakah mungkin?

Banyak orang percaya bahwa menggunakan Java untuk pengembangan front-end adalah hal yang mustahil: lagipula, Java dirancang untuk back-end. Ya, dahulu kala, applet Java dan Java Webstart memungkinkan Anda menjalankan aplikasi Java dari browser. Tapi ini adalah sejarah kuno, setua plugin Flash. Tetapi bahkan tanpa applet, ada cara untuk menggunakan Java sebagai front-end - ini adalah JSP (Java Server Pages), yang banyak dipelajari oleh anak sekolah dalam pelajaran ilmu komputer. Namun, meskipun JSP masih dibahas di beberapa buku Java, teknologi ini sudah tidak digunakan lagi sejak tahun 2010an. Apakah ini benar-benar jalan buntu lagi? Ada juga kerangka kerja yang memungkinkan pengembang Java untuk “mentranspilasi” (mengubah dengan cara yang rumit) kode mereka menjadi JavaScript menggunakan Google Web Toolkit (GWT, ini juga bukan hal yang super baru ) atau melalui J2Cl (juga dari Google). Penting untuk dicatat bahwa GWT dan J2Cl tidak cocok untuk pemula, mereka lebih merupakan alat perusahaan yang dikembangkan oleh Google untuk digunakan dalam proyek besar.

Pahlawan tanpa tanda jasa Java untuk frontend: Jakarta Faces (JSF)

Java Server Faces (JSF), yang sekarang dikenal sebagai “Jakarta Faces,” telah ada setidaknya sejak awal tahun 2010an. Saya selalu terkejut karena sedikit diketahui dan jarang disebutkan karena framework ini memudahkan pengembangan aplikasi web dengan cepat, aman, dan andal. JSF mudah dipelajari dan memanfaatkan sepenuhnya ekosistem Java. Misalnya, berikut ini cara Anda membuat halaman web dengan konten dinamis:
  • Buat halaman html (dengan ekstensi .xhtml).
  • Ubah tag html <head> dan <body> menjadi tag <h:head> dan <h:body>.
  • Sekarang, untuk menampilkan konten dinamis dengan memanggil beberapa properti di backend, cukup tempatkan kode ini setelah hashtag dan di antara bilah kontrol:

    #{backendscript.myText}
Kemudian buat file Backendscript.java di backend Anda, tambahkan variabel bernama String myText = "hi! selamat datang di halaman saya!" . Ini akan ditampilkan di halaman web. JSF sebenarnya sangat sederhana. Ini didokumentasikan dengan baik berkat banyak pertanyaan tentang Stackoverflow , dokumentasi resmi , beberapa buku ( tautan ini , dan saya juga menyukai buku David Heffelfinger ) dan tentu saja video Youtube .

Apakah JSF rumit? Apa kelebihannya?

JSF tidak rumit sama sekali. Lebih-lebih lagi:
  1. Ini terintegrasi dengan baik dengan IDE Java klasik (NetBeans, IntelliJ IDEA dan Eclipse). Setiap IDE menyediakan:
    • Proyek templat yang mengisi templat untuk konfigurasi Maven (yang sangat sederhana).
    • Alat debugging (dengan hot reload, setidaknya untuk NetBeans).
    • Alat pelengkapan otomatis, pemfaktoran ulang, navigasi, dan penyorot kesalahan yang canggih untuk ekosistem Java. IDE dapat memberikan informasi berguna tentang kelas apa pun yang Anda sebutkan di halaman html (seperti #{backendscript.myText} yang disebutkan di atas). Halaman HTML akan benar-benar terintegrasi dengan basis kode Anda yang lain!
  2. Ini menangani variasi kode kompleks pada halaman html dengan sangat mudah.
    • Apakah Anda perlu menyegarkan sebagian halaman dengan satu klik tombol sederhana? Tambahkan properti update ke tombol Anda, diikuti dengan ID komponen yang ingin Anda perbarui.
    • Mengenai pembaruan dan konten dinamis: Saya sangat menyukai kesederhanaan JSF: frontend memperbarui backend, memperbarui dirinya sendiri, atau backend memperbarui frontend. Semua ini adalah persyaratan dasar aplikasi web dan semuanya ada di sini.
    • Jika ingin pengguna dapat mendownload sebuah file atau beberapa file dengan syarat jenis dan ukuran file, cukup tambahkan satu baris pada kode dengan parameter yang jelas .
    • Perlu membuat situs web dalam berbagai bahasa? Tambahkan tag <f:view> ke html Anda dan dapatkan bahasa pengguna hanya dengan satu baris di backend.
  3. Anda dapat menambahkan dan mencampur tag HTML, skrip JS dan CSS, dan semuanya dioptimalkan untuk SEO.
Anda memiliki kendali penuh atas html yang dihasilkan oleh JSF dan Anda selalu dapat menambahkan kode html dan js. Hal ini memudahkan untuk berkolaborasi dengan desainer dan pengembang front-end yang tidak mengetahui atau tidak peduli dengan JSF. Ketika saya bekerja dengan CSS, saya mendapat bantuan seorang desainer yang dapat bekerja dengan halaman HTML yang saya buat menggunakan JSF, membuat perubahan yang diperlukan tanpa kesulitan apa pun. JSF menghasilkan kode HTML yang dapat Anda lihat dan baca di browser Anda. Ini sangat membantu untuk melakukan debug dengan alat pengembangan reguler dan memverifikasi bahwa tindakan SEO Anda diterapkan dengan benar.

Primefaces: Daftar besar komponen dan tema JSF gratis

JSF hadir dengan daftar panjang komponen siap pakai yang membuat bagian klasik halaman html, jadi Anda tidak perlu melakukannya sendiri. Misalnya, gunakan tag <h:dataTable> untuk membuat tabel yang menampilkan data spesifik yang dimuat dari backend Anda—tanpa harus membuatnya ulang dari awal. Dan ada opsi yang lebih baik: Prime Tek telah mengembangkan serangkaian komponen sumber terbuka yang disebut Primefaces . Mereka hadir dengan fitur tambahan dan memiliki beberapa keunggulan. Misalnya, alih-alih <h:dataTable>, cukup gunakan tag Primefaces <p:dataTable>. Ini membuat tabel data dasar yang dapat dengan mudah Anda tambahkan sakelar kolom , kolom dinamis , atau fungsi edit dalam tabel.

Tapi Java lambat dan berat?

1. Apakah Java lambat?

TIDAK. Lucunya framework JS seperti React, Angular, dan Vue dibuat dengan janji lebih cepat dan lebih pintar dari JSF di Java, karena mereka segera mengirimkan semua logika aplikasi ke browser pengunjung situs. JSF bekerja secara berbeda: ketika pengguna memanggil suatu halaman (misalnya https://nocodefunctions.com), aplikasi di backend menghasilkan html untuk halaman itu saja dan mengirimkannya kembali. Ini disebut “render sisi server” (SSR). Dalam praktiknya, aplikasi satu halaman memerlukan waktu yang sangat lama bagi pengguna untuk mengambil dan memuat file javascript yang membentuk keseluruhan aplikasi. Hal ini dapat menyebabkan pengalaman pengguna yang buruk (harus menunggu halaman pertama dimuat) dan masalah SEO. Hasilnya, rendering sisi server gaya Java kembali populer karena dianggap lebih unggul daripada rendering sisi klien dalam hal kecepatan dan kinerja. Kerangka kerja SSR baru bermunculan yang mengharuskan pengembang terbiasa dengan rendering sisi klien untuk menangani dan menggabungkan dua logika berbeda ini.

2. Apakah Java sulit?

TIDAK. Apa yang Anda perlukan untuk menerapkan aplikasi JSF:
  • Aplikasi itu sendiri. Aplikasi JSF "hello world" sederhana mungkin berukuran 10KB atau kurang.
  • Opsional adalah Primefaces (dibahas di atas) jika Anda membutuhkan komponen berkualitas lebih tinggi. Ini adalah tambahan 4,5 MB .
Sekarang jalankan semuanya di server. Untuk melakukan ini, Anda perlu:
  1. Miliki server di cloud atau di tempat lain. Untuk versi uji Nocodefunctions (https://test.nocodefunctions.com) saya menggunakan Hetzner, di mana saya menyewa server bare metal dengan RAM 2 GB seharga 4,15 euro per bulan. Saya dapat menggunakan lebih sedikit RAM, namun aplikasi saya menyediakan beberapa layanan intensif data dan harus sesuai dengan memori. Versi nocodefunctions yang sebenarnya (non-tes) berjalan pada server yang lebih besar (juga dengan Hetzner) untuk mendukung lebih banyak tugas intensif data pengguna secara paralel - dengan biaya kurang dari €50 per bulan.

  2. Anda harus menginstal Java. Ini adalah unduhan file tunggal di bawah 200 MB untuk Mac, Win atau Linux, sepenuhnya gratis bahkan untuk penggunaan komersial.

  3. Anda harus memiliki server web Java untuk menjalankannya. Banyak dari mereka. Secara pribadi, saya menggunakan Payara Micro (Edisi Komunitas), yang gratis dan dapat diunduh satu file berukuran 77MB.

  4. Luncurkan aplikasi Anda.

Kesimpulan: Pikirkan Java!

Saya merasa beberapa programmer berpikir bahwa Python, Ruby, PHP, NodeJS + React... adalah satu-satunya pilihan ketika memulai aplikasi web kecil. Tapi sekarang saya berharap mereka juga mempertimbangkan Java + JSF untuk proyek berikutnya.
Komentar
TO VIEW ALL COMMENTS OR TO MAKE A COMMENT,
GO TO FULL VERSION