Udemy
    •  
    •  
    •  
    •  
    •  
    •  
    •  
    •  
Turn what you know into an opportunity and reach millions around the world.
Learn More
Your cart is empty.
Keep shopping
【Vue.js + firebase + Vuetify】Vue.js入門!超実践チャットルームアプリ開発
Rating: 4.1 out of 5(131 ratings)
1,053 students

【Vue.js + firebase + Vuetify】Vue.js入門!超実践チャットルームアプリ開発

Vue.js の基本は学んだけど、実際に何を作ればいいかわからないという人のためのステップアップコース!実践的な内容を学ぶことで、JSを使用した開発の基礎を学ぶことができます。ご自身のポートフォリオにも応用可能です。
Last updated 7/2022
Japanese
Japanese [Auto],

What you'll learn

  • Vue JS の基本的な知識
  • 実践的な開発手法
  • Vuetifyの基本的な知識
  • Vue Routerの基本的な知識
  • firebase の理解

Course content

5 sections46 lectures5h 42m total length
  • Vue.js 環境構築をしよう5:02

    Vue.js の開発環境を構築します。今回はVue CLI というコマンドラインインターフェースを使用して、お手軽に環境を構築します。

  • Vuetifyで簡単UIデザインしてみよう8:06

    vuetify とは、Vue.js で使用できるUIライブラリです。Vuetify を使用することで特にデザインの知識がなくても、簡単にデザイン性のあるUIにすることができます。今回はVuetify をセットアップしてみましょう。

  • Vue Routerでサイドメニューを作ろう16:41

    本動画9:50 あたりで記載したアイコンのCSSは下記の通りです。


    .grey.darken-1 {

     background-color: #757575!important;

     border-color: #757575!important;

    }

  • 補足:コンポーネントのファイル名に関して0:53
  • ユーザー一覧を作成しよう16:27
  • チャット画面を作り込んでいこう11:49
  • チャット送信を実装しよう21:22
  • firebase の設定をしよう15:58
  • 補足:firebase のバージョン0:42
  • サイドメニューをコンポーネント化しよう11:46

Requirements

  • JavaScriptの基本
  • Vue JS の基本
  • 基本的なHTML、CSSの理解
  • ターミナルで作業をするため、基本的なLinux コマンドの理解

Description

Vue.jsの基礎を身につけたけれど、次は何をすればいいか迷っている方へ。このコースは、実践的な開発に挑戦したいあなたにぴったりです!

「Vue.jsの基礎は理解したけれど、次のステップがわからない」 「自分でプログラムを書こうとすると、手が動かない」 「実務で役立つスキルを身につけたい」 「ポートフォリオにどんなプロジェクトを取り組めばいいか迷っている」

これらの悩みを抱える初心者の方々に向けて、このコースを作成しました。

このコースでは、認証機能やデータベースにはGoogleが提供するFirebaseを使用します。Firebaseは、モダンなフロントエンド開発でよく利用されるサービスで、通常バックエンドの実装に必要なプログラミング言語(PHP、Ruby、Pythonなど)を使用せずに、一般的なWebサービスで使用する機能を提供しています。これにより、開発効率が向上し、より効果的にアプリを構築することができます。

さらに、デザインにもこだわりたい方には、Vue.jsで利用できるUIフレームワークであるVuetifyを導入します。Vuetifyを使用することで、デザインの専門知識がなくても、見栄えの良いデザインを実装することが可能です。

このコースでは、Vue.js、Vuetify、Firebaseの3つのモダンなフロントエンド技術を駆使して、チャットアプリを開発していきます。実務でも活用できる内容を提供するため、現場での参考になること間違いありません。

また、ポートフォリオにどんなプロジェクトを追加すべきか迷っている方にとっても、このコースは大変有益です。開発したチャットアプリをベースに、自分なりのアレンジやカスタマイズを加えることができます。

「Vue.jsの基礎は学んだけど、次に何をすればいいかわからない人」 「単なるプログラムの模写ではなく、実践的なアプリ開発に挑戦したい人」 「ポートフォリオにどんなプロジェクトを追加すべきか迷っている人」

このような方々には、ぜひこのコースをおすすめします。

前半部分は無料で公開していますので、ぜひお試しください!^^

Who this course is for:

  • Vue JSの基本を一通り学習し、実際の開発を通して、理解を深めたい初学者。