JavaScriptフロントエンドエンジニア研修(React)UIの優れたアプリケーションの実装スキルが身につく
フロントエンドエンジニア研修では、Webサイトのコーディングに必要なHTML/CSSとJavaScriptについて学習するフロントエンドエンジニア基礎研修の内容に加え、JavaScriptライブラリのひとつであるReact.jsや、ソースコード管理を行うGitの活用方法を学習。UIの優れたWebサイトやWebアプリケーションの構築ができるようになります。
フロントエンドエンジニアとして必要なスキルを一通り身につけることができるため、自社サイトのコーディングやディレクションを担当する方が本研修を受けることで、WebサイトやWebアプリケーションの品質を高めることができます。
※Vue.jsを中心に学習したい方は「フロントエンドエンジニア研修(Vue)」をご覧ください。
期待できる効果
- 高品質なコードでWebサイトが構築できるようになる
- React.jsによる高品質なUIやWebアプリケーションの実装ができるようになる
- SEOの観点でのソースコードの品質管理ができるようになる
- SEOを考慮しないコーディングしており、ソースコードの質が低かった
- Webサイトの更新や機能実装を外注に依存しており費用や時間がかかっていた
- JavaScriptフレームワークを活用した機能の実装ができなかった
- SEOやモバイルでの高速表示を考慮したコードが書けるようになった
- 自社内でWebサイトの更新やJavaScriptなどの機能実装が素早くできるようになった
- React.jsやNext.jsを活用した機能実装できるようになりUIの質が上がった
フロントエンドエンジニア研修(React.js)の特徴
-
特徴1実務に直結するスキルが身につく
研修では、実際にWebサイトの設計やコーディングの演習をするので、研修後も実務に活用することができます。
-
特徴2研修のカスタマイズができる
貴社の業務上の課題感や目的に合わせて、カリキュラムや研修スケジュールを柔軟にカスタマイズできます。お気軽にご相談ください。
-
特徴3研修の成果が確認できる
学習管理システム(LMS)での進捗管理はもちろん、日報、理解度テストの結果、開発した成果物など、様々な角度から研修効果を測定できます。
研修カリキュラム
フロントエンドエンジニア研修(React.js)では、Web標準に沿った正しいHTML/CSSを学習するのはもちろん、実際にWebサイトの設計やコーディングの演習を通じて実践的なスキルを身につけます。また、本研修ではReact.jsや関連技術であるNext.js、Firebaseとの連携についても学習し、UIに優れたWebアプリケーション実装についても学習します。
制作演習を通じて、正しい文書構造でコードを記述するセマンティックコーディングやモバイルファーストを考慮した軽量なコーディングを学び、SEOにも強いWebページ構築スキルから習得します。
その後、React.jsについて学習。開発環境の準備からSPA(Single Page Application)の開発演習、Next.jsによるアプリケーションの機能拡張、Firebaseを用いたデータベースとの連携方法まで学習し、開発の実践で求められるスキルを身につけます。
また、Gitによるソースコードの管理についても学びますので、フロントエンドエンジニアとしての実務はもちろん、ディレクターが外注先のエンジニアとのやり取りする際にスムーズなプロジェクト進行ができるようになります。
- Webサイトのコーディングを担当する方
- 自社サイトの更新を担当する方
- ディレクターとしてWebサイトの品質管理を行う方
- Webサイトの更新を担当する社員にWeb標準のコーディングスキルを学ばせたい
- SEOに強くUIにも優れたWebサイトを構築することでユーザーの満足度を高めたい
- コーディングを外注する際の品質管理や、日々の更新がスムーズにできるようになりたい
項目 | 内容 |
---|---|
Web概論・HTML基礎 |
|
ハイパーリンクとマルチメディア |
|
フォーム |
|
セマンティックコーディングとWeb制作フロー |
|
CSS基礎 |
|
CSSレイアウト |
|
HTML構築(Dreamweaver/VSCode) |
|
CSS構築(Dreamweaver/VSCode) |
|
メディアクエリ・Webフォント・CSSアニメーション |
|
JavaScript基礎1 |
|
JavaScript基礎2 |
|
jQuery |
|
項目 | 内容 |
---|---|
企画・デザインカンプの作成 |
|
モバイルサイトの企画・設計 |
|
モバイルサイトの構築方法と高速化 |
|
レスポンシブWebデザイン1 |
|
レスポンシブWebデザイン2 |
|
制作実践1 |
|
制作実践2 |
|
ソースコードの検証とモバイル最新技術 |
|
項目 | 内容 |
---|---|
開発環境の設定と最新の記法 |
|
デバッグとオブジェクト |
|
制御構文・正規表現・例外処理 |
|
イベント・JavaScriptのクラスとオブジェクト |
|
jQueryによるアニメーション作成 |
|
Ajaxの基本 |
|
制作実践2 |
|
jQueryを用いたAjax |
|
HTML5とCanvas |
|
項目 | 内容 |
---|---|
Reactの基本を理解する |
|
クラスコンポーネントとJSX |
|
関数コンポーネントとフック |
|
Next.jsによる機能拡張 |
|
API利用とネットワークアクセス |
|
Firebaseとの連携 |
|
項目 | 内容 |
---|---|
Gitの概念と初期設定 |
|
Gitの基本操作 |
|
リモートリポジトリ |
|
ブランチ |
|
コンフリクト |
|
時間数・日程
76時間
※カリキュラム内容や時間数のカスタマイズができますので、お気軽にご相談ください。
※開催日程は貴社のご要望をお伺いしご提案いたします。
料金体系
受講者数や時間数に応じて変動します。また、カリキュラム内容のカスタマイズや講師派遣などのご要望に応じて変動いたします。ご予算にあわせてのご提案もできますので、お気軽にお問い合わせください。
デジタル人材育成・研修について相談する受講形式
インターネット・アカデミーの研修は、さまざまな形式に対応しています。「基礎はeラーニングで演習は集合研修」「講師派遣とリモートを組み合わせる」など、複数の形式の併用もできますので、お気軽にご相談ください。
Web開発会社の開発・マネジメントのノウハウをカリキュラム化現場の実務が研修で学べる
インターネット・アカデミーのグループ会社ではWeb開発・Saasサービスを手掛けています。実務で用いられている開発ノウハウをカリキュラム化し、研修で還元しています。
理解度チェック・アセスメントなど学習効果を可視化できる学習管理システム(LMS)
インターネット・アカデミーの学習管理システム(LMS)では「研修後の知識定着度を可視化したい」「社内報告のためのアセスメントがほしい」など、研修担当者の悩みにこたえる機能を搭載。学習の進捗管理から、さまざまな角度からの研修効果測定が行えます。
Web制作系の研修を受けた企業からのコメント
研修を経てWeb独自の制作の流れを理解することができたので、現在では明確に役割分担をして、制作の精度を高めつつ、チーム全体のスピードアップを図ることまでできるようになりました。それから、これまで社内の企画担当者の希望に近づけること優先でコンテンツ作成していたのが、Webに対する知識が増えたことで、より良いものを素早く作るための提案やリードができるようになりました。
インタビューを見る
研修とITコンサルティングの当面の成果目標としては、弊社のWebサイトを内製化し、リニューアル公開することにありました。まずはWebサイトの制作を行うプロジェクトチームメンバーが、業務を行う上で必要なスキルを身に着けるべくインターネット・アカデミーに通って講座を受講しました。
インタビューを見る
実際にReactを使ったハンズオンを積極的に行ってくださったことや各受講者のスキルや理解度に応じてカリキュラムを進めてくださることがとてもよかったです。またスキルだけでなく、受講者それぞれの性格も考慮して研修してくださっていたので、質の高い研修でした。
インタビューを見る
助成金で費用負担を軽減
インターネット・アカデミーのIT研修では、要件を満たすことで厚生労働省の人材開発支援助成金が利用できます。研修費用に対する経費助成と、受講中の賃金に対する賃金助成の両方が支給されます。
この助成金制度ではいくつかのコースが用意されており、研修目的に合わせて使用できる制度をご提案いたします。
経費助成 | 賃金助成 | 年間限度額 | |
---|---|---|---|
中小企業 | 75% | 960円(1人1時間) | 1億円 |
大企業 | 60% | 480円(1人1時間) | 1億円 |
経費助成 | 賃金助成 | 年間限度額 | |
---|---|---|---|
中小企業 | 45% | 760円(1人1時間) | 1000万円 |
大企業 | 30% | 380円(1人1時間) | 1000万円円 |
助成金を使った研修の事例紹介や、貴社が研修を行った場合に支給される助成額シミュレーションも承っています。お気軽にご相談ください。
助成金について相談するIT研修・DX人材育成についてのご相談
IT人材育成に精通したコンサルタントに無料でさまざまな相談をしていただけます。お気軽にご相談ください。
- 人材育成計画を立てるために人材育成の事例などをとりあえず聞きたい
- 助成金の使い方や、支給額のシミュレーションを知りたい
- 自社の業務や受講者のレベルにあったカリキュラムを提案してほしい