VuexFireでNuxt.jsアプリに一瞬でFirestoreを導入する - Qiita
今回のチュートリアルではNuxt.jsを使っていますが、全部フロントエンドで動いているのでVue.jsアプリでも同様に動きます。 TL;DR サンプルコードはGithubにあります。 VuexFireを使ってNuxt.jsアプリでFirestoreからデータを取得しページに表示させます。また、ページ上のフォームからFirestoreにデータを追加します。 はじめに 前回の記事でVuex.jsとFirebaseのCloud Functionsを使ってSSRアプリを作ってみました。 そのアプリをベースに、今回はVuexFireを使ってFirestoreを導入してみます。 FirestoreはFirebaseの提供するNoSQLデータベースです。現在はβ版ですが、今後Firebase Realtime Databaseに代わりFirebaseのデータベースサービスになっていくようです。 Step
【Vue.js,Firebase】麻雀好きのエンジニアによる麻雀好きのためのサーバレスな麻雀成績管理PWAアプリをリリースした【個人開発】 - Qiita
【Vue.js,Firebase】麻雀好きのエンジニアによる麻雀好きのためのサーバレスな麻雀成績管理PWAアプリをリリースした【個人開発】Vue.jsWebサービスFirebase個人開発PWA 今までにない麻雀成績管理アプリをリリースしました！ https://t.co/jjpEyVcSHh 麻雀の成績管理アプリローンチしました！ 全ての麻雀好きのためになりますように！ — kooooohe@旅人 (@kooooohe_) 2018年11月5日 背景 雀荘に行くたびに麻雀の成績をほとんどの人が紙で書いている かくいう私もアプリを数個入れていたが、結局紙に成績をつけてしまっていた... 紙のUI,UXにアプリが勝てていないのか？ 元雀荘店員エンジニアとして、最新技術を駆使し、麻雀成績管理Appを作ることが私の責務である 機能要件 PWA 麻雀の得点を記録できる 得点の履歴が見れる 3人の点
Nuxt v2とFirebase(CloudFirestore)でPWA対応Webアプリ開発 - Qiita
福岡から世界中の"むずかしい"を簡単にする株式会社diffeasyCTOの西@_takeshi_24です。 公開から1年以上が経ち、この記事の内容も少し古くなってきました。 Nuxt.jsやFirebaseを使って、サーバーレスでWebアプリケーションを開発する手順について、アドベントカレンダー「diffeasyCTO西の24(にし)日連続投稿チャレンジ Advent Calendar 2019」の中で、「Nuxt.jsとFirebaseとCloudFunctionsでWebアプリ開発」シリーズとして、連載していきます。 Nuxt.jsとFirebaseなどを使ってWebアプリケーション開発にチャレンジしたい方、是非Qiitaアカウントかtwitterをフォローしていただき、ツッコミやいいね！お願いします！ 言葉の説明 まずはNuxt、Firebase、PWAの説明です。 ご存知の方はすっ
Firestore で、DB設計を考える際に参考になった情報
Firestore におけるDB設計 DB設計について考える場合、そもそもFirestoreのようなドキュメント指向のNoSQLデータベースではどんなDB設計をするべきなのか、いろいろと情報を漁ってみました。 以下は、いろいろ調べた中で、個人的に参考になった記事です。 おそらくFirestore のDB設計について考える場合、今回挙げた記事は、何度も読むことになりそうなので、備忘録的に残すことにしました。 NoSQLデータモデリング技法 参考になった点 Firestore に限定されず、NoSQLデータベースとしてのプラクティスが網羅されている いきなり具体例ではなく、概念から解説してから、具体的な技法について解説している RDBでは、基本的には、正規化を徹底するが、NoSQLデータベースでは、非正規化を許容する、むしろ活かす Firestore Database Design https
Googleの新サービス Firebase Cloud Firestore の使い方を簡単にご紹介。
Firestoreについて 昨日(2017-10-04)、Googleが提供しているFirebaseに、新しいデータベースサービスCloud Firestoreが追加されました。以前からFirebaseには興味がありで、ちょうど良い機会だったのでCloud Firestoreを触ってみました。 最終的にCloud Firestoreを使ったTodoアプリの作成をご紹介いたします。 慣れないと不安なセキュリティに関する部分も簡単ではありますが解説しますので、Google Firebaseに初めて触れる方がいましたら、私も初心者ですので一緒に頑張っていきましょう。 Firestoreのドキュメント 基本的にはGoogle公式のCloud Firestoreドキュメントの通りに実装していきます。現在は英語ですが、コード等に迷ったらこちらをご参照ください。 Cloud Firestoreの準備 F
Cloud Firestore with Vue.jsで簡単なメモアプリを実装する - Qiita
概要 以前に投稿した「Vue.jsで簡単なメモアプリを実装する 」に続く記事で、メモアプリのデータ管理をGoogleのCloud FirestoreというNoSQLデータベースを利用するように改修しました。 この記事の前半でCloud Firestoreを利用するまでの手順、後半でメモアプリをどのように改修したのかを説明します。 環境 Windows 10 Professional Node.js 8.11.1 Vue.js 2.5.16 Vuex 3.0.1 vue-router 3.0.1 firebase 4.13.1 Cloud Firebase Beta Visual Studio Code 1.23.0 参考 Cloud Firestore | Firebase Overview | Firebase Googleが運営するFirebaseというMBaasサービスがありますが、
GAE+NuxtのSSRでFirestoreを使う - Crieit
App Engineの標準環境でNuxtを使って無料SSR を先日やってみたので、今度はFirebaseのCloud Firestoreでデータの保存を試してみました。 ちなみにGAEのスタンダード環境ではNode8が動くため、ローカルでも全てNode8で動かす必要があります。 ※また後日記事を書きますが、通常セキュリティルールが入っているため、実際にはcloud functions経由でfirebase-adminを利用してデータを取ってくる必要があります。 Firebaseの初期設定 plugins/firebase.jsに下記のように設定を保存します。 import * as firebase from "firebase"; require("firebase/firestore"); if (!firebase.apps.length) { const config = { ap
トランザクションとバッチ書き込み | Firestore | Firebase
フィードバックを送信 トランザクションとバッチ書き込み コレクションでコンテンツを整理 必要に応じて、コンテンツの保存と分類を行います。 Cloud Firestore は、データを読み書きするアトミック オペレーションをサポートしています。一連のアトミック オペレーションでは、すべてのオペレーションが正常に完了するか、またはどのオペレーションも適用されないかのいずれかです。Cloud Firestore には 2 種類のアトミック オペレーションがあります。 トランザクション: トランザクションとは、1 つ以上のドキュメントに対して読み取り / 書き込みを行う一連のオペレーションのことです。 バッチ書き込み: バッチ書き込みとは、1 つ以上のドキュメントに対して書き込みを行う一連のオペレーションです。 トランザクションでデータを更新する Cloud Firestore クライアント ライ
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 の資
Firebase Cloud Firestoreを使ってみる - Qiita
はじめに 仕事仲間とサーバレスな話をしててFirebaseいろいろ無料ですげーみたいな話になった。AWS lambdaやAzure Functionsなんかでビジネスロジックをピタゴラスイッチしてユーザーに向けた出力を考えると、Firebaseはホスティング、データストア、Notificationとアプリに必要なものがタダ同然である。 最近Firebaseのことをみてなかったので久々に調べてたらCloud Firestoreという知らないやつがあったので使ってみることにした。 FirestoreはRealtime Databaseと同様のデータベースサービス。Realtime DatabaseがJSONで構造化されたデータをストアするのに対し、Firestoreはドキュメント指向DBライクな階層型の構造化データをストアでき、クエリ処理が利用できる。MongoDBみたいな感じのDB。Real
Cloud Firestoreは進化したFirebase Realtime Database - Qiita
Cloud Firestoreファーストインプレッション リリース発表をついに来たか！って思いました。そしてFirestoreとFirebase Realtime Databaseがどう違うのかを読んで、大きく進化したなぁって思いました。そして実際に使ってみて、これはもはや別物って思いました。 FirestoreとFirebase Realtime Databaseの違いについてはすでにこちらでまとめられていたのでこちらをご覧ください。 https://qiita.com/Yatima/items/54ea22d0cea1acc6cbcb Cloud Firestoreのすごいところ FirestoreにはBoringSSLが使われている BordingSSLはGoogleによるOpenSSLのfork。2014年にForkを発表して、すでにAndroidなどでは使われていたようですが、本
SCOUTER開発者ブログ
2024-04-29 CSSってどんな勉強をしたらいいの？おすすめの勉強法3選！ 文字やタブなどWebサイトのデザインを作成するマークアップ言語がCSSです。 CSSを勉強すると、おしゃれなWebサイトやかっこいいWebサイトが作れるようになります。 また、Webサイトを作るときに必要なHTMLを理解するのにも役立ちます。 CSSを勉強するならできるだけ効率よく勉強できるようになりたいですよね。 ではCSSの勉強法はどのようなものがあるのでしょうか。 CSSの勉強法は、スクール […] 2024-04-29 WEBエンジニアから見たXserverの使い勝手と評判 レンタルサーバーのおすすめサイトを見ると、大体どこでも上がってくる有料のレンタルサーバーの一つに「Xserver」があります。 このXserverとは、どのようなサーバーで、サービスにはどのようなものがあるのか。 ホームページ関連
1
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く
Choose a database: Cloud Firestore or Realtime Database | Firebase
Firebase Cloud Firestoreの使い方 - Qiita