Nuxt.jsのSSR/CSR処理について
はじめに Nuxt.js の SSR/CSR の処理がどう動いているか（ライフサイクル）、また、安全な処理を書くにはどうしたらいいのか、いまいち分かっていない方や曖昧な方も多いと思います。 今回の記事では、Nuxt.js での開発における SSR/CSR 処理とセキュアなデータの取り扱いについて少し書きます。 ライフサイクルを理解し、Nuxt.js でどのように情報を扱うべきか検討しやすくなります。 AWS や GCP、Firebase、Azure など、クラウドサービスと連携するにあたりセキュアな情報の取り扱いで悩むことが出てくると思います。 AWS でいうと AppSync や API Gateway、S3 などの各種サービスに接続するための認証情報をどのようにフロントエンドで安全に扱うか、という点は気になるポイントだと思います。 この記事は直接ある特定のサービスへの接続方法のソリュー
ここが変だよ Nuxt.js: No.3 axions の設定、SSR のためのデータのフェッチ
ノーマル axios と違う点 import axios from 'axios' ではなく、@nuxt/axios を nuxt.config.js に modules として登録することで、アプリケーションに module として組み込まれる。これを使う。 アプリケーションに登録した axios module を使う asyncData のときは ({ $axios }) で受けることができる。 通常のコンポーネント、vuex store 内では this.$axios でアクスセスできる。 // Component // asyncData async asyncData({ $axios }) { // asyncData という nuxt 特有の機能において const ip = await $axios.$get('http://icanhazip.com') return {
【Jest】Nuxt.jsでテストコードを書いてみよう！【学習方法】｜ProgLearn｜エンジニアのためのプログラミング情報メディア
みなさん、こんにちは。どんぶラッコです。 みなさんはテストコードを記述しているでしょうか？ エンジニア初級者から中級者にレベルアップするにあたっての必須項目でもあると思います。 今回は、Nuxt.jsでのテストコードのセットアップ方法とその書き方の基礎についてご紹介していきたいと思います！ セットアップ手順 インストール時にセットアップする方法と手動で追加する方法があります。 npx create-nuxt-app 時に選択する Choose test framework という選択項目で Jest または AVA を選択すると、インストール時をすると同時にセットアップをしてくれます。私の場合、Facebookが開発したフレームワークであるJestを利用しています。 $ npx create-nuxt-app test create-nuxt-app v2.11.1 ✨ Generatin
NGINX
map $sent_http_content_type $expires { "text/html" epoch; "text/html; charset=utf-8" epoch; default off; } server { listen 80; # nginxがリッスンしているポート server_name your-domain; # ここにドメインをセットアップ gzip on; gzip_types text/plain application/xml text/css application/javascript; gzip_min_length 1000; location / { expires $expires; proxy_redirect off; proxy_set_header Host $host; proxy_set_header X-Real-IP $r
1
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
処理を実行中です
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く
【Nuxt.js】Axios Mock が便利！｜ProgLearn｜エンジニアのためのプログラミング情報メディア
It doesn't work with nuxt.js v2.9.0 + typescript + vuetify. · Issue #85 · nuxt/typescript
