タグ

firebaseとVueに関するy_yukiのブックマーク (7)

  • 【Firebase, Nuxt】リアルタイムなスライド共有サービスを作ってハッカソンで優勝した話 - Qiita

    昨年末にFirebaseのアイデアソン/ハッカソンに参加しました。 その場で出会った3名で即席チームを結成して、約1ヶ月でFirebaseを使ったサービスを開発しました。 その結果、最優秀賞を獲得し、更に1ヶ月で機能を追加して、サービスを正式リリースしました! 自分なりに大きな経験になったので、その経緯をサービス紹介を含めて公開します。 個人開発したいと思っているエンジニアで、参考にしてくれる人がいたら幸いです。 どんなサービスか "SlideLive(スライドライブ)"といいます。 勉強会やセミナーのライブ感を飛躍的に高めるリアルタイムスライド共有サービス です。 SlideLiveのコンセプト 勉強会をライブに 私はプレゼンが苦手です。 「アイスブレイク」ってどうやったらいいのでしょうか? 「勉強会でプレゼンしている時にリアクションが無く緊張する」ことってありませんか? そんな課題認識

    【Firebase, Nuxt】リアルタイムなスライド共有サービスを作ってハッカソンで優勝した話 - Qiita
  • Firebase + Nuxt.js + RaspberryPiで作る猫監視システム - Qiita

    かねてから作りたかった動体検知と画像判定を用いた監視アプリを作成することができたので、ご紹介です。 完成したもの FirebaseにホスティングされたPWA対応のWebアプリです。 ラズパイのカメラがを検知すると、画像がアップロードされ、飼い主にPush通知が飛びます。 ソースコード ソースコードは下記のリポジトリで公開しています。 機能一覧 動体検知による画像取得 画像判定 Google認証 画像一覧 PWA Push通知 モチベーション 以下のモチベーションから、システムを開発しました。 家に不在の時、飼いが何をしているのか気になった WebアプリでFirebaseを使い倒してみたかった 開発工数 ざっと3人日ほどです。 会社の開発合宿を利用して開発しました。 開発合宿ってどんなものか気になる方はこちら。 採用技術 システムで採用した技術は下記の通りです。 infra(Fir

    Firebase + Nuxt.js + RaspberryPiで作る猫監視システム - Qiita
  • Firebase+Vue.jsで大学の関係者だけが見れるサイトをサクッと作る - Qiita

    4/14 追記 : この方法はフロントでメアドの判別をしているため、やろうと思えば中身を見ることが出来てしまいます。当に見られたくないページを作成したい場合、Cloud Functionsを使うことでバックエンドでデータを取れなくなり見れなくなるという設計になります。 @potato4d さん @302u2weさん 鋭いご指摘ありがとうございます。 正しい実装は @potato4dさんのコメントにあります。よろしくお願い致します。 注意 大学がG Suiteを使っている前提です。 大学のメールアドレスでGoogleにログイン出来たらG suiteです。 この記事でやること バックエンドをFirebaseに丸投げしてGoogleアカウント認証でのログイン → ユーザ情報(ユーザのメアド)による表示の切り替え → サインアウト までの簡単なチュートリアルです。 大学の関係者の認証方法 大学の

    Firebase+Vue.jsで大学の関係者だけが見れるサイトをサクッと作る - Qiita
  • Firebaseで完結するリッチなWebアプリ構築の勘所 - Qiita

    先日、Togetter社長の@yositosiさんとひょんなことからお友達になり「なんかFirebase使って面白いことやろうよ」という話になったので一緒に面白いことをやりました。 この記事は、 Firebaseを使うと何ができるのか Nuxt.js/Vue.jsとFirebaseの勘所 Firestoreでの複雑なクエリ処理にどう対応するか などのトピックを中心に紹介していければと思っています。 なんとかPay Togetterの社長の@yositosiさんからFirebaseを使ったアプリ構築の話を頂きお手伝いさせていただいた、エイプリルフールの企画の「なんとかPay」というサービス。誰でも自由にPayを発行できる、昨今のPay蔓延している社会に物申しているようなそうでもないようなそんなサービス。 今回は技術周りで色々とお手伝いをさせていただきました! 自分だけのPayが作れる リアル

    Firebaseで完結するリッチなWebアプリ構築の勘所 - Qiita
  • ZOZO大忘年会でFirebaseを使った1,000人規模のリアルタイムアンケートを費用2円で制作した話 - Qiita

    この記事はZOZOテクノロジーTECH BLOGにも同じ内容で投稿しています。よろしければ他の記事もご覧ください。 こんにちは! ZOZOテクノロジーフロントエンドエンジニアの高橋(ニックネームはQ)です(@anaheim0894) 昨年12/26、毎年年末に行われる大忘年会(ZOZOCAMP2018)で、グループ会社も含めた1,000人規模でのリアルタイムアンケートを、FirebaseとVue.jsを使って制作しました。 当日会場にて弊社の昨年の事業紹介や、「楽しく働く」というコンセプトの動画を流し、動画の合間で質問をし動画と一体となるような演出を行いました。 その質問に対して全社員それぞれのスマートフォンで回答できるシステムを作ったので、その制作の裏側や、当日の様子などご紹介させていただきます。 まずは当日の様子の紹介 これを実現するまでの様子をご紹介いたします。 CAMP運営

    ZOZO大忘年会でFirebaseを使った1,000人規模のリアルタイムアンケートを費用2円で制作した話 - Qiita
  • Vue.jsとFirebaseの本を読んで高速にWebサービスを開発してみた - Imomemo

    まずVue.jsとFirebaseのを読んでみた 改訂新版 Vue.jsとFirebaseで作るミニWebサービス (技術書典シリーズ(NextPublishing)) 作者: 渡邊達明出版社/メーカー: インプレスR&D発売日: 2018/10/05メディア: Kindle版この商品を含むブログを見る ワタナベ(id:tatsuaki_w)さんの「Vue.jsとFirebaseで作るミニwebサービス」というイカしたを買ってみました、超絶わかりやすくオススメ出来ます。 Vue.jsもまだまだ分からない部分も多く勉強中ですが、Firebaseに関しては一切触ったことがなかったです。 しかし、使ってみるとこれがめっちゃ便利。 このによって基礎知識を付け、サクッとマークダウンエディターをFirebase上で作ってみて要領を掴みました。 オンラインメモ帳を作ってみた OimoNote |

    Vue.jsとFirebaseの本を読んで高速にWebサービスを開発してみた - Imomemo
  • Nuxt.js, Firebase, Stripe をフル活用してサーバーレスでJAMStackなECサイトを2日で開発した話 - Qiita

    Nuxt.js, Firebase, Stripe をフル活用してサーバーレスでJAMStackなECサイトを2日で開発した話stripeVue.jsFirebasedeprecatedNuxt 記事で紹介しているサービスの公式Twitterアカウントができました → @jslounge_info はじめに potato4d こと花谷拓磨です。 普段は ElevenBack という屋号のもと、フロントエンドを中心としながらも、デザインやサーバーサイドなどをも含めて作業することが多いのですが、屋号での活動の一環として、 JSLounge という渋谷で活動するハンズオン団体の運営を行っています。 その JSLounge にて過去に開催したハンズオン資料を入手できるサイトを構築することとしました。 通常、ハンズオンとなればその場でメンターがついて 1:1 で進めますが、 JSLounge の資

    Nuxt.js, Firebase, Stripe をフル活用してサーバーレスでJAMStackなECサイトを2日で開発した話 - Qiita
  • 1