この文書の現在のバージョンと選択したバージョンの差分を表示します。
両方とも前のリビジョン 前のリビジョン 次のリビジョン | 前のリビジョン | ||
ionicウェブアプリをnetlifyで簡単デプロイ [2018/06/14] adash333 [開発環境] |
ionicウェブアプリをnetlifyで簡単デプロイ [2018/10/07] (現在) |
||
---|---|---|---|
ライン 1: | ライン 1: | ||
====== IonicウェブアプリをNetlifyで簡単デプロイ ====== | ====== IonicウェブアプリをNetlifyで簡単デプロイ ====== | ||
+ | |||
+ | https://www.netlify.com\\ | ||
+ | {{:pasted:20180615-081907.png}} | ||
+ | |||
Netlifyという静的サイト公開ツールがあり、あらかじめ設定しておけば、GitHubやBitbucketにpushする(コードをアップロードする)だけで、Ionicサイトを公開することができます(無料プランの範囲でできます)。 | Netlifyという静的サイト公開ツールがあり、あらかじめ設定しておけば、GitHubやBitbucketにpushする(コードをアップロードする)だけで、Ionicサイトを公開することができます(無料プランの範囲でできます)。 | ||
ライン 9: | ライン 13: | ||
を記載していきたいと思います。 | を記載していきたいと思います。 | ||
+ | (参考) | ||
+ | |||
+ | http://twosquirrel.mints.ne.jp/?p=24288\\ | ||
+ | Ionic3+Firebaseでメールアドレス認証を写経してみる(1)BitBucketに非公開登録し、Netlifyで公開とfirebaseの設定 | ||
+ | 2018/6/15 | ||
===== 開発環境 ===== | ===== 開発環境 ===== | ||
ライン 14: | ライン 23: | ||
Windows 8.1 Pro | Windows 8.1 Pro | ||
VisualStudioCode | VisualStudioCode | ||
- | SourceTree | + | git version 2.16.1.windows.4 |
+ | Sourcetree Version 2.4.8.0 | ||
Peageant | Peageant | ||
</code> | </code> | ||
+ | {{:image_thumb2_thumb_thumb_thumb_thumb1-1.png|}} | ||
+ | Ionicのインストール方法については、<wrap hi>[[windowsでionicを始める方法]]</wrap>をご覧ください。 | ||
+ | ===== IonicウェブアプリをBitbucketを介してNetlifyで公開するまでの流れ ===== | ||
+ | |||
+ | -Bitbucketにアカウント登録 | ||
+ | -BitbucketにSSHキーを登録 | ||
+ | -ローカルパソコンでIonicアプリを新規作成 | ||
+ | -Bitbucketに新しいリポジトリを作成し、ローカルのリポジトリをpush(アップロード) | ||
+ | -NetlifyにBitbucketのアカウントを登録 | ||
+ | -NetlifyにBitbucketの特定のリポジトリを登録 | ||
+ | -NetlifyにIonicウェブアプリが公開されたことを確認 | ||
+ | |||
+ | |||
+ | ===== 1. Bitbucketにアカウント登録(初回のみ) ===== | ||
+ | |||
+ | Bitbucketは、ソースコードをクラウド上でgit管理してくれるサイトです。無料プランの範囲内で、複数の非公開プロジェクトを保存することができます。(GitHubの無料プランでは非公開プロジェクトは1個のみ。) | ||
+ | |||
+ | 以下のBitbucketのサイトから、Bitbucketアカウントを新規登録します。(メールアドレスとパスワードを設定します。) | ||
+ | |||
+ | https://bitbucket.org | ||
+ | |||
+ | |||
+ | ===== 2. BitbucketにSSHキーを登録(初回のみ) ===== | ||
+ | |||
+ | 以下のサイトを参考に、SSHキーの登録を行います。Windowsの場合はかなりややこしいので、<wrap hi>GUIカッコ悪いと思っても、SourceTreeを使う方法が間違いない</wrap>と思います。 | ||
+ | |||
+ | http://hiromart.com/blog/sourcetree_and_bitbucket/\\ | ||
+ | Windows環境でBitbucketとSourceTreeの導入(Bitbucketの設定とSourceTreeのインストール) | ||
+ | 2015/02/09 2015/02/14 | ||
+ | |||
+ | http://hiromart.com/blog/sourcetree_and_bitbucket_2/\\ | ||
+ | Windows環境でBitbucketとSourceTreeの導入(SSHキー作成とBitbucketへの登録) | ||
+ | 2015/02/09 2015/02/14 | ||
+ | |||
+ | http://hiromart.com/blog/sourcetree_and_bitbucket_3/\\ | ||
+ | Windows環境でBitbucketとSourceTreeの導入(リポジトリの作成とSourceTreeへのクローンの方法) | ||
+ | 2015/02/14 | ||
+ | |||
+ | |||
+ | |||
+ | |||
+ | |||
+ | ===== 3. ローカルパソコンでIonicアプリを新規作成 ===== | ||
+ | |||
+ | |||
+ | |||
+ | ===== Bitbucketに新しいリポジトリを作成し、ローカルのリポジトリをpush(アップロード) ===== | ||
+ | |||
+ | |||
+ | -NetlifyにBitbucketのアカウントを登録 | ||
+ | -NetlifyにBitbucketの特定のリポジトリを登録 | ||
+ | -NetlifyにIonicウェブアプリが公開されたことを確認 | ||
作成中 | 作成中 | ||
===== リンク ===== | ===== リンク ===== | ||
+ | |||
+ | https://qiita.com/xiaca/items/321fb5ab3cb36c0c6cf6\\ | ||
+ | {{:pasted:20180716-083746.png}} | ||
+ | |||
+ | https://blog.ionicframework.com/how-to-make-pwas-with-ionic/\\ | ||
+ | {{:pasted:20180716-083958.png}} | ||