いつになったらRedux入門できるの?(5)firebaseにデプロイ

アプリを作ったら、サクッと公開できないと!

前々回、reduxで電卓ページを写経した。

いつになったらRedux入門できるの?(3)containerでタイプミスしやすい
以下の続き 引き続き、以下のサイトの写経をしていく。 電卓アプリで学ぶReact/Redux入門(実装編) nishi...

今回、これを、firebaseにデプロイしてみたい。できるかな?

(環境)
Windows8.1
Visual Studio code

(参考サイト)

電卓アプリで学ぶReact/Redux入門(実装編)
nishina555
2016年11月22日に更新
http://qiita.com/nishina555/items/9ff744a897af8ed1679b

http://qiita.com/cacarrot/items/3e4a8ab7d8c058c1dfe3
React+Reduxで簡単な勉強会イベント検索アプリを作って公開してみる
cacarrot
2016年10月02日に更新

(0)firebaseに登録、firebase-toolsのnpmインストール

忘れてしまったが、おそらく、過去に、コマンドプロンプトで、

$npm install -g firebase-tools

していたのだと思う。

(参考)
http://qiita.com/gonta616/items/278a7e81a8b624d9621e

そのときの記録

Firebaseを試してみる(1)
FirebaseでWebサイトを無料でサクッと公開してみるIjoru 2016年11月21日に更新 を見て、Firebaseをやりたくなった...

(1)npm run build

image

build フォルダが作成されて、その中にindex.htmlとJavascriptファイルなどが作成される。

(2)firebaseにログイン

https://console.firebase.google.com/?hl=ja

に自分のgoogleIDでログインして、「新規プロジェクトを作成」>日本 で、今回は、「dentaku-redux」という名前で作成

image image

(3)firebaseへデプロイ

http://qiita.com/cacarrot/items/3e4a8ab7d8c058c1dfe3

を見ながら、やってみる。

Visual Studio Codeで、Ctrl+@

firebase login

firebase init

firebase.json (上記サイト参考)

firebase deploy –project dentaku-redux

image

image

(4)firebaseのconsole画面で、左側の列から、Hostingをクリックして、デプロイされたサイトへのリンクをクリック。

image

今回は、

https://dentaku-redux.firebaseapp.com

らしい。

image

わお!できた!少しだけがんばれば、これは簡単!

なんだかReact+Redux+firebase 楽しくなってきた!

関連記事
Count per Day
    Popular Posts
    スポンサーリンク

    シェアする

    • このエントリーをはてなブックマークに追加

    フォローする