JavaRush /Java Blog /Random-JA /コーヒーブレイク #157。2022 年のフロントエンド Web アプリケーションに Java を使用する

コーヒーブレイク #157。2022 年のフロントエンド Web アプリケーションに Java を使用する

Random-JA グループに公開済み
出典: Nocodefunctions Java を使用した独立した Web アプリケーションの開発経験に関する記事を紹介します。 コーヒーブレイク #157。 2022 年のフロントエンド Web アプリケーションに Java を使用する - 1

フロントエンド用の Java - それは本当に可能ですか?

多くの人は、フロントエンド開発に Java を使用することはまったく不可能であると信じています。結局のところ、Java はバックエンド用に設計されています。はい、昔は Java アプレットと Java Webstart を使用して、ブラウザから Java アプリケーションを実行できました。しかし、これは古い歴史であり、Flash プラグインと同じくらい古いものです。しかし、アプレットがなくても、フロントエンドに Java を使用する方法があります。これらは JSP (Java Server Pages) であり、多くの学童がコンピューター サイエンスの授業で学習しました。ただし、JSP は依然として一部の Java 書籍で説明されていますが、このテクノロジは 2010 年代以降非推奨になっています。本当にまた行き止まりなのでしょうか?Java 開発者が Google Web Toolkit (GWT、これもそれほど新しいものではありません) またはJ2Cl (これも Google の)を使用してコードを JavaScript に「トランスパイル」(複雑な方法で変換) できるフレームワークもあります。GWT と J2Cl は初心者には適しておらず、大規模プロジェクトで使用するために Google によって開発されたエンタープライズ ツールであることに注意することが重要です。

フロントエンドにおける Java の縁の下の力持ち: Jakarta Faces (JSF)

現在「Jakarta Faces」として知られる Java Server Faces (JSF) は、少なくとも 2010 年代初頭から存在しています。このフレームワークを使用すると、Web アプリケーションを迅速、安全、確実に開発することが容易になるため、このフレームワークがほとんど知られておらず、ほとんど言及されていないことにいつも驚かされます。JSF は習得が簡単で、Java エコシステムを最大限に活用します。たとえば、動的コンテンツを含む Web ページを作成する方法は次のとおりです。
  • HTML ページを作成します (拡張子は .xhtml です)。
  • <head> タグと <body> HTML タグを <h:head> タグと <h:body> タグに変更します。
  • バックエンドでプロパティを呼び出して動的コンテンツを表示するには、次のコードをハッシュタグの後ろのコントロール バーの間に配置するだけです。

    #{backendscript.myText}
次に、バックエンドに Backendscript.java ファイルを作成し、 String myText = "hi! welcome to my page!" という変数を追加します。。Webページ上に表示されます。JSF は実際には非常にシンプルです。Stackoverflow に関する多くの質問、公式ドキュメント、いくつかの本 (このリンク、そして私はDavid Heffelfinger の本も好きです)、そしてもちろんYoutube ビデオのおかげで、この内容は十分に文書化されています。

JSF は複雑ですか? その利点は何ですか?

JSF はまったく複雑ではありません。さらに:
  1. 従来の Java IDE (NetBeans、IntelliJ IDEA、および Eclipse) と適切に統合されています。各 IDE は以下を提供します。
    • Maven 構成のテンプレートを記入するテンプレート プロジェクト (ちなみに、これは非常に単純です)。
    • デバッグ ツール (少なくとも NetBeans についてはホット リロードを備えたもの)。
    • Java エコシステム用の強力なオートコンプリート、リファクタリング、ナビゲーション、エラー強調表示ツール。IDE は、HTML ページ内で言及したクラス (上記の#{backendscript.myText}など) に関する有用な情報を提供できます。HTML ページは実際にコードベースの残りの部分と統合されます。
  2. HTML ページ上の複雑なコードのバリエーションを非常に簡単に処理します。
    • ボタンをクリックするだけでページの一部を更新する必要がありますか? ボタンに更新プロパティを追加し、その後に更新するコンポーネントの ID を追加します。
    • 更新と動的コンテンツについて: フロントエンドがバックエンドを更新したり、それ自体を更新したり、バックエンドがフロントエンドを更新したりする、JSF のシンプルさがとても気に入っています。これらはすべて Web アプリケーションの基本的な要件であり、ここに示されています。
    • ユーザーがファイルの種類とサイズの条件を指定して 1 つまたは複数のファイルをダウンロードできるようにしたい場合は、明確なパラメーターを含む 1 行をコードに追加するだけです。
    • 多言語でウェブサイトを作成する必要がありますか? <f:view>タグを HTML に追加すると、バックエンドの1 行でユーザーの言語を取得できます。
  3. HTML タグ、JS、CSS スクリプトを追加および混合でき、すべて SEO が最適化されています。
JSF によって生成された html を完全に制御でき、いつでも html および js コードを追加できます。これにより、JSF を知らない、または JSF に関心がないデザイナーやフロントエンド開発者との共同作業が容易になります。CSS を使用していたときは、JSF を使用して作成した HTML ページを操作できるデザイナーの助けを借りて、必要な変更を難なく加えることができました。JSF は、ブラウザで表示および読み取りできる HTML コードを生成します。これは、通常の開発ツールを使用してデバッグしたり、SEO アクションが正しく実装されていることを確認したりする場合に非常に役立ちます。

Primefaces: 無料の JSF コンポーネントとテーマの膨大なリスト

JSF には、HTML ページのクラシックな部分を作成するすぐに使用できるコンポーネントの長いリストが付属しているため、自分で作成する必要はありません。たとえば、 <h:dataTable>タグを使用すると、バックエンドからロードされた特定のデータを表示するテーブルを作成できます。テーブルを最初から再作成する必要はありません。そして、より良い選択肢があります。Prime Tek はPrimefacesと呼ばれるオープンソースのコンポーネントのセットを開発しました。これらには追加機能が備わっており、いくつかの利点があります。たとえば、<h:dataTable> の代わりに、Primefaces の <p:dataTable> タグを使用します。これにより、列スイッチ動的列、またはテーブル内の 編集関数を簡単に追加できる基本的なデータ テーブルが作成されます。

でも Java は遅くて重いですよね?

1. Java は遅いですか?

いいえ。面白いのは、React、Angular、Vue などの JS フレームワークは、すべてのアプリケーション ロジックをサイト訪問者のブラウザに即座に送信するため、Java の JSF よりも高速でスマートであることを約束して作成されたことです。JSF の動作は異なります。ユーザーがページ (https://nocodefunctions.com など) を呼び出すと、バックエンドのアプリケーションがそのページのみの HTML を生成し、送り返します。これは「サーバーサイドレンダリング」(SSR)と呼ばれます。実際には、単一ページのアプリケーションでは、ユーザーがアプリケーション全体を構成する JavaScript ファイルを取得してロードするのに非常に長い時間がかかることがあります。これにより、ユーザー エクスペリエンスの低下 (最初のページが読み込まれるまで待たなければならない) や SEO の問題が発生する可能性があります。その結果、速度とパフォーマンスの点でクライアント側レンダリングよりも優れていると考えられているため、Java スタイルのサーバー側レンダリングの人気が再び高まっています。新しいSSR フレームワークが出現しているため、クライアント側のレンダリングに慣れている開発者は、これら 2 つの異なるロジックを処理して混合する必要があります。

2. Java は難しいですか?

いいえ。JSF アプリケーションをデプロイするために必要なもの:
  • アプリケーション自体。単純な JSF「hello world」アプリケーションは、おそらく 10KB 以下です。
  • より高品質のコンポーネントが必要な場合は、Primefaces (前述) をオプションで使用できます。これは追加の 4.5 MBです。
次に、すべてをサーバー上で実行します。これを行うには、次のものが必要です。
  1. クラウドまたは他の場所にサーバーを置きます。Nocodefunctions のテスト バージョン (https://test.nocodefunctions.com) では、Hetzner を使用しています。そこでは、2 GB RAM を搭載したベア メタル サーバーを月額 4.15 ユーロでレンタルしています。使用する RAM を少なくすることもできますが、アプリケーションはデータ集約型のサービスを提供するため、メモリに収まる必要があります。nocodefunctions の実際の (非テスト) バージョンは、より大規模なサーバー (これも Hetzner を使用) で実行され、より多くのユーザーのデータ集約型タスクを並行してサポートします (月額 50 ユーロ未満)。

  2. Java がインストールされている必要があります。これは、Mac、Win、または Linux で 200 MB 未満の単一ファイルをダウンロードでき、商用利用であっても完全に無料です。

  3. これを実行するには Java Web サーバーが必要です。それらの多く。個人的には、Payara Micro (コミュニティ エディション) を使用しています。これは無料で、77 MB のファイルを 1 回ダウンロードできます。

  4. アプリケーションを起動します。

結論: Java について考えてみましょう!

小規模な Web アプリケーションを開始する場合、Python、Ruby、PHP、NodeJS + React... が唯一の選択肢であると考えるプログラマーもいるように感じます。しかし今では、彼らが次のプロジェクトで Java + JSF も検討してくれることを願っています。
コメント
TO VIEW ALL COMMENTS OR TO MAKE A COMMENT,
GO TO FULL VERSION