差分

このページの2つのバージョン間の差分を表示します。

--- vue:codesandboxで2クリックでvue開始 [2018/12/09] – 作成 adash333
+++ vue:codesandboxで2クリックでvue開始 [2020/11/20] (現在) – [CodeSandboxで初めてのVue.js] adash333
@@ 行 1: / 行 1: @@
 ===== CodeSandboxで2クリックでVue開始 =====
-[[https://codesandbox.io/|CodeSandbox]]とは、無料でVue.jsやAngularといったJavascriptのフレームワークを利用できるサイトで、2017年から公開されています。2018年現在、初心者が特に動的なWEBサイトを作成する際のツールとして、一番のお勧めです。
+[[vue:index.html|Vue.jsトップページ]]
+[[https://codesandbox.io/|CodeSandbox]]とは、無料でVue.jsやAngularといったJavascriptのフレームワークを利用できるサイトで、2017年から公開されています。2020年現在、初心者が特に動的なWEBサイトを作成する際のツールとして、一番のお勧めです。
 {{:vue:pasted:20181209-144356.png}}
@@ 行 6: / 行 8: @@
 年までは、Cloud9というサイトがあったのですが、Amazonに買収され、無料プランが無くなってしまいました。（少なくともクレジットカード登録が必須になりました。）
-CodeSandboxと、GitHubとNetlifyという３つのサイトと組み合わせることにより、<wrap hi>パソコン上で、WEBブラウザのみで、無料で</wrap>Vue.jsやAngularで作成したWEBサイトを公開することができます。
+CodeSandbox上から『deploy Now』をクリックすることにより、<wrap hi>パソコン上で、WEBブラウザのみで、無料で</wrap>Vue.jsやAngularで作成したWEBサイトを公開することができます。
+===== CodeSandboxで初めてのVue.js =====
+解説：https://jp.vuejs.org/v2/guide/index.html
+https://codesandbox.io/embed/github/vuejs/vuejs.org/tree/master/src/v2/examples/vue-20-hello-world?codemirror=1
+<code html>
+<DOCTYPE html>
+<html>
+<head>
+  <title>My first Vue app</title>
+  <script src="https://unpkg.com/vue"></script>
+</head>
+<body>
+  <div id="app">
+    {{ message }}
+  </div>
+  <script>
+    var app = new Vue({
+      el: '#app',
+      data: {
+        message: 'Hello Vue!'
+      }
+    })
+  </script>
+</body>
+</html>
+</code>
 ===== CodeSandboxの使い方リンク =====
@@ 行 24: / 行 59: @@
 もうJS開発環境は訳わからんって人に薦めたい CodeSandbox
+===== ホスティングサービスNowについて =====
+https://qiita.com/aggre/items/f0cb9f8b8e8c54768e50
+@aggre
+年11月20日に更新
+Now でクラウドの複雑さから解放されよう、今すぐに
+https://qiita.com/w-iijima/items/6382b8dab1d48c15ba95
+@w-iijima
+年05月07日に投稿
+クレジットカードの登録不要！無料で使えるモックアップ環境比較[now/heroku/firebase]
+他にも、Netlifyという静的サイトホスティングサービスがあり、こちらも無料範囲内でもとても便利です。
+===== Vue.jsとfirebaseでチャットのリンク =====
+https://qiita.com/nakadoribooks/items/a5c73580039c99a117dc
+@nakadoribooks
+年08月05日に更新
+vueとfirebaseでブラウザチャット
+JavaScript
+vue.js
+Firebase
+Bulma
+https://liginc.co.jp/378463
+ Vue.js + Firebaseでチャットアプリを脳死しながら作ってみよう！〜セットアップ編〜
+.01.10
+#113
+それいけ！フロントエンド
+Vue.js + Firebaseでチャットアプリを脳死しながら作ってみよう！〜セットアップ編〜
+https://liginc.co.jp/382652
+完成編
+https://cr-vue.mio3io.com/tutorials/firebase.html
+認証付きの簡易チャットを作る！(基礎から学ぶ Vue.js 書籍用サポートページ)
+→素晴らしいサポートサイトです。今度、この本を購入して読んでみたいと思います。
+<html>
+<iframe style="width:120px;height:240px;" marginwidth="0" marginheight="0" scrolling="no" frameborder="0" src="//rcm-fe.amazon-adsystem.com/e/cm?lt1=_blank&bc1=000000&IS2=1&bg1=FFFFFF&fc1=000000&lc1=0000FF&t=i-doctor-22&language=ja_JP&o=9&p=8&l=as4&m=amazon&f=ifr&ref=as_ss_li_til&asins=B07D9BYHMZ&linkId=fa852410875e77ec8615969928dc1e59"></iframe>
+</html>
+===== リンク =====
+[[vue:index.html|Vue.jsトップページ]]