一休.com、Yahoo!トラベルのNuxtをNuxt3にアップグレードしました - 一休.com Developers Blog
CTO室プラットフォーム開発チームの山口(@igayamaguchi)です。 プラットフォーム開発チームではさらに内部でプロジェクトチームが分かれており、私はフロントエンド改善チームというチームでリーダーをしています。 フロントエンド改善チームでは主に一休.com、Yahoo!トラベルのフロントエンドの改善を行っております。 今回は一休.com、Yahoo!トラベルで使用しているNuxtのバージョンを2から3にアップグレードしたお話をさせていただきます。 一休.com、Yahoo!トラベルではトップページや検索ページ、ホテル・旅館の詳細ページなど主要なページのフロントエンドはNuxtで開発されています。 NuxtのバックエンドにはGo+gqlgenでGraphQLのサーバーを立てており、NuxtからはApolloを使用してバックエンドと通信を行っています。 このNuxtのバージョンは2とな
NuxtにStorybookを導入する 〜環境構築から使い方、Amplifyデプロイまで〜
ハコザキです。 今回は、NuxtプロジェクトにStorybookの導入、基本的な使い方、Amplifyへの自動デプロイまでをご紹介します！ はじめに Storybookとはコンポーネントの見た目・挙動を開発環境を立ち上げることなく確認できる コンポーネントライブラリツールです。 カタログのような見た目で共有できるのでデザイナーの方とのやりとりも容易になります。 Storybookの詳しいメリットなどについては、こちらで詳しく説明がされてました..！ 今回は3つに分けて解説していきたいと思います！ Nuxt.jsプロジェクトにStorybookを導入、共通設定コンポーネントごとのストーリーの定義Amplifyを用いての自動デプロイ、Basic認証 Nuxt.jsプロジェクトの新規作成についてはこちら ※今回のNuxt.jsのバージョンは 2.15.3 です 準備 このようなlist-item
Nuxt.js使ってみた - Qiita
福岡でVR・アプリ開発をやっている株式会社OneSmallStepの@_takeshi_24です。 公開から2年が経ち、この記事の内容も少し古くなってきました。 Nuxt.jsやFirebaseを使って、サーバーレスでWebアプリケーションを開発する手順について、アドベントカレンダー「diffeasyCTO西の24(にし)日連続投稿チャレンジ Advent Calendar 2019」の中で、「Nuxt.jsとFirebaseとCloudFunctionsでWebアプリ開発」シリーズとして、連載していきます。 Nuxt.jsとFirebaseなどを使ってWebアプリケーション開発にチャレンジしたい方、是非Qiitaアカウントかtwitterをフォローしていただき、ツッコミやいいね！お願いします！ Nuxt.jsとは 公式ドキュメントに詳しく書いていますが、Vue.js アプリケーションを構
Vuex PersistedStateの値の復帰のタイミングが謎だったのでNuxtのplugin書いて解決した
背景先日から Vue (Nuxt) + Vuex + Vuex PersistedSate でモノを動かしてるんだけど、 なんかふいにデータが矛盾して動作がおかしくなる ことが起きていた。 まぁアタリはついていて、Nuxtでrouteに応じてVuex Storeをmodule分割する方法 - あーありがち(2018-04-19) にある動的に module 構造の Vuex Store を生成している処理と、 Vuex PersistedState を通じて localStorage からデータが返ってくる処理がそれぞれバラバラに動いていることで、「Vuex Store の値を見て判定する処理」がタイミング次第の微妙なシロモノになっているんだろうなぁと思ってたんだけど、決定的な解決策が見つからないでいた。 通常の使い方だと問題にならないけどテストしてるとよく踏み抜くので、ごまかしごまかしや
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
Nuxt.jsとFirebaseを使って簡単なWebサービスを作る＜導入編＞ | non-standard world株式会社
こんにちは。エンジニアの高崎です。 突然ですが、Webサービスをもっと気軽に作れたらいいのになと思ったことはありませんか？ 本格的にWebサービス構築の投資をする前に、需要確認のための動くプロトタイプを作りたい フルスクラッチで作るほどの予算はないんだけど、Webサイトにちょっとした会員限定機能をつけたい など、私達のクライアント様にもそのような課題を抱えている方がたくさんいます。調査した結果、そんな場合の最適解が「Nuxt.js」というフロントエンドのフレームワークと「Firebase」というGoogleが提供しているクラウドサービスを組み合わせて作ることでした。 この記事では「Nuxt.jsとFirebaseを使って簡単なWebサービスを作る」と題して、ハンズオンで簡単なノートを取るWebサービスを作る方法をお送りしたいと思います。 Nuxt.jsって？ SPA＊フレームワーク。Vue
Nuxt.jsとaws-amplifyでログインするだけ - Qiita
Nuxt.jsとAmazon Cognitoでユーザー登録、ログインを実装しました。 mode:'spa'です。 リポジトリ: nuxt-aws-amplify-sample 実装にあたり以下の記事とリポジトリを大いに参考にしました。 aws-amplifyをnuxt.jsで使ってみた aws-amplify-vue aws-amplify-react Cognitoの準備 ユーザープール作成 基本的にはデフォルトのままです。１ヶ所だけ変えています。 「属性」の「エンドユーザーをどのようにサインインさせますか」を「Eメールアドレスおよび電話番号」「Eメールアドレスを許可」に変更します。 これにより、メールアドレスでログインできるようになります。 ユーザープールを作成すると、「プールID」が発行されます。 「アプリクライアント」を開きます。「クライアントシークレットを作成」のチェックを外し、
1
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く
https://tamanyan.me/typescript-nuxtjs-firebase/
How to use a same component for two or multiple routes / pages? · Issue #2693 · nuxt/nuxt
Nuxt.jsとFirebaseでSPA×SSR×PWA×サーバーレスを実現する - DMM inside