「これが分かるようになりたい!」と今あなたが関心を持っているところに注力するのが、一番楽しくて、理解が深まると思いますよ。
ただ、いきなりすべての理解は大変なので
最初の一・二年目はフロント or バックエンド どちらかに力を注げばよいのではないでしょうか?
自分は最初、バックエンドからの理解を深めました。
以下ざっくりとした回答編
【バックエンド編】
★ サーバーの理解(Tomcat/Apache)
webサーバーやアプリケーションサーバ(tomcat)等がどのようなやり取りをしているかをしっかり把握しておきましょう。あとポートとか(ネットワークの一般的知識)
ex)tomcatだと8080ポートが良く使われるとか, httpはデフォルトで80ポート使うとか(httpsなら443とか)
余裕があればプロキシも..
★ ajax, JSON
JSONはただのフォーマットです。形を覚えてしまいましょう。webAPIでもよく利用されていますね。
ajaxの理解の前にwebサーバーのおける、「同期通信」と「非同期通信」を理解しましょう。
★デザインパターン
Java → OOPの原則を学ぶと良いです。
クラス図は最低限書けるようにしといたほうがいいです。(関連の種類など)
デザインパターンを覚える→OOPの設計感覚を身に着けるでもよいですが..
原則を理解すると、デザインパターンの形がなぜそうなるかが結構わかります。
★フレームワーク
まずは最低限フレームワークの使い方を学びましょう。
次にWebフレームワークの基礎であるMVCについて理解を深めましょう。
もしフレームワークがオブジェクトのライフサイクルを管理している機構も持っているのであれば把握しておきましょう。
★DB
データベース設計を学びましょう(ER図)
トランザクションは、機構を把握しておきましょう。
★http(GET/POST)
GET/POSTメソッドは、送信するパラメータが何かを意識するとわかりやすいです。(クエリパラメータ、リクエストボディーパラメータ)
RESTfulな設計も把握しておきましょう。
★ローカルストレージ/Cookie
ブラウザの開発者ツールを開く癖を身につけてください。一瞬で原理がわかります。
あとブラウザのキャッシュとかも知っておくと良いかも
★仮想化
VM,dockerなどは知っとくと便利です。暇があればぜひ。
【フロントエンド編】
★ JQuery
Javascript(commonJS, ES Modules)の基本はおさえておくべきですね。
JQueryだけでなく、webpack等、知っておくべきことは山のようにあります。
【その他】
正直、本のおすすめなんて、たくさんの人が紹介しまくっているので、その分野につまずいたときに検索すればよいです。
技術記事を読む癖はつけた方がいいです。(毎日1時間でも良いので)
暇があれば、github等でオープンソースのコードを読み漁り、活用できれば、立派なエンジニアです。