入力フォームが下からスライドして出てくるUIがいいなと思い、 Buefyでやってみたときの備忘録。 Nuxt/Vueのtransitionを使うとできた(´ω｀) こんな感じ <template> <transition name="modal"> <div class="modal modal-sheet is-active" v-if="active"> <div class="modal-background" @click="close"></div></div></transition></template>
vue-chartjs、便利だけど、 数値とかデータラベルがほしいなと思って調べたときの備忘録。 chart.jsのプラグインでchartjs-plugin-datalabelsというのがあるらしい。 こんな感じのができる(´ω｀) インストール $ npm i vue-chartjs chartjs chartjs-plugin-d…
Nuxt.jsの公式ツイッターを見てたら、いい感じのモジュールがあったので、試してみたときの備忘録。 Introducing @nuxt/components ✨No need to import your components anymore ✅ Scan and auto import components✅ Multiple paths with customisable prefi…
firestore便利だけど、getしか使ったことなかった。。 onSnapshotを使うと、変更されたデータを受け取れるので、試してみたときの備忘録。 ドキュメントはこれをみた。 ・Cloud Firestore でリアルタイム アップデートを入手する | Firebase 使い方 こんな感…
以前の記事でvue-fontawesomeを使って、FontAwesome5を使えるようにしたけど、 nuxt-fontawesomeというもっと便利なのがあったので、試してみたときの備忘録。 便利だけでどデフォルトをFontAwesomeにしないといけないっぽい感じなので、併用していると難し…
スマホだといろんなアプリに送れたりするシェア機能がある。 WebサイトでもWeb Share APIを使うとできるらしいので試してみた。 サポート状況は、SafariとAndroidのChromだけ。 ・Can I use... Support tables for HTML5, CSS3, etc 使い方 すごく簡単。 pri…
クリップボードコピーについて、いろいろやってみてるけど、 nuxt-clipboard2を使うとすごく簡単だった。ので、そのときの備忘録。 nuxt-clipboard2は、vue-clipboard2のNuxtモジュールで、 vue-clipboard2は、clipboard.jsのVueライブラリ インストール $ n…
PNGの軽量化をWebサービスを使ってやっていたけど、 コマンドでやりたくなったので調べてみたときの備忘録。 pngquantというのがあるらしい。。 インストール $ brew install pngquant 圧縮する # 上書き保存(-f --ext) $ pngquant -f --ext .png image.png …
前も書いたけど、ZEITからVercelになったらしく、 だいぶ楽にFaaSできるようになったので試してみた。すごく簡単だった。。(´ω｀) このサンプルのソースはこちら。 使ってみる インストールとか # package.jsonの作成 $ npm init # 必要なパッケージをインス…
TypeScriptでNuxtしたくて、vuex-module-decoratorsとnuxt-client-initを使ったら、 nuxtClientInit内で$axiosがnullだったときの備忘録。 Nuxt TypeScriptのストアのガイドを見ているけど、 プラグインのほうが後に呼ばれるので、自分で初期化しないといけ…
