１つめのFirestoreセキュリティルールテスト - Qiita
本記事はFirebase公式ドキュメントを噛み砕いた内容になってます。 公式ドキュメントにはテストツールについて触れられておらず個人的に進めずらかったので、環境構築の部分とテストツールとしてJestを利用する方法を織り交ぜてまとめました。 エミュレータの嬉しいところ セキュリティルールのテストはFirestoreのローカルエミュレータを使用すると開発効率がUPします。 Firestoreのセキュリティルールが正しく記述できているかどうかをクライアント側でいちいち確認しようとすると、エラーが発生したときにPermission Deniedとしか出力されません。これでは原因調査がなかなか大変なのですが、ローカルエミュレータを使用するともう少し詳細な原因を提示してくれるのでルールの記述が捗って嬉しいです☺️ 前準備として FirebaseCLIでプロジェクトの設定は終わっている状態です。 fir
Vue, Nuxtで使いそうな CSS フレームワークをまとめてみた - Qiita
はじめに 今後、新しいプロジェクトで、Vue,Nuxtを使いそうなので、調べたところ今時のフロントエンドはいい感じのライブラリーがたくさんあることを知りました。 どれが、どのようにいいとかが正直わからかったので、とりあえず公式サイトまとめを作ってみました。 対象読者 Vue(Nuxt)を始めるよって人 フレームワークたくさんあるので、ドキュメントをまとめたものをみたいって人 フレームワークたち 更新 ここに全部のってました😂 https://codezine.jp/article/detail/11566 Boostrap 言わずと知れた。 その昔、サイトのデザインを見ればこれはBootsrapでできているってわかったなぁ。 公式サイト Bulma Flex Box レスポンシブ対応 公式サイト Tachyins 軽量cssフレームワーク 公式サイト 参考記事 手軽にコーディングするなら
Web Bluetooth APIとFirebaseでIoTドールハウス的なものを作ってみた話 - Qiita
Web Bluetooth APIとFirebaseでIoTドールハウス的なものを作ってみた話 概要 ちょっと前のコミティアで自作のドールハウスもどき1を作って、その中の照明とか窓枠のディスプレイとかを来場者のスマホからリモコン制御できるようにしてみた話です。 Bluetooth機器はLED照明のPLAYBULBE、技術的にはWeb Bluetooth API・Firebase・Riot.js・ES6(ES2015)・anime.jsあたりつかってます。 作ったもの 窓の外の景色と室内の照明をスマホのブラウザをリモコンにしてコントロールできるようになってます。 ポイント： カメラでQRコードを読むだけでリモコンが一発起動。Webなのでインストール不要！ 複数人で同時操作もOK！他の人が景色や照明を変えると、手元のリモコン画面にも即座に反映 全てWeb技術で完結。半田ごてもラズパイも不要！（
リーンキャンバスをMarkdownで書く - Qiita
はじめに 私は新規サービス・製品を企画開発する部署に所属している関係で、リーンキャンバスを書く機会が割とあります。 みなさんはキャンバスを書くとき、どんなツール使ってますか？ 私の場合はExcelです。 Excelという慣れたツールで気軽に書けるのはとても良いことですが、歴史を刻んだキャンバスでは色々と苦しくなってくる側面もあります。 いつ、どこを変更したかわからない。 変更することになったトリガー、背景がわからない。 「変更履歴書けよ」とか「自動で履歴残す機能あるよ」って声が聞こえてきそうですが、多くの場合履歴を書くのをサボる私のような人が出てきたり、自動で履歴が残ったとしても編集理由までは記録できません。 また、草案レベルではMarkdownでカジュアルに編集することも多いので、「Markdownがそのままリーンキャンバス(HTML)になったら良いんじゃね？gitで管理できるし」という
Firebase Functions 上に GraphQL サーバーを実装する - Qiita
この記事は１ヶ月後の自分のネタ切れにつきアドベントカレンダーの記事ということになりました Why SPA や モバイルアプリ だととりあえず Firebase Functions に graphql エンドポイントを一個マウントして金で殴ってスケールさせるところからスタートするのがいいと思います。金の弾丸というやつです。 この環境は、query と mutation は実装できるけど、 Cloud Functions のライフサイクルの都合上、 wsバックエンドのsubscription は実装できません。そこは Firestore とか使ってなんとかできるんでいいかって感じ。 自分の用途としては、Firestore の write系は一律禁止、 read 系は firebase.rules で制御しつつ subscribe して、リアルタイムではない複雑な問い合わせやロジック検証付きの副
Cloud Storage for Firebaseのレスポンスを爆速化した話 - Qiita
概要 Cloud Storage for Firebase（以降CSF）のレスポンスの悪さに何とかしたいと悩んでいたのですが、クックパッドさんのテックブログによりレスポンスが大幅に改善しました。 CSFの封印された能力を開放するには、具体的どうすれば改善できるかという話です。 ただし、世の中美味しい話はそうそうありません。界王拳10倍なんてやったらトレードオフで体への負担がｒｙ 残念ながら爆速化できるのは、誰でも閲覧可能、つまりGetが来たら無条件でデータを返すものに限られます。 Firebaseのルールで書くとallow read: if true;が対象になります。 読者対象 無条件で読み込み可能なデータがあり、速度を改善したいと思っている方 Special thanks クックパッドさんのこの投稿がなければ、私はこの高みに到達できませんでした。 素晴らしい投稿ありがとうございましたm
OneSignalを使って超簡単に、特定のユーザへのブラウザpushを作る - Qiita
この記事はエイチームブライズアドベントカレンダー3日目の記事です。 はじめに 今回エイチームブライズのアドベントカレンダー2017に初投稿になります。 何を書こうかなーと悩んだんですが、最近使ってとても便利だったOneSignalについて書いてみようと思います。 OneSignalとは 無料で使える A/Bテスト、ユーザープロパティ、自動配信などの機能もある iOS, Android, Web Push, Unityなどに対応 配信は１秒間に5,000プッシュまで可能 SSL対応してないサイトでもプッシュ通知を送れる OneSignalを導入しブラウザプッシュを実現する OneSignalでアプリケーションの作成 Dashboardから 「Add a new app」を選択しアプリケーション名を登録。 Website Push を選択。 Safariへの通知は別途対応が必要みたい。 今回は
【2019年4月版】JavaScriptのconsoleがすごいことになってた。 - Qiita
JavaScript の console がすごいことになっているらしい。 本日、以下の記事を見つけました。 Getting creative with the Console API! この記事で紹介されている console のメソッド全然知らなかったのでビックリしましたが、実際にどう表示されるのか載っていなかったのでChromeのコンソールでスクショを取ってみました。 console.log() 本文によるとlogメソッド内のテキストリテラルは以下の書式で値のフォーマットと置換ができるそうです。 %o / %O - for objects; %d / %i - for integers; %s - for strings; %f - for floating-point numbers; マジすか・・・ そんなわけで以下のコード console.log("Object value:
ZOZO大忘年会でFirebaseを使った1,000人規模のリアルタイムアンケートを費用2円で制作した話 - Qiita
この記事はZOZOテクノロジーズ TECH BLOGにも同じ内容で投稿しています。よろしければ他の記事もご覧ください。 こんにちは！ ZOZOテクノロジーズ フロントエンドエンジニアの高橋（ニックネームはQ）です（@anaheim0894） 昨年12/26、毎年年末に行われる大忘年会（ZOZOCAMP2018）で、グループ会社も含めた1,000人規模でのリアルタイムアンケートを、FirebaseとVue.jsを使って制作しました。 当日会場にて弊社の昨年の事業紹介や、「楽しく働く」というコンセプトの動画を流し、動画の合間で質問をし動画と一体となるような演出を行いました。 その質問に対して全社員それぞれのスマートフォンで回答できるシステムを作ったので、その制作の裏側や、当日の様子などご紹介させていただきます。 まずは当日の様子の紹介 これを実現するまでの様子をご紹介いたします。 CAMP運営
ESP32でGoogle Play Musicを再生する
はじめに ESP32でmp3をhttp経由で再生できるライブラリの存在と、スピーカーで音声出力が可能とわかったので それならばGoogle Play Musicを再生できるポータブルプレイヤー作れるのではと思ったのがきっかけになります。 小型の再生機器はどれもローカルのメモリやSDカードからの再生で、曲を追加するのにPCに持ってきて追加が必要など、曲の更新に重い腰が動かず放置しがちでした。 少し値段をだせばDLNA連携プレイヤーなどありますが、これらは曲の管理やサーバーなどは使い勝手のいいイメージはありません。 GooglePlayMusicはクラウドで曲の管理ができ、プレイリストも自由に作れるため、これを再生できるプレイヤーが作れれば最新の曲を聞く機会が増えそうです。 ※電子工作とかマイコンとかArduino触ったことないド素人がESP32安くて高機能ですげーーっという勢いで数ヶ月適当に
これからEthereumでDApps開発する人にオススメサイト - Qiita
概要 「Ethereumのスマートコントラクト使ってDApps作りたい！けど、何から始めれば良いの？」 って人向けに自分が調べて役立ったサイトを整理してみました。 初学者向け Ethereum入門 ブロックチェーンとEthereumの簡単な説明がまとまっているので一番最初に読んでおくのが良いのかなと思いました。また、geth というEthereumのクライアントツールを使ってマイニングや送金の方法を学ぶことができます。 CryptoZombies | イーサリアムでのゲーム開発を学ぶ Ethereumのスマートコントラクトを開発する場合に使用する言語は Solidity ですが、そのSolidityを勉強しながら実際にコーディングして学べるサイトです。2018年5月時点では6章までありますがこれから追加されていくようです。さらに、６章まで終わらすと 「10 LOOM」 報酬が貰えます！ 今
tess-twoでAndroidアプリにOCR機能を追加する - Qiita
SlideViewer というアプリをリリースしています。 そこでは、Speaker Deck のスライドを表示できているのですが、テキストをコピーしたりはできません。 そこで、 https://github.com/noboru-i/SlideViewer/pull/44/files の変更を加えて、OCR機能を追加しました。 tess-twoを導入する Tesseract というOCRのライブラリを利用することにしました。 rmtheis/tess-two というTesseractのラッパーライブラリが、Androidへの導入には簡単そうでした。 READMEに書いてあるとおり、compile 'com.rmtheis:tess-two:6.2.0'を追加します。 また、NDKが必要とのことだったので、 プロジェクトへの C / C++ コードの追加 | Android Studio
Google Cloud Vision APIのOCR（画像認識）を検証する - Qiita
今回はこの中の「文章検知（OCR）」を使っています。 検証に使った画像 今回、色々なパターンの画像を使い、どのくらいの精度で検知が出来るのか試してみました。検証に使った画像は以下の通りです。 キャプチャ画像（文字のみ） キャプチャ画像（イラスト＆文字） 印刷物を撮影したデータ（Word文章） 印刷物を撮影（Excel表） 手書き文字を撮影 （おまけ）アラビア文字 検証環境 以下の環境で検証しています。 - AWS EC2 Amazon Linux - PHP 5.3.29 - Google Cloud Vision V1 検証方法 APIキーの取得 まずはGoogle Cloud Visionを使用するにあたって必要なAPIキーをGoogle Developers Consoleから取得します。 Google Developers Console サンプルプログラム サンプルプログラムはこ
ColaboratoryでTesseract-OCRを動かしてみる - Qiita
今回はGoogleが機械学習の学習や研究用に提供をしているColaboratoryを扱ってみます。 これまでのブログは、Jupyter Notebookで、ローカル環境のブラウザで、プログラムの動作確認をしていました。 ColaboratoryはGoogleのアカウントがあれば、ソフトウェアインストールなしで、Jupyter Notebookと同等な環境を使用できるので、非常に便利です。 Colaboratoryを使ってみる。 Googleアカウントでログインした状態で、Colaboratoryにアクセスしてみます。 ファイルメニューから「Python3のノートブックを新規作成」を選ぶと以下のような編集画面になります。 Jupyter Notebookと画面も操作性もほぼ同じです。 ノートでの解析処理は、ハードウェアアクセラレーターを使用することも可能です。 ランタイムメニューの「ランタイ
MeshLabで点群データ処理 - Qiita
MeshLabとは MeshLabはWindows、Macで使えるフリーの３Dデータ編集ソフトです。 メッシュの処理に特化したソフトであり、三角形メッシュの編集、クリーニング、フィルタリング、レンダリングなどをすることができる優れもの！ また、３次元点群処理も行うことができます！ 基本的な処理であったり、プログラムを書かずにメッシュの編集がしたい場合にもってこいです！！ 公式サイトより無料でダウンロードできます。 公式サイトURL：http://meshlab.sourceforge.net/ MeshLabの使い方 基本的な使い方に関してはこちらがすごくわかりやすかったので、ご参照ください。 今回は点群データ処理の手順を書いていこうと思います。 点群データの読み込み MeshLabが読み込めるデータには PLY, STL, OFF, OBJ, 3DS, COLLADA, PTX, V3D
JINS MEME APIで生体データ可視化にチャレンジ！ - Qiita
※2021-10-08 こちらは旧世代JINS MEME向けの記事になります。現行機ではOffice/RunNext/Driveのデータは15秒間隔データに統合されています。詳細は公式ドキュメントを御覧ください。 国産Web API Advent Calendar 2018 の6日目は、ちょっと珍しい 生体データ に関するAPIをご紹介したいと思います。 JINS MEME と Web API について JINSでは「客観性を持ってユーザーが自身を振り返ることでより良い自分(Better me)を実現する」というビジョンのもと2015年にメガネ型ウェアラブルデバイス、JINS MEME を発売しました。 JINS MEMEは瞬き等を検出する眼電位センサー・頭部の動きを検出する6軸センサーを搭載しています。メガネで取得したデータをスマホにストリームし 集中・歩走行姿勢・運転時眠気（覚醒度）
Smart Device Link(スマートデバイスリンク）の情報 - Qiita
Smart Device Link(SDL:スマートデバイスリンク）の情報をまとめる。 ※日本語情報があまりないので公式ドキュメントの意訳となります Smart Device Linkとは スマートフォンと車載器を連携するためのオープンソース仕様。 車載器向けのライブラリと、iOS、Android向けのSDKが提供されている。 もともとはFordのAppLinkという車載器向けアプリを作る基盤だったものを2013年にSmart Device Linkとして公開された。 スマートフォン、車載器それぞれOSが異なっていてもSmart Device Linkをサポートしていれば、自動車でナビ、音楽、インターネットを楽しむことができる 概念 車載器がSmart Device Linkに対応していれば、Smart Device Linkに対応したスマートフォンのアプリが車載器および車のインターフェー
JavaScript の テンプレートリテラル を極める！ - Qiita
テンプレートリテラルとは、ECMAScript 6 で新しく使えるようになった構文のひとつです。 言わばヒアドキュメントのようなものです。めちゃくちゃ便利です！ 2015年8月現在、Google Chrome と Firefox の最新版では既に使えるようになっています。 2016年9月現在、Edgeでも使えるようになっており、Google Chrome や Firefox も含めたほとんどのモダンブラウザで利用可能です。 （残念ながらモバイルブラウザではまだ非対応のこともあるので、要注意です。） 基本 この内容を知っているだけでもカナリ使えます！ バッククオート（`～`）で囲む！ var a = "ジャバスクリプト"; var b = `ジャバスクリプト`; console.log( a === b ); // true console.log( b ); // ジャバスクリプト
メモ：Home Assistant + Raspberry Pi + センサー でホームオートメーションしたい #1 - Qiita
Home Assistantとは Pythonで作られた、オープンソースのホームオートメーションプラットホーム。この分野では、OpenHABというものもあるようだ。 「コンポーネント」と呼ばれる機能を自由に組み合わせて、各コンポーネントが対応するデバイスの制御や自動化を行うことができる。また、Webページに状態を表示し、そこから制御することもできる。 対応するコンポーネントには、電動シャッターなど国内では入手できなさそうなIoT機器もあるが、 IFTTT Twitter PushBullet Philips Hue Raspberry PiのGPIO入出力 Firmata(汎用入出力制御プロトコル)ファームウェアを搭載したArduino MQTTを介した入出力 HTTPを介した入出力 iTunesやGoogle Cast、MPDといったネットワークメディアプレイヤーのデバイス発見と、再生・
ブラウザだけで micro:bit javascriptブロックエディター用パッケージ（拡張）が作れるGitHub package authoring - Qiita
これまでの状況 これまでmicro:bitの javascriptブロックエディター(以下makecode）用パッケージを作ろうとすると、nodeの環境設定でハマったり、bumpしてもすぐに反映されなかったりと、やる気を削がれる事が多い状況でした。 2018年9月9日現在、まだリリースされていませんが、まもなくmakecodeがリニューアルします。 これに合わせて、ブラウザだけでパッケージを作る事が出来るGitHub package authoring がリリースされます。 サンプルとして何もしない「コメントブロック」を作ってみる makecodeには元々コメント機能があります。従来はコメントを表示しっぱなしに出来なかったのですが、v1-betaからは、表示しっぱなしに出来るようになりオーっと思ったのですが、まだツッコミどころは一杯ありそうです。 そこで、GitHub package au
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く
