Firebaseでプロジェクトをコード書いて=>WebAPIサーバーに仕立てるときのコマンドのメモ
- 作者: Houssem Yahiaoui
- 出版社/メーカー: Packt Publishing
- 発売日: 2017/11/29
- メディア: Kindle版
- この商品を含むブログを見る
memo
Firebaseを使い始めるときのコマンドのメモ
環境
・MacOS
・npm
・FirebaseCLIでログイン済み
1:プロジェクトを作る
Webコンソールにログインして、プロジェクトを作っておく
2:コマンドを作業ディレクトリをつくって打つ
$ firebase init hosting 🔥🔥🔥🔥🔥🔥🔥🔥 🔥🔥🔥🔥 🔥🔥🔥🔥🔥🔥🔥🔥 🔥🔥🔥🔥🔥🔥🔥🔥 🔥🔥🔥🔥🔥🔥🔥🔥 🔥🔥🔥 🔥🔥🔥🔥🔥🔥 🔥🔥🔥🔥🔥🔥🔥🔥 🔥🔥 🔥🔥 🔥🔥 🔥🔥 🔥🔥 🔥🔥 🔥🔥 🔥🔥 🔥🔥 🔥🔥 🔥🔥 🔥🔥🔥🔥🔥🔥 🔥🔥 🔥🔥🔥🔥🔥🔥🔥🔥 🔥🔥🔥🔥🔥🔥 🔥🔥🔥🔥🔥🔥🔥🔥 🔥🔥🔥🔥🔥🔥🔥🔥🔥 🔥🔥🔥🔥🔥🔥 🔥🔥🔥🔥🔥🔥 🔥🔥 🔥🔥 🔥🔥 🔥🔥 🔥🔥 🔥🔥 🔥🔥 🔥🔥 🔥🔥 🔥🔥 🔥🔥 🔥🔥 🔥🔥🔥🔥 🔥🔥 🔥🔥 🔥🔥🔥🔥🔥🔥🔥🔥 🔥🔥🔥🔥🔥🔥🔥🔥 🔥🔥 🔥🔥 🔥🔥🔥🔥🔥🔥 🔥🔥🔥🔥🔥🔥🔥🔥 //なんかFirebaseぽいロゴが・・・笑 You're about to initialize a Firebase project in this directory: /自分が/設定した/ディレクトリ === Project Setup ? Select a default Firebase project for this directory: [create a new project] // 手順1で作っておいたプロジェクトを選ぶ === Hosting Setup ? What do you want to use as your public directory? public //public ? Configure as a single-page app (rewrite all urls to /index.html)? No //N ✔ Firebase initialization complete! Project creation is only available from the Firebase Console Please visit https://console.firebase.google.com to create a new project, then run firebase use --add //多分成功したっぽい
これでホスティングの準備ができた模様
3:functionsを初期化
functions/index.jsというのができるので、そこにWebAPIを書くとWebAPIサーバーの準備はできる
$ firebase init functions //中略 === Functions Setup A functions directory will be created in your project with a Node.js package pre-configured. Functions can be deployed with firebase deploy. ? What language would you like to use to write Cloud Functions? JavaScript ? Do you want to use ESLint to catch probable bugs and enforce style? No ✔ Wrote functions/package.json ✔ Wrote functions/index.js ? Do you want to install dependencies with npm now? Yes
4: functions/index.jsにコードを書く
ここは個々人の目的にあったAPIを書く
5: デプロイ
WebAPIの関数部分だけのデプロイはこのようにやるっぽい
(firebase.jsonがあるディレクトリで実行) $ firebase deploy --only functions //デプロイ先が出てくる。curlなどで試すとよい //Error: Not in a Firebase app directory (could not locate firebase.json)
curlテストもうまくいき、とりあえずWebAPIの簡易サーバーはできた
参考になった書籍
React、Angular、Vue.js、React Nativeを使って学ぶ はじめてのフロントエンド開発
- 作者: 原一浩,taisa,小松大輔,永井孝,池内孝啓,新井正貴,橋本安司,日野洋一郎
- 出版社/メーカー: 技術評論社
- 発売日: 2018/05/09
- メディア: 単行本(ソフトカバー)
- この商品を含むブログを見る
Firebaseを使い始めるときのコマンドのメモ
- 作者: Houssem Yahiaoui
- 出版社/メーカー: Packt Publishing
- 発売日: 2017/11/29
- メディア: Kindle版
- この商品を含むブログを見る
memo
Firebaseを使い始めるときのコマンドのメモ
環境
・MacOS
・npm
$ npm i -g firebase-tools@3.18.0 //わーっとたくさん出てくるWARNINGとか //出ても気にしなくてOK $ firebase login ? Allow Firebase to collect anonymous CLI usage and error reporting information? Y // Yにとりあえずしといた //ブラウザが開いて、グーグルアカウントでの認証を行う ✔ Success! Logged in as xxxxxxxxxx@gmail.com //ログイン成功
これで使えるみたいです。
vue.jsとvuexの実装と挙動のメモ
memo
vueのざっくりとした流れのメモです。
vueの処理の流れ
component
のxxx任意xxx.js
の methods
,compute
の部分
↓
component
のxxx任意xxx.js
の
data return
の部分で<template>
に向けてデータバインディング
↓
UI表示
vuex
state(簡易NoSQLみたいにメモリをつかっているのかな?後日検証。)
↓
mutation(stateを更新)
↓
action(mutationにcommit)
参考書籍
React、Angular、Vue.js、React Nativeを使って学ぶ はじめてのフロントエンド開発
- 作者: 原一浩,taisa,小松大輔,永井孝,池内孝啓,新井正貴,橋本安司,日野洋一郎
- 出版社/メーカー: 技術評論社
- 発売日: 2018/05/09
- メディア: 単行本(ソフトカバー)
- この商品を含むブログを見る
調性ついて弾いたことある曲、楽譜だけ持ってる曲との照合表についてのメモ
Baosity ミュージカル ハンドバッグ トートバッグ ショッピングバッグ 音楽愛好者 ギフト 全2色 - 黒
- 出版社/メーカー: Baosity
- メディア: ウェア&シューズ
- この商品を含むブログを見る
メモ
調性について勉強しました。課題曲や自分が好きな曲について調性ごとに個性があるように感じていたので、「やっぱそういう分類があるんだ〜」と嬉しくなりました。 一方でカラオケでキーを変える(調性を変更する)というのもあるし、その辺の兼ね合いが気になったのですが今回の調べによってよくわかりました。
作者の決めた調性はジャンルによって重んじられたりしなかったりする
クラシックは、原則作者の決めた調性によって演奏される(編曲などで変更されることがあるらしい)
JPOPとかは特に調性にこだわりないものが多い(ようだ。声の音域が当てはまるドレミファの範囲に移動するための基準にしかすぎない)
調性とイメージ
これはヴァイオリン弾いていて、なんか個人的に感じる(#2個のニ長調は、天真爛漫でかわいい感じ。#1個のト長調は厳かな気品のある感じという・・・)ので、色々な人の感想を見て楽しめました。
序盤の調性ごとの楽譜を持っている曲とイメージ
メモしてみました。途中で転調しているものもたくさんあります。あくまで序盤のキー(主調)だけかきました。
ハ長調 /イ短調
ヴィヴァルディ コンチェルト A-moll(ナッシェ編)第1楽章と第3楽章
アメイジング・グレイスシャープ1個(ト長調/ホ短調)
誰も寝てはならない
主よ人の望みの喜びよ
アレグロ(フィオッコ)
モーツァルトK136 2楽章
シンドラーのリスト
VOCALISE ラフマニノフシャープ2個(ニ長調/ロ短調)
モーツァルトK138 2楽章
モーツァルトK136 1楽章と3楽章
タイスの瞑想曲
キラキラ星フラット2個(変ロ長調/ト短調)
ナタの愛のテーマ
シシリアーノ(フォーレ)
レスピーギ 古風なリュートのための舞曲 第2楽章
レスピーギ 古風なリュートのための舞曲 第4楽章
宿命(『砂の器』)
アベマリア(シューベルト)
ヴィターリのシャコンヌ
アヴェ・マリア(カッチーニ)フラット3つ(変ホ長調/ハ短調)
レスピーギ 古風なリュートのための舞曲 第1楽章
レスピーギ 古風なリュートのための舞曲 第3楽章
ツィゴイネルワイゼン
ト長調、ホ短調、ト短調が好きな曲が多いかな〜^^ ドラマチックで切ないけど美しい曲が多いイメージ
この本面白そう・・・買おうかな^^
1冊でわかるポケット教養シリーズ 吉松 隆の 調性で読み解くクラシック
- 作者: 吉松隆
- 出版社/メーカー: ヤマハミュージックメディア
- 発売日: 2014/09/22
- メディア: 文庫
- この商品を含むブログ (1件) を見る
vue.js開発過程記録vol.x:各コードの分析メモそのx:Djangoとの比較イメージメモ
経緯など
ちょっと既存のWebアプリ(Django/Python)に非同期処理をアプリにかけたいのでvue.jsを特訓することになったので、メモを残していきます。目標はWebAPIを叩けるようにするアプリです。
Djangoとの比較
今回はVue.jsとPythonフレームワークのDjangoとの比較をしてみました。
自分がDjangoを日常的に使うので、理解を深めるためです。Webアプリのフレームワークの側面がともにあるため類似部分も見つかったのでDjangoユーザーの方にはもしかしたら役立つ資料になるかもしれないです。
比較イメージなので、完全に1対1対応してないのであいまいです。ざっくりイメージをつかむためなので厳密ではないです。
番号 | Vue.js | Django | 備考 |
---|---|---|---|
1 | src/router/index.js | projルート(settings.pyがある場所)/urls.py + settings.pyのINSTALLED_APP部分 | URLまわりとアプリ適用設定 |
2 | src/components/ | app | |
3 | src/components/hoge.vueの<script> 部分 |
app/views.py | |
4 | src/components/hoge.vueの<template> 部分 |
template.html | |
5 | src/components/hoge.vueの<style> 分 |
template.html+staticファイルディレクトリからのインポート | |
6 | src/assets | staticファイルディレクトリ | |
7 | src/main.js | projルート(settings.pyがある場所)/settings.py(予想。検証中) | |
8 | src/App.vue | projルート(settings.pyがある場所)/settings.py(予想。検証中) | |
9 | (用語)データバインディング | render関数とテンプレートタグ | HTMLへの出力 |
引用・参考書籍
React、Angular、Vue.js、React Nativeを使って学ぶ はじめてのフロントエンド開発
- 作者: 原一浩,taisa,小松大輔,永井孝,池内孝啓,新井正貴,橋本安司,日野洋一郎
- 出版社/メーカー: 技術評論社
- 発売日: 2018/05/09
- メディア: 単行本(ソフトカバー)
- この商品を含むブログを見る
この書籍のVue.jsの実装例を引用して仕組みを理解していきたいと思います。
vue.js開発過程記録2:hello worldアプリの構築コマンドの記録
経緯など
ちょっと既存のWebアプリ(Django/Python)に非同期処理をアプリにかけたいのでvue.jsを特訓することになったので、メモを残していきます。目標はWebAPIを叩けるようにするアプリです。
手順
環境構築のあたり、node.js&npmセットアップは以下に情報まとめています。
$ vue -V 2.9.6 // ちゃんと動きますね $ vue init webpack newproj //初期設定の質問がはじまります。 ? Project name newproj //適当です ? Project description apitestapp //適当です ? Author mawa //自分の名前 ? Vue build standalone //適当です ? Install vue-router? Yes //いるっぽい ? Use ESLint to lint your code? No //テストなので適当です ? Set up unit tests No //テストなので適当です ? Setup e2e tests with Nightwatch? No //テストなので適当です ? Should we run `npm install` for you after the project has been created? (recommended) npm //npmで開発アプリシミュレーターなど制御できる vue-cli · Generated "newproj". # Installing project dependencies ... # ======================== //ごちゃごちゃプロセスが始まります # Project initialization finished! # ======================== To get started: cd newproj npm run dev Documentation can be found at https://vuejs-templates.github.io/webpack //できた模様 $ ls newproj //できてますね $ cd newproj/ $ ls README.md config node_modules package.json static build index.html package-lock.json src $ npm run dev //しばし待ちます・・・mac miniで、1〜3分以内くらいでした・・・多分。 //http://localhost:8081で確認できましたね。 //画像は記事トップの画像です。
続き
次は、生成されたファイルのコア部分をチェックしていく予定です。
参考になった書籍
React、Angular、Vue.js、React Nativeを使って学ぶ はじめてのフロントエンド開発
- 作者: 原一浩,taisa,小松大輔,永井孝,池内孝啓,新井正貴,橋本安司,日野洋一郎
- 出版社/メーカー: 技術評論社
- 発売日: 2018/05/09
- メディア: 単行本(ソフトカバー)
- この商品を含むブログを見る
ベートーベンの三大ソナタとスプリング・ソナタについてのメモ
- アーティスト: 西哲平
- 出版社/メーカー: 西哲平
- 発売日: 2014/09/29
- メディア: MP3 ダウンロード
- この商品を含むブログを見る
メモ
ベートーベンは、まだ自分が弾いたことないので、正月の第九とか運命とかの有名な曲とかしか知らない状態です。そこで、自分の習っている先生にちょっと教えてもらったので忘れないようにメモします。
ベートベンの3大ピアノソナタ
・『熱情』
・『月光』
・『悲愴』
悲愴の参考演奏はこちら。ホロヴィッツという名手の模様です。第2楽章が特に有名らしいです。ちょっとどこかで聴いたことあるような気はします・・・
ベートベンで有名なヴァイオリン曲
『スプリングソナタ』
軽やかな感じですね^^ 難しそ〜^^;