
一度で終わらせるJavaScript: バニラJavaScriptでSPA開発まで
hyobin
基本文法から応用概念まで学習しながら、バニラJavaScriptでSPAを開発してみましょう🔥
초급
JavaScript, SPA, DOM
ウェブフロントエンド開発者を目指すなら? 面白いJavaScript講座で第一歩を踏み出してみましょう✨

JavaScript を学ぶべき理由
ウェブ開発に関する基本概念
実務でよく使われるJavaScriptの文法
実際に使用できるプロジェクト開発
Typescript、React.js、Next.jsを学習するための足がかり
JavaScriptの第一歩で
基本概念からWebページ制作まで🚀
「ウェブフロントエンドのためのJavaScript入門」講座が受講生の皆様から多くの愛を受け、
「JavaScript入門」という名前の書籍として発売されました 🙇🏻♀️
講座の内容を収録した書籍ですので、講座を受講される際に参考書としてお読みいただいても良いと思います :)
受講生の皆様に感謝申し上げ、多くのご関心をお願いいたします。
JavaScript(ジャバスクリプト)は世界的に人気のある言語で、実際に多くの企業で使用されているプログラミング言語です。現在ウェブフロントエンドで最も多く使われているReact、Vue、NextなどのライブラリやフレームワークもすべてJavaScriptベースで、JavaScriptを学ぶことで柔軟に使用できるようになります。
基礎から応用文法まで
簡単に学習
講義で使用したすべての講義資料を提供
色々なプロジェクトを直接開発まで
フロントエンド開発の基本となるJavaScriptを
基礎から応用概念まで丁寧に学習したい方
開発初心者、非専攻の方まで聞けるように
Kindで詳しく説明いたします。(講義台本ウェブページも提供いたします。)
Todo Listのようなありふれたプロジェクトではなく、
「自分だけのChrome開始画面」を直接開発して実際に使用まで体験できます。
単純に言語と文法だけを学習する講義はもうやめましょう!
JavaScriptの基礎、応用文法と共にJavaScriptを学ぶべき理由、JavaScriptの動作原理、
JavaScriptでWebプログラミングをする方法について段階的に着実に学習し、学んだ内容を適用して実際に使える実戦プロジェクトを開発しながらJavaScriptを効果的に学習してみましょう。
.gif)
ウェブフロントエンドのためのJavaScript入門講座は...
ウェブフロントエンドのためのJavaScript第一歩受講生の皆さんの実際の受講後レビューです。
🧑🎓
視覚資料がきれいで、講師の方の伝達力が良いです。要点を明確に説明してくださったので、復習用としても聞きましたが良かったです!講義資料も提供してくださったので、学習した内容を整理するのに役立ちました!良い講義をありがとうございます
👩🏻💻
きれいなppt、理解がすっと入る例示、無駄なく必要な機能を教えてくれる最高の講義だと思います!!ヒョビンさんの講義が1つしかないのが一番残念ですね、他の講義も作ってください :)
🙆♂️
講義の内容が頭にすっと入ってきます。他の講義は正直退屈だったり集中できないことが多く、見ていてもぼーっとしてしまうことがあったのですが、この講義は継続して集中して見て実践することができますね。該当技術に対する背景知識がないにも関わらず楽しく講義に集中して見ることができるのを見ると、先生の伝達力がとても優れているようです。良い講義を作ってくださってありがとうございます。
🕵️♀️
一人で勉強していてよく理解できなかった内容が、講義を聞きながらすっきりと理解できています。特に難しくなりがちなJavaScriptの用語と概念をサンプルコードと一緒に分かりやすく説明してくださるのでとても良いです。react、vue.jsなどを学ぶ前に必須で受講すべきだと思います!JavaScript上級コースの講義もあればいいなと思います😍
Section 1. JavaScriptはなぜ学ぶべきなのか?
JavaScriptとは何の言語でしょうか?なぜ人気があり、多くの企業で使用されているのでしょうか?
JavaScriptを学ぶべき理由についてお教えします。
Section 2. JavaScriptを始めよう
まず、JavaScriptがどこでどのように動作するかについて学びます。
その次に、誰でも簡単に使えるオンラインエディターで様々なサンプルコードを一つずつ見ながら、JavaScriptの基本概念について詳しく学ぶ予定です。
Section 3. JavaScriptの応用
前のセクションで学んだ内容より少し難しい応用概念を様々な視覚資料と共に学びます。必須の概念だけを厳選して身につけた後、JavaScriptで重要な概念である非同期処理まで詳しく学ぶことができます。
Section 4. DOMとDOM API
ウェブページを操作するDOMというオブジェクトについて詳しく学びます。ライブコーディングを通じて一緒にJavaScriptの様々なDOM APIを一つずつ使ってみることができます。よく使われるDOM APIを中心に使ってみながら、多様な方法でウェブページを操作してみます。
Section 5. プロジェクトの準備
「自分だけのChrome開始画面」を作る時に必要な追加的な概念を事前に詳しく学ぶ時間を持ちます。必要な概念を事前に詳しく学んでから進むため、次のセクションで大きく困ることなくプロジェクトを開発することができます。
Section 6. プロジェクト:自分だけのChrome開始画面

セクション1から5まで学んだ内容をすべて活用して「自分だけのChrome開始画面」を開発します。
すでに学んだ内容であっても一つずつ再度確認しながらゆっくりと開発するため、プロジェクトを開発すると同時に学んだ内容を復習することもできます。最後には開発したプロジェクトを実際に使用できるよう一緒に設定まで行う予定です。
Bonus. 必ず知っておくべきCSS
JavaScriptについて学ぶ講義ですが、セクション6でプロジェクト開発のために使用されるCSSの中で最もよく使われ、知っておくと良い二つの属性について学ぶことができます。
すでにCSSを上手く扱えるなら、該当セクションは聞かなくても大丈夫です。
Q. プログラミングを初めて触れるのですが、受講しても大丈夫でしょうか?
はい。本講義はプログラミングを初めて触れる方でも受講できるほど、JavaScriptの様々な概念を詳しくKindに説明する講義ですので、難しくなく受講していただけます。講義で使用されるPPTと台本まですべて無料で提供されるため、学習資料と一緒に講義を受講されると、講義内容を理解するのにとても役立つでしょう。
Q. HTMLとCSSの知識がなくても大丈夫でしょうか?
HTMLとCSSはセクション5〜6でのみ必要な知識です。HTMLコードとCSSコードを別途提供するため、HTMLとCSSを知らなくても問題なくJavaScriptを学習していただけます。
さらに、HTMLの場合、コードを一行ずつ書くたびに、そのコードがどのような機能をするのかを簡潔に説明してから進むため、大きな困難なく付いてくることができ、CSSは概念説明が必要な属性は[付録]セクションで別途詳しく扱います。そのため、必要な方は該当セクションを先に受講してから講義を受講していただければ、困難なく付いてくることができます。
Q. 講義を最後まで受講した後は、何を勉強すべきでしょうか?
ウェブフロントエンド開発者になるために講義を受講されたなら、まず最終プロジェクトである「自分だけのChrome開始画面」を自分で作ってみることをお勧めします。今後はJavaScriptをもう少し深く、難しい概念まで勉強してみたり、React.jsやVue.js、Next.jsなどJavaScriptベースのライブラリやフレームワークを学習してみても良いでしょう。
💾 受講前にご確認ください!
学習対象は
誰でしょう?
プログラミングを初めて学ぶ方々
一風変わったプロジェクトを完成させたい方々
フロントエンドエンジニアを目指す方々
JavaScriptを速く確実に学びたい方々
丁寧な説明のJavaScript講座をお探しの方々
講義を講義資料とともに受講したい方々
JavaScriptの基礎が不足している方々
前提知識、
必要でしょうか?
CSS (セクション6でのみ必要な概念です)
HTML(セクション6でのみ必要な概念です)
11,172
受講生
269
受講レビュー
120
回答
4.9
講座評価
8
講座
안녕하세요 김효빈 입니다 😊
프론트엔드를 희망하는 분들을 위해 쉽고 친절한 강의를 제공하고 있습니다.
(현) 프론트엔드 개발 강사
(전) 스타트업 프론트엔드 리드 개발자
웹 페이지
온라인 강의
도서
외부활동
udemy, codeit, 한양여자대학교 등 특강 진행
全体
42件 ∙ (6時間 47分)
講座資料(こうぎしりょう):
4. JavaScriptを学ぶべき理由
06:05
7. 変数と定数
08:06
8. データ型と型変換
10:02
9. 演算子
10:17
10. 条件文
05:22
11. 関数とローカル変数、外部変数
10:24
12. スコープ
07:56
13. ホイスティング
06:18
14. 関数式
05:12
15. オブジェクト
15:07
16. 配列
10:54
17. 繰り返し文
18:14
18. 配列組み込み関数-1
20:31
19. 配列内蔵関数-2
15:12
全体
89件
4.8
89件の受講レビュー
受講レビュー 2
∙
平均評価 5.0
5
入門者のためのJavaScript講義の中で最もフレンドリーで詳細な講義ではないかと思います。 細かい概念も正確にわたって渡してくださり、しかもすべてのコードを詳しく説明していただき、別途グーグルなしで受講できる良い講義だと思います。 1. 視覚資料が非常に直感的でかなりです。 2.正確な辞書で眠くないで聞くのはとても良いです! 3. 普通の文法だけを学んで終わる講義が多いが、学んだ内容を応用して実用的なプロジェクトを作る過程がとても印象的です。
チョンファンありがとうございます😀
受講レビュー 1
∙
平均評価 5.0
5
**自退生もコーディングできるという希望を与えた講義** コムボール入学後、教授もあきらめたたわごと この講義が救済してくれました。 本をいくら見ても何の言葉なのか理解できなかったのに不思議に字幕なしでも頭にすっぽり入ってきますね 私のように目の高さの講義が必要な方に積極的におすすめします!
ハンソル様に私の講義が役に立ったようで本当に嬉しいです😃一生懸命聞いてくれてありがとう!
受講レビュー 1
∙
平均評価 5.0
5
JSとフロントを学びたいので、その講義を受講しました。該当講義は非専攻者も内容を十分に理解できるように文法などを詳しく説明してくれますね。また、実務に基づいてアドバイスする点や実際のプロジェクト単位の実装などまでカリキュラムに含まれており、個人的に非常に満足していました。私のように、Webフロント開発が未熟な入門者や興味のある方は、明らかに能力が一段階成長したことを感じられる講義だと思います。
wlsdyd620さん、私の講義を通して一段階成長してたなんて講義を制作したやりがいそうです😃頑張ってくれてありがとう!
¥4,233
知識共有者の他の講座を見てみましょう!
同じ分野の他の講座を見てみましょう!