JavaScript/jQueryを使っていますが「コードを学習」することではなく
「 応用力 」「 創り上げる力 」 を学べるようにしてるのがポイントです。
応用実践トレーニングの内容( 必ず読んで進んでください )
内容は 「基礎を学んだ」レベルに合わせています。
JavaScriptの「超基礎」のところはプロゲートなどで見ていただくと良いかと思います。
そういった教材で「自分で考えて作れるようにならなかった人」が対象です。
「変数・分岐処理・繰り返し処理・関数・オブジェクト...」を応用できるようにするための教材として作りました。
他の学校、提携校の皆さんもご活用ください！
「学び方・作り方・考え方」全て揃っています！
◆JavaScript初学者「効率よく学ぶためのポイントを紹介」準備編
| サムネ１ | サムネ２ |
|---|---|
 |
 |
| タイトル | 動画🔗 |
|---|---|
| 「プログラミング 究極の学習法」 | https://youtu.be/8FpFWRatdNc |
| 「効率よく学ぶ３つのポイント！」 | https://youtu.be/-oq87SQZKfg |
| 「正しい時間の使い方」 | https://youtu.be/AdjP8pYa70sg |
◆JavaScript初学者「小さいアプリを沢山作る」トレーニング編
「変数・配列・繰り返し・オブジェクト...」の理解と応用能力を上げるトレーニング
| サムネ１ | サムネ２ |
|---|---|
 |
 |
| タイトル | 動画🔗 |
|---|---|
| 「抽選アプリ」を作って楽しく学ぶ！（サンプルあり） | https://youtu.be/V5KCKbBo000 |
| 「Todoアプリ」作って楽しく学ぶ！（サンプルあり） | https://youtu.be/PfV0Cus6jhw |
| 「アラーム機能を作る」作って楽しく学ぶ！ | https://youtu.be/OgV2cAg3Q8E |
| タイピングソフトを作ろう！（前編） | https://youtu.be/gRde88oundY |
| タイピングソフトを作ろう！（後編） | https://youtu.be/Cqu6Zuj24wo |
| メモ帳アプリ作りたい人「30分」で完成 | https://youtu.be/Bq80O4hix4s |
| 「パスワード生成アプリ」 作って楽しく学ぶ！ | https://youtu.be/bS3o91vY0Fo |
| 「席決めアプリ」作って楽しく学ぶ！（サンプルあり） | https://youtu.be/aDRDRd_BR2s |
| 「40分で天気アプリを作る」Ajaxと作り方を学ぶ（OpenWeatherApi） | https://youtu.be/4m1vXYwfRJI |
| 「Book検索アプリ」Ajaxと作り方を学ぶ（サンプルあり） | https://youtu.be/Yo0gz7DN2xM |
| 「Chatアプリ（Firebase RDB version9 対応） | https://youtu.be/v2ILwppYXhY |
| 40分でFirebase/Google認証を解説（Firebase RDB version9 対応） | https://youtu.be/D47A-t_Ng5s |
| JSONが「完璧」に理解できる動画！ | https://youtu.be/67lgE8o-lwA |
| 「めちゃ解る！アルゴリズム授業１」（サンプルあり） | https://youtu.be/5hApch5oV3E |
| MAP API 使うならこのライブラリが最強！！ | https://youtu.be/CZG2ynZrbzg |
◆JSで「File API」を使い画像を操作するトレーニング編
| サムネ１ | サムネ２ |
|---|---|
 |
 |
| タイトル | 動画🔗 |
|---|---|
| 基本：画像サイズ取得・画像プレビュー（サンプルあり） | https://youtu.be/Zi1Kvsd_R_g |
| 応用：画像サイズ取得・画像プレビュー（サンプルあり） | https://youtu.be/g3Drrzu6HkQ |
◆【限定公開】クラスを理解し「ライブラリを作る」思考をトレーニング編（中級）
限定公開中ですが、一応 紹介しておきます。
| サムネ１ | サムネ２ |
|---|---|
 |
 |
| タイトル | 動画🔗 |
|---|---|
| 『クラス入門』丁寧に解説！（サンプルあり） | https://youtu.be/r6jJpBZkRRc |
| 限定公開：『ライブラリの作り方！』jsライブラリを作りながら仕組みを知る | https://youtu.be/UPNQRrVTAgo |
◆「Chromeデベロッパーツール・全て学べる」トレーニング編
HTML/CSS/JavaScripを使った制作には「Chromeデベロッパーツール」は必須スキルです！
デザインの調整、他サイトの構造見たり、エラーの確認、デバッグ等で良く使います。
| サムネ１ | サムネ２ |
|---|---|
 |
 |
デベロッパーツールは奥が深いので、最初は「#1,#2」だけをおススメします
| タイトル | 動画🔗 |
|---|---|
| #1「 Elements/Console 」 | https://youtu.be/PjZyPfXdJFA |
| #2「 デバッガ― 」 | https://youtu.be/TXi5g4J17ds |
| #3「 ブラウザ機能 （中級レベル）」 | https://youtu.be/DsHhKs9V03o |
| #4「 Lighthouse（中級レベル） 」 | https://youtu.be/srayKfhg5Ho |
| #5「 セキュリティ＆ネットワーク機能（中級レベル） 」 | https://youtu.be/Sn1oaEJwt0k |
| #6「 CSSアニメーション検証機能（中級レベル） 」 | https://youtu.be/zICHhUf6-Nw |
| #7「 新機能"Recorder"を使って操作記録を残せ 」 | https://youtu.be/4iH16Qj0j80 |
| #8「 CSSチェックに最適＆その方法 」 | https://youtu.be/-bFnYXquDjU |
| #9「 Chrome最新情報のキャッチアップ方法 」 | https://youtu.be/SsVeZdwzbzk |
| ※この段階で100％理解はいりません。50％くらいの理解で「そんな機能あるのか」でOKです。 | |
| 必要になれば自然と使いだします。その時に覚えていけばOKです。 |
おススメ動画
TailwindCSS入門～学習動画リスト～
PHP【クラス入門】フレームワーク学ぶ前に～学習動画リスト～
役立ちましたか？
チャンネル登録・フォロー・SNSでの拡散も是非お願いいたします。
Twitter : https://twitter.com/daisu_yamazaki
Youtube： https://www.youtube.com/@osozaki
今後も講義動画増えたら、こちらを更新していきます。
以上