Vue.js入門
-ver.3対応-
親しみやすくパフォーマンスも優れた人気のJavaScriptフレームワーク「Vue.js」に入門しましょう。

Vue.jsは、オープンソースで開発されているユーザインターフェース構築用のJavaScriptフレームワークです。
これまでのフロントエンドJavaScriptフレームワークの良いところを取り入れており、性能と学習の容易さを兼ね備えています。
このコースでは、JavaScriptの学習経験がある方に向けて、Vue.jsの導入方法・基本的な作り方・リアクティブ・create-vue・Vue Router・provide/injectなどを、ハンズオンを織り交ぜながらステップアップで学んでいきます。
このコースを受講することで、最新のVue.jsを使って、様々なUIを備えたWebアプリケーションを作成できるようになります。


※受講に関する注意点※
進行の都合上、研修開始時間を過ぎてからのご参加はご遠慮いただいております。
大変恐れ入りますが、研修開始時間までにご参加いただけていない場合、
当日キャンセル扱いをさせていただく場合がございますのでご注意ください。

開催日程

オンライン・オフライン(対面)の開催がございます。 オンライン研修を希望される方は、必ずお申し込み前に「オンライン研修環境」を確認してください。
オンライン
オフライン

学習目標

■ Vue.jsを使ってコンポーネントを作成し、基礎的なアプリケーションを構築できる

対象者

■ 今後Vue.jsを使用してフロントエンドWebアプリケーション開発を担当する方
■ これまで、フロントエンドのWebアプリ開発に携わったことがあり、Vue.jsの導入に興味がある方
■ jQueryの代替をお探しの方

前提条件

■ HTMLおよびCSSを利用して簡単なWebページを記述できる方
■ JavaScriptを利用して簡単なWebアプリケーションを記述できる方
■ 『モダンJavaScript入門』コースをご受講いただいた方もしくは、同等の技術を習得している方

研修概要

  • 実行環境
    ■ Vue.js v3.2以上
    ■ Node.js v18.x以上
    ■ ECMAScript 2015以上
    ■ Chrome
    ■ Visual Studio Code

    ※使用するソフトウェアおよびバージョンについては予告なく変更する可能性がありますのでご了承ください。
  • 配布資料
    オンライン参加の方は、研修当日にPDFのテキストを配布いたします。
    オフライン(対面)参加の方は、研修当日に紙媒体のテキストを配布いたします。
  • 受講料
    110,000円(税込)/人
  • お支払い
    研修終了後に請求書払いとなります。
    請求書は研修終了日の属する月の月末までに送付いたします。
  • 開催日数
    2日間
  • 時間
    9時30分~17時00分

カリキュラム

■ 概要と準備
 □ Vue.jsとは
 □ create-vueの導入
 □ Vue.jsを試してみる
■ Vue.jsの基礎
 □ 単一ファイルコンポーネント
 □ Composition APIについて
 □ Vueインスタンス
 □ setup関数
 □ <script setup>
 □ ディレクティブ
 □ リアクティブ
 □ 条件によって要素の表示を切り替える
 □ ユーザーからの入力を受け付ける
■ コンポーネントの導入
 □ コンポーネントの作成
 □ props
 □ 要素を繰り返し表示する
■ Vue Router
 □ Vue Routerの基本的な使い方
 □ パラメータの受け渡し
■ コンポーネント間での情報の共有
 □ provideとinject
 □ storeパターン
 □ WebAPIにアクセスする
■ その他、よく利用されるUIの実現
 □ トランジション
 □ スロット

※最新でより良い内容をお届けするため、一部の学習項目を予告なく変更する可能性がありますのでご了承ください。

オンライン研修環境

  • 使用ツール
    動画配信:Zoom
    質疑応答:オンラインチャットシステム(Mattermost)
    演習環境:仮想デスクトップ

    ※業務用PCにZoomアプリをインストールできない場合は、ブラウザからのご参加をお願いします。
    ※Zoomのシステム要件について、より詳細な情報は、こちらをご参照ください。
    ※Mattermostおよび演習環境は弊社にてご用意いたします。
  • システム要件
    ・インターネットに常時接続できること
     (アクセス制限のないネットワーク環境をご利用ください)
    ・Webカメラおよびマイク
    ※PC本体の他に、モニターやiPad等の拡張ディスプレイをご用意いただくことを推奨いたします。
     (1台:Zoom、オンラインチャットシステム用、1台:演習環境用)
    ※事前にアクセス確認をご希望される方はお問い合わせください
  • 対応OS
    Windows
    上記以外の環境でもご受講いただくことが可能ですが、操作感が異なる可能性がある点をご了承ください。
  • WEBブラウザ
    Google Chrome
    上記以外の環境でもご受講いただくことが可能ですが、操作感が異なる可能性がある点をご了承ください。

開催日程

  • 申込受付終了
    2024年12月12日〜2024年12月13日 (2日間) 【開催確定】
    【会場】オンライン
    【価格】110,000円 (税込)/人
  • 申し込む
    2025年1月16日〜2025年1月17日 (2日間) 【開催未定】
    【受付】2025年1月7日まで
    【会場】オンライン
    【価格】110,000円 (税込)/人
  • 申し込む
    2025年2月25日〜2025年2月26日 (2日間) 【開催未定】
    【受付】2025年2月14日まで
    【会場】オンライン
    【価格】110,000円 (税込)/人
  • 申し込む
    2025年3月6日〜2025年3月7日 (2日間) 【開催未定】
    【受付】2025年2月26日まで
    【会場】オンライン
    【価格】110,000円 (税込)/人
  • 申し込む
    2025年3月27日〜2025年3月28日 (2日間) 【開催未定】
    【受付】2025年3月18日まで
    【会場】オンライン
    【価格】110,000円 (税込)/人

学習目標

■ Vue.jsを使ってコンポーネントを作成し、基礎的なアプリケーションを構築できる

対象者

■ 今後Vue.jsを使用してフロントエンドWebアプリケーション開発を担当する方
■ これまで、フロントエンドのWebアプリ開発に携わったことがあり、Vue.jsの導入に興味がある方
■ jQueryの代替をお探しの方

前提条件

■ HTMLおよびCSSを利用して簡単なWebページを記述できる方
■ JavaScriptを利用して簡単なWebアプリケーションを記述できる方
■ 『モダンJavaScript入門』コースをご受講いただいた方もしくは、同等の技術を習得している方

研修概要

  • 実行環境
    ■ Vue.js v3.2以上
    ■ Node.js v18.x以上
    ■ ECMAScript 2015以上
    ■ Chrome
    ■ Visual Studio Code

    ※使用するソフトウェアおよびバージョンについては予告なく変更する可能性がありますのでご了承ください。
  • 配布資料
    オンライン参加の方は、研修当日にPDFのテキストを配布いたします。
    オフライン(対面)参加の方は、研修当日に紙媒体のテキストを配布いたします。
  • 受講料
    110,000円(税込)/人
  • お支払い
    研修終了後に請求書払いとなります。
    請求書は研修終了日の属する月の月末までに送付いたします。
  • 持ち物
    特にございません
  • 開催日数
    2日間
  • 時間
    9時30分~17時00分

カリキュラム

■ 概要と準備
 □ Vue.jsとは
 □ create-vueの導入
 □ Vue.jsを試してみる
■ Vue.jsの基礎
 □ 単一ファイルコンポーネント
 □ Composition APIについて
 □ Vueインスタンス
 □ setup関数
 □ <script setup>
 □ ディレクティブ
 □ リアクティブ
 □ 条件によって要素の表示を切り替える
 □ ユーザーからの入力を受け付ける
■ コンポーネントの導入
 □ コンポーネントの作成
 □ props
 □ 要素を繰り返し表示する
■ Vue Router
 □ Vue Routerの基本的な使い方
 □ パラメータの受け渡し
■ コンポーネント間での情報の共有
 □ provideとinject
 □ storeパターン
 □ WebAPIにアクセスする
■ その他、よく利用されるUIの実現
 □ トランジション
 □ スロット

※最新でより良い内容をお届けするため、一部の学習項目を予告なく変更する可能性がありますのでご了承ください。

開催日程

この研修を見ている方はこちらの研修も見ています

コースフロー

フロントエンド開発を学ぶ JavaScriptで学ぶ初めてのプログラミング HTML/CSS入門 モダンJavaScript入門 TypeScriptイントロダクション JavaScript応用 SvelteKit入門 React入門 Angular入門 Vue.js入門 jQueryによるAjaxアプリケーション開発 Node.js入門 Next.js入門 Reduxワークショップ JavaScriptテスト入門 Nuxt&Node.jsによるSPA開発ワークショップ
フロントエンド開発を学ぶ