0728
- 2. 自己紹介 ? 主催者プロフィール 三浦卓馬 ? これまで大学院での学校支援プロジェクトや学会発表を経験後、 ? 公立小の教員を半年間経験。その後G’sアカデミーにて新規Web サービ スの企画立案から開発までの基礎を学びSNSを卒業制作として作成。 ? またサービスの開発だけでなく、マーケティングやデータベース、サー バーの基礎を学ぶ。G’sアカデミー卒業後は、常駐案件のエンジニアをし ながら、ブロックチェーン開発などやっております。 ? →4月よりIot開発企業に勤務 ? →Dive into code 機械学習エンジニアコースのチュータ（予定）
- 4. 環境設定 ? ①ブラウザ、 Google ChromeのDL ? ② Node.jsのインストール 自分のPCのターミナルで $ node –vでバージョン確認できま す 【Mac】 Homebrewを使う場合→brew –vでバージョン確認 $ brew update $ brew install node.js 【Windows】http://nodejs.org/ja/から最新版をDL
- 6. Nuxt.js（ナクストと は ? Nuxt.jsとはユニバーサルなVue.jsアプリケーションを構築するため の フレームワーク ? vue-cliを利用 ? $ npm install -g vue-cli # 既にvue-cli を導入されているかたについては 不要です ? $ vue init nuxt-community/starter-template nuxt_sample
- 7. プロジェクトのセットアップと実 行 ? $ cdnuxt_sample ? $ yarn ? $ yarn dev
- 8. 以下、表示できたら成功
- 9. さらに、やりたい人 ? 以下?公式https://nuxtjs.org/ ? ルーティングの追加と非同期データの取得 ? Nuxt.js 上での開発におけるbabel の対応文法のソース（設定プリ セット）https://github.com/vuejs/babel-preset-vue-app ? 参照URLhttps://html5experts.jp/potato4d/24346/
- 10. 環境設定続 き? npmコマンドのインストール ? $ npm –vでバージョンを確認できるので最新のものにす る ? npm パッケージのインストール $npm installvue vue.jsのインストール $npm installvue vue-cliのインストール npm install --globalvue-cli ＊webpackやbabelを使いたい場合 $npm install webpack webpack-dev-server–save-dev
- 11. プロジェクトのディレクトリの作 成 ? 任意のフォルダでvue init webpack hello-vueを実 行 ?作成したディレクトリで $ cd hello-vue $ npm run dev を実行
- 13. 環境設定が難しい方向け ? Codesandboxというサービスを利用 https://codesandbox.io/ ? ブラウザ上で動くエディタ ? npm package対応している。 こちらでも十分に演習することは可能です。
- 16. タイムテーブル ? 13:30 - 開場?受付開始 ? 14:00 - 14:05 オープニング ? 14:05 - 14:30 自己紹介 全員 ? 14:30 - 16:30 webアプリを作成してみる ? 16:30 - 17:00 成果発表(フリートーク） ? 17:00 - 17:30 クロージング (アンケート) ? ※途中退場可能
- 17. 会場の注意事項 ? 備品など間違って持ち帰らないように ? 飲酒は禁止です。 ? 17時15分には撤収予定です。 ? 案件やこんなサービス使ってるなど、 参加者の方でLTしたい方は事前に申し出てください！
- 19. 作成するアプリの 例 ? vueを活用したチャットアプリ ? メモ帳やTodoアプリなど ? 参考記事URL&Githubリポジトリ Nuxt.jsとFirebaseによる簡易チャットアプリ https://github.com/hayasakaharuka/nuxt-firebase-chat-app →こちらをクローンしていただけるとスムーズです
- 20. 参考書籍&記事URL&②（当日、一部持っ ていきます 初めてのシングルヘ?ージアプリケーションVue.jsとFirebaseで作る ミニWebサービス https://booth.pm/ja/items/829853 React，Angular，Vue.js，ReactNativeを使って学ぶ はじめてのフロント エンド開発 Kindle版 https://gihyo.jp/book/2018/978-4-7741-9706-7 Nuxt.jsビギナーズガイド―Vue.js ベースのフレームワークによるシ ングルヘ?ージアプリケーション開発 http://nakajmg.hatenablog.com/entry/2018/11/10/131233
- 22. 尝别迟’厂スタート！！