Vue3完全マスター:基礎から実践まで - 「基本編」

Vue.js 3でウェブ開発ができるよう、公式ドキュメントに基づいてVue 3の仕様を詳しく、かつ深く掘り下げて解説します。

難易度 初級

受講期間 無制限

Vue.js
Vue.js
Vue.js
Vue.js

学習した受講者のレビュー

学習した受講者のレビュー

4.9

5.0

design

100% 受講後に作成

1.5倍に聞いてもレッパーに劣らない充実内容と正確な発音でとても分かりやすく説明するのが良かったです。たくさん助けました

5.0

kimjuno97

100% 受講後に作成

npm trendsで11月~12月の間にvueダウンロード数がリアクトの3倍程度を超えたが、 その講義はvue3入門に本当にたくさん役立つようです!

5.0

박상우

100% 受講後に作成

既存のリアクトで1年間プロジェクトを進め、最近離職しながらVueを使用するようになり講義を聞くようになりました。以前に聞いた講義も良かったのですが、その講義を聞きながら内容がとてもよく、必要な部分だけがよく収められたと思いました。私が聞いた講義の中で一番良かったと思います。

受講後に得られること

  • Vue3 Composition APIs

  • Vue3コンポーネントの基礎から応用まで!

  • Viteでプロジェクトを始める

  • <script setup> 構文と通常の <script> の違い

  • 英文の公式ドキュメントに基づき、基礎から深く掘り下げます。

まずは基本編でVue.js 3を簡単に学び、
実践編で詳しく、深く学んでみましょう! 🎵

最新 Vue 3 完璧ガイド ローンチ 🎤

Vue3 完璧マスター:基本編または実践編のいずれかを受講済みであれば、
「最新 Vue 3 完璧ガイド」講座を無料で視聴できます。




ジムコーディングならではの方法で
分かりやすくお教えします 🥴


本講座はVue.js 3でウェブアプリケーションを作成するための講座で、
新しく登場した Composition APIをベースに講義を進めます。
公式ドキュメントに基づき、知っておくべき内容を漏れなく扱いながらも、
分かりやすく、詳しく、深く内容を扱います。


二つのパートに分かれた

講義を紹介します ✌

最初、講義を企画した際は一つの講義として制作しようとしましたが、

  • 公式ドキュメントにある必ず習得すべきVue.js 3のスペックを漏れなく 盛り込んでカリキュラムを構成したいと考え、
  • Vue.js 3を 単に文法だけをお伝えするのではなく、最大限慣れていただけるよう 多様な内容で構成したいと考えました。
  • Vue 3がComposition APIベースで登場したことで、コアライブラリまで扱いたいと考え、
  • すでにVue 3をご存知の方も、実践編の講義内容を合理的に受講できるように、
    2つの講義に分けて制作することになりました。

そこで、
基本編では💁‍♂️





Vue.js 3を初めて接する方のために、公式ドキュメントに基づいてVue.js 3の最新文法を学習することに集中しました。そして、大まかな講義内容は次の通りです。

  • HTML、CSS、JavaScriptがコンポーネントベースのVue.jsウェブアプリへと 変化する過程
  • Options API VS Composition API の違い
  • Viteでプロジェクトを始める
  • ESLint Prettier 設定
  • 公式ドキュメントの最新スペックを反映した Composition API 文法
  • Vue.js 3 コンポーネントの基礎から応用まで
  • <script setup>と通常の<script>の違い


Bootstrap UI フレームワーク 💻


ボーナスとして、本講座ではBootstrapを使用し、公式ドキュメントから目的のコンポーネントを探して使用する方法を実演します。この過程を通じて、自然とBootstrapの使い方もボーナスとして習得することができます :)


よくある質問 Q&A 💬

Q. Web開発の知識がない状態でWebサービスを作りたいのですが、どうすればいいでしょうか?

この講座は、HTML、CSS、JavaScriptの基礎を理解している状態で受講するのに適した講座です。

  • HTML / CSS 講座 Click!
  • JavaScript講座クリック Click!
  • フロントエンドに翼を授ける Click!

Q. 講義ソースは提供されますか?

講義ソースは本講義を受講すればダウンロードでき、基本編のソースはGithubでも提供されています。

Q. Vue.js 2または3を使用していますが、基本編も受講すべきでしょうか?

  • もし現在Vue.js 3の文法をご存知であれば、[実戦編]をお勧めします。
  • もし現在Vue.js 2を使用されているのであれば、[基本編]、[実践編]の両方をお勧めします。
  • Vue.jsを初めて接する方なら、ぜひ[基本編]、[実戦編]の両方を見ることを強くおすすめします。
  • その他、個人的な違いについては、カリキュラムをじっくり確認した上で判断していただければと思います。 🙂

Q. 講座を受講した後は、どのようなことが得られますか?

Vue.js 3だけでなく、Vue RouterやPiniaといったコアライブラリを学ぶことができます。
ボーナスとしてBootstrapのスキルまで身につけることができます。


講師を紹介します ✒️

YouTubeとInflearnで"Vue&Vuetify Adminサイト制作"講座をローンチし、ありがたいことに多くの方々から素晴らしいフィードバックをいただきました 😃

  • [Vuetify Admin サイト制作 - "基本編"(無料)] 受講生合計 1,313名評価 4.9
  • [Vuetify Admin サイト制作 - "実践編"(有料)] 受講生合計 441名評価 5.0

2021年からVue.js 3の講義を希望されていた方々がいらっしゃいました!そして私も、Vuetifyの講義の質問の中で、Vue.jsやNPM、Webpackといったフロントエンド関連の知識をまだよくご存知ない方が多いと感じていました。そのため、講義を撮らなければと考え続けてきましたが、ようやくVue.js 3が公式バージョンとして定着したと感じたので、PPTや教本など最善を尽くして準備しました。
私が運営しているジムコーディングYouTubeチャンネルでは、フロントエンド、バックエンドだけでなく、AWSインフラなどウェブサービス制作全般のコンテンツをお届けする予定です。
たくさんの関心と応援をお願いいたします。ありがとうございます。

実用的なコーディングコンテンツを作っていくYouTube ジムコーディングチャンネルです。
YouTube | GitHub | Gymスタグラム | Codingスタグラム

こんな方に
おすすめです

学習対象は
誰でしょう?

  • フロントエンドエンジニアを目指している方

  • 素晴らしいウェブアプリケーションを作りたい方

  • 公式ドキュメントに基づいて、じっくり丁寧に学びたい方

前提知識、
必要でしょうか?

  • HTML、CSSの基礎

  • JavaScript 基礎

  • ジムコーディング フロントエンドの翼を広げる

こんにちは
gymcodingです。

31,179

受講生

2,068

受講レビュー

1,052

回答

4.9

講座評価

18

講座

こんにちは。
コーディング教育クリエイターのジムコーディングです 😊

非開発者の方でもついていけるように
最大限わかりやすく、最大限充実した内容で説明いたします。

常に受講生の立場で考える
コーディング教育クリエイターになります。


🏆 インフラン Awards 2025 ベストセラー受賞 (React完璧マスター)

🔥 インフラン 2025 今最もHOTな講義に選定 (Claude Code 完璧マスター)

📺YouTube | 登録者4万人以上 無料講義

💻ジムコーディングクラブ | 全講義 & 無料教材

🐙GitHub | サンプルソースコード

📷Instagram | 日常 & 役立つ情報

🧵スレッズ | 開発インサイト

もっと見る

カリキュラム

全体

37件 ∙ (7時間 48分)

講座資料(こうぎしりょう):

授業資料
講座掲載日: 
最終更新日: 

受講レビュー

全体

343件

4.9

343件の受講レビュー

  • psw926409621733님의 프로필 이미지
    psw926409621733

    受講レビュー 5

    平均評価 5.0

    5

    100% 受講後に作成

    既存のリアクトで1年間プロジェクトを進め、最近離職しながらVueを使用するようになり講義を聞くようになりました。以前に聞いた講義も良かったのですが、その講義を聞きながら内容がとてもよく、必要な部分だけがよく収められたと思いました。私が聞いた講義の中で一番良かったと思います。

    • gymcoding
      知識共有者

      頑張ってください! 🎉 役に立ったのは幸いです!ありがとう〜! 🙂

  • mju60130435님의 프로필 이미지
    mju60130435

    受講レビュー 2

    平均評価 5.0

    5

    100% 受講後に作成

    実務で突然Vue3を使用するようになりましたが、短い講義時間で多くのものを手に入れているようです。 Vue2についての知識がない方も簡単に理解できるレベルに進んでくださったようで 講師の辞書が良くて集中が良くなると思います:) 実戦編とVuetify関連講義も聞く予定です!

    • gymcoding
      知識共有者

      ありがとう〜! 🙂

  • design2773님의 프로필 이미지
    design2773

    受講レビュー 1

    平均評価 5.0

    5

    100% 受講後に作成

    1.5倍に聞いてもレッパーに劣らない充実内容と正確な発音でとても分かりやすく説明するのが良かったです。たくさん助けました

    • gymcoding
      知識共有者

      1.5倍いいですね! 🙂

  • bestksw님의 프로필 이미지
    bestksw

    受講レビュー 2

    平均評価 5.0

    5

    100% 受講後に作成

    講義の中で最も深く、これを簡単に伝える能力を持ったジムコーディング様ありがとうございます。

    • gymcoding
      知識共有者

      うわー!お疲れ様でしたㅎ🎉 ありがとう〜! 🙂

  • kimjuno97님의 프로필 이미지
    kimjuno97

    受講レビュー 7

    平均評価 5.0

    5

    100% 受講後に作成

    npm trendsで11月~12月の間にvueダウンロード数がリアクトの3倍程度を超えたが、 その講義はvue3入門に本当にたくさん役立つようです!

    • gymcoding
      知識共有者

      うわー!ありがとう〜! 🙂🎉

gymcodingの他の講座

知識共有者の他の講座を見てみましょう!

似ている講座

同じ分野の他の講座を見てみましょう!

¥8,484