新人エンジニア向け基礎研修：Java, DB, HTML/CSS, JavaScript等で何を学んだ？
新人エンジニア向け基礎研修：Java, DB, HTML/CSS, JavaScript等で何を学んだ？
研修は大きく分けて、以下の流れで進みました。
- 基礎学習：Progateを使ってHTML、CSS、Java、JavaScript、SQLを学習
- プログラミング演習：Paizaを使ってコーディング力を強化
- Webアプリ開発の基礎：Spring BootとVue.jsを学習
- バージョン管理学習：GitとSourceTreeを使ってチーム開発に備える
- 実践演習：社内システムへの機能追加開発に取り組む
基礎から実践まで段階的にスキルアップできるカリキュラムになっており、無理なく成長することができました。
目次
基礎学習：Progateで土台を固める
HTML・CSSの基礎
まずはWebページの基本となるHTMLとCSSから学習しました。
HTMLでページの骨組みを作り、CSSでスタイルを当てる流れを理解し、簡単なレイアウト作成にも取り組みました。
Flexboxなど、レスポンシブデザインの基礎にも軽く触れることができました。
Java・JavaScriptの基礎
次に、JavaとJavaScriptでプログラミングの基礎を学びました。
Javaでは、変数、条件分岐、ループ、クラスとオブジェクト指向の基本を学習。
JavaScriptでは、DOM操作やイベントリスナーを使った基本的な動きのあるWebページ作成にチャレンジしました。
SQLの基礎
SQLでは、データベース操作の基本であるSELECT、INSERT、UPDATE、DELETEを学びました。
テーブル設計の初歩にも触れ、データとプログラムを結びつけるイメージを持つことができました。
プログラミング演習：Paizaでコーディング力を鍛える
Cランク問題で基礎を反復
Paizaを使い、まずはCランクの問題からスタート。
条件分岐、繰り返し処理、配列操作といった基礎的な問題を繰り返し解くことで、基礎文法を自然に身につけていきました。
Bランク問題で実践力を養う
基礎が身についてきた段階で、より難易度の高いBランク問題に挑戦しました。
複雑なロジックを組み立てる問題に取り組むことで、実際の開発に必要な問題解決力を養うことができました。
Webアプリ開発の基礎：Spring BootとVue.jsを学ぶ
Spring Bootでバックエンド構築
Javaの基礎を学んだ後、Spring Bootを使ったWebアプリケーション開発に進みました。
MVCモデルに基づき、リクエストを受け取るコントローラー層、ビジネスロジックを担当するサービス層、データベースアクセスを行うリポジトリ層に分けて設計する考え方を学びました。
ネット上の無料チュートリアルを参考に、簡単なREST APIの作成にも取り組み、
Webアプリケーション全体の流れを少しずつ掴んでいきました。
Vue.jsでフロントエンド開発
フロントエンド開発では、Vue.jsを使用。
コンポーネントベースのUI設計を学び、ページ遷移のないシングルページアプリケーション（SPA）の作成に取り組みました。
また、バックエンドとデータをやりとりする方法も学び、
データの取得・登録の基本的な流れを理解することができました。
バージョン管理：GitとSourceTreeを学ぶ
Gitの基本操作を学習
Spring BootとVue.jsの学習が進んだ段階で、Gitの学習に入りました。
ネット上の無料教材を活用しながら、コミット、プッシュ、プルといった基本操作を理解。
「なぜバージョン管理が必要なのか？」という背景から学び、チーム開発に備えました。
SourceTreeでブランチ管理を実践
Git操作に慣れるため、SourceTreeというGUIツールを使用。
コマンドを使わず、視覚的にブランチを作成・切り替え・マージする流れを体験しました。
実際の開発では、各自でブランチを切って開発し、機能ごとにコードを管理・統合する流れを実践できました。
実践：社内システムへの機能追加開発
資格登録画面の開発
研修の最後には、社内システム（Spring Boot＋Vue.js）への機能追加に挑戦しました。
開発したのは、社員の資格情報を登録・管理する画面です。
- バックエンド（Spring Boot）：資格情報を保存・取得するAPIを作成
- フロントエンド（Vue.js）：登録フォームの作成、バリデーション実装、資格一覧の表示
初めて本格的な開発フローを体験し、非常にやりがいを感じました。
苦労したポイントと学んだこと
特に苦労したのは、バリデーションやエラー処理の実装。
また、バックエンドとフロントエンドのデータ連携（API設計）にも悩みましたが、自分で調べながら進める習慣が身についたことは大きな収穫でした。
研修を通して得たこと
- 基礎を固めた上で、段階的に実践へ進む大切さを実感
- フロントエンドとバックエンドの両方の視点からWebアプリケーションを考えられるようになった
- チーム開発で必要なGitの基本操作とブランチ運用も身についた
- わからないことを調べて解決する力が強化された
まとめ
3ヶ月間の研修を通じて、未経験の状態からWebアプリケーション開発に必要な基礎力を身につけることができました。
基礎学習 → 演習 → 実践とステップアップしていく流れは、学びを深めるうえで非常に効果的でした。
これから研修に臨む方は、焦らずに一歩ずつ着実にスキルを積み上げていくことが大切だと思います。
