【無料講座】初心者向けWebエンジニア養成講座はこちら

JavaScriptフロントエンド編

リンクが無い学習コンテンツに関しては「Front Hacks」にて公開しております^^

「約350本以上の解説動画(エクササイズの解説動画含む)」「スライド解説」「質問無制限」という内容で学習サポートをしております^^
(学習コンテンツは今後も随時追加予定)

DOM操作

  1. 【JavaScript】DOMとは
  2. 【JavaScript】HTMLの特定の要素(DOM)を取得する
  3. 【エクササイズ】JavaScriptでHTMLの要素を取得する
  4. 【JavaScript】DOMのテキスト内容を取得・変更する
  5. 【JavaScript】DOMに属性値をセットする
  6. 【エクササイズ】JavaScriptでDOMの文言・属性値を変更
  7. JavaScriptで新規作成したDOMを別のDOMに追加する
  8. JavaScriptで特定の要素を削除、子要素を全削除する
  9. 【エクササイズ】DOMの新規作成・追加・削除・全削除をする【JavaScript】
  10. 【JavaScript】DOMをクリックしたときの処理を実装する
  11. 【JavaScript】DOMを使って入力ボックスの値を操作する
  12. 【エクササイズ】DOM操作をしてTodoリストを作成する【JavaScript】

非同期処理

  1. 【JavaScript】コールスタックとは【関数実行の順番を理解する】
  2. 【JavaScript】非同期関数を含む処理の流れ【キューとは】
  3. 【JavaScript】setTimeoutを使った非同期処理
  4. 【エクササイズ】setTimeoutが実行される順番の理解をする【JavaScript】
  5. 【JavaScript】Promiseで非同期を実装するメリット
  6. 【JavaScript】Promiseオブジェクトを作成する
  7. 【JavaScript】Promiseのthenメソッドの使い方
  8. 【JavaScript】Promiseのcatchメソッドの使い方
  9. 【エクササイズ】Promiseを使ってTodoアプリを作成する【JavaScript】
  10. 【JavaScript】fetchを使って外部データを取得する
  11. 【エクササイズ】fetchで取得したクイズデータを一覧表示する
  12. 【エクササイズ】Fetch APIを使ってクイズアプリを作る
  13. JavaScriptのasyncとawaitの概要【Promiseの発展系】
  14. 【JavaScript】asyncとawaitの使い方【サンプルコード付き】
  15. 【JavaScript】async/awaitでの例外処理の方法
  16. 【エクササイズ】async/awaitを使ってクイズアプリを作る

じゃんけんゲームを作る

準備中…

「【初心者向け】じゃんけんゲームを作りながら覚えるHTML&JavaScript」の内容をステップ形式で学習して、最終的に課題として「じゃんけんゲーム」を実装する予定。

お絵かきアプリを作る

準備中…

以下3つの内容をステップ形式で学習して、最終的に課題として「お絵かきアプリ」を実装する予定。

  1. 【初心者向け】HTMLのcanvasとJavaScriptでお絵かきアプリ作る【最低限の機能実装編】
  2. HTMLのcanvasとJavaScriptでお絵かきアプリ作る【カラーパレット・消しゴム機能追加編】
  3. 【最終章】HTMLのcanvasとJavaScriptでお絵かきアプリを作る【線の太さ変更・太さインジケーター実装編】
【3つの特典付き】Webエンジニアに必要な基礎スキルを体系的に効率良く身につけたいですか？

LINE登録で無料特典を受け取る

次のような方向けに、学習をサポートするコンテンツを無料プレゼントしています。

  • Webエンジニアになりたいけど何から学習を始めれば良いかわからない
  • 今まで独学で頑張ってきたけど、独学に限界を感じてきた
  • プログラミングは出来るけど、大きめのコードが書けない

「プレゼント詳細が知りたい」「プレゼントを受け取りたい」といった方は、以下のボタンをクリックして詳細ページをご確認ください。

無料特典を受け取る