MENU
  • HOME
  • Blogメモφ(..)
  • Tipsメモφ(..)
  • rails-app
  • nuxt-app
  • vagrant-ansible
  • other
    • GitHub nightonlypj
    • Bitbucket nightonlypj
    • GitLab nightonlypj

Blogメモφ(..)

  • HOME
  • Blogメモφ(..)
  • Tipsメモφ(..)
  • rails-app
  • nuxt-app
  • vagrant-ansible
  • other
    • GitHub nightonlypj
    • Bitbucket nightonlypj
    • GitLab nightonlypj

Vue.js(主にNuxt.jsとVuetify)

  1. HOME
  2. Vue.js(主にNuxt.jsとVuetify)
2022年3月24日 / 最終更新日時 : 2022年3月24日 admin AWS(Amazon Web Services)

API Gateway(WebSocket API)のフロントをNuxtで実装する

API Gateway(WebSocket API)のバックエンドをRailsで実装する で作成したAPI GatewayにWebSocketで接続してメッセージのやり取りが出来るようにします。 仕様は、Action C […]

APIAPI GatewayWebSocket
2022年1月23日 / 最終更新日時 : 2022年1月23日 admin Vue.js(主にNuxt.jsとVuetify)

JestでNuxt+Vuetifyのテストを書く時のTips #2

前回(JestでNuxt+Vuetifyのテストを書く時のTips #1)に続き、今回は異常系とクリックイベントのテストを書いてみました。 これでカバレッジもほぼ100%に。テスト書くと実装漏れに気付けるのでいいですね。 […]

APIJestNuxt.jsVuetify共通化
2022年1月16日 / 最終更新日時 : 2022年1月16日 admin Vue.js(主にNuxt.jsとVuetify)

JestでNuxt+Vuetifyのテストを書く時のTips #1

前回(JestでNuxt+Vuetifyのテストを書いてみる)に続き、今回は初期表示の正常系テストを書いてみました。 最初に対応する時に役立つのでメモしておきます。

JestNuxt.jsVuetify共通化
2021年12月26日 / 最終更新日時 : 2021年12月28日 admin Vue.js(主にNuxt.jsとVuetify)

JestでNuxt+Vuetifyのテストを書いてみる

品質担保やテスト駆動をNuxtでもしたいので、Nuxt導入時に入れたJestでテストを書いてみました。Vuetify使うのは難しくなかったのですが、babel周りの設定やpluginのjsのテストで苦労したのでメモしてお […]

JestNuxt.jsVuetify共通化
2021年11月7日 / 最終更新日時 : 2021年11月10日 admin Ruby on Rails

NuxtとRailsアプリ(Devise Token Auth)の結合テストをする

それぞれのアプリでは問題なく動作しても、いざ繋げると細かい所で意図通りに進まない事は良くあります。特にフロントとバックエンドを分けると、問題となるケースは増えそう。 単体テストはユニットテストで担保するとして、結合テスト […]

APIDevise Token AuthNuxt.jsRSpecseedテスト
2021年10月31日 / 最終更新日時 : 2021年10月31日 admin Vue.js(主にNuxt.jsとVuetify)

mixinとinjectでの共通化と可読性を上げる

プロジェクトが進んで行くと同じような処理が複数のファイルに出てきて、共通化したくなってきます。(スコープ分けたかったので、今までは親子componentの分割に留めました) 共通化する事で、可読性が上がり保守・改修コスト […]

Nuxt.jsVuetifyリファクタリング
2021年10月24日 / 最終更新日時 : 2021年10月23日 admin Vue.js(主にNuxt.jsとVuetify)

Vue.jsにHTMLのautocomplete属性を設定する

ブラウザ側でID・メールアドレスやパスワードを保存してくれるのは便利なのですが、意図しない所(アカウント登録や登録情報変更とか)でも復元されて邪魔だったり、セキュリティ的にここまで復元されると良くなさそうという所もあるの […]

HTML属性Nuxt.jsVuetify
2021年10月18日 / 最終更新日時 : 2021年10月18日 admin Vue.js(主にNuxt.jsとVuetify)

publicRuntimeConfigで環境毎の値を保持とi18n対応

環境(ローカル、テスト・STG・本番)毎に値(APIのURL等)が変わるのを、RailsのConfig Gemみたいに持てないかと、今回は日本語のみですが、言語ファイル(i18n)で共通化出来ないかも試したので、メモして […]

ConfigNuxt.js定数管理日本語化
2021年10月16日 / 最終更新日時 : 2021年10月18日 admin Vue.js(主にNuxt.jsとVuetify)

vee-validateで入力チェックした上で、APIからの入力エラーも各項目に表示する

Nuxt.js+Vuetifyで、アカウント登録画面を実装しました。 フロントで最低限の入力チェックが通ったら、送信ボタンを押せるようにして、無駄なAPIリクエスト減らす。APIからの入力エラーもvee-validate […]

APIDevise Token AuthNuxt.jsVuetify認証
2021年10月10日 / 最終更新日時 : 2021年10月16日 admin Vue.js(主にNuxt.jsとVuetify)

Nuxt.jsとRailsアプリのDevise Token Authを連携させて認証する

Nuxt.jsにnuxt/authを導入して、導入したDevise Token Auth向けにテスト(RSpec)を書くで作成したRailsアプリと連携して認証(ログイン・ログアウト)を実装してみました。

APIDevise Token AuthNuxt.jsVuetify認証

投稿ナビゲーション

  • 固定ページ 1
  • 固定ページ 2
  • »

自己紹介

昨年からフリーランスになり、上場企業でPM兼エンジニアとして、実現方法の検討、Rails+Vue.jsでの開発や改善・提案等を行なっています。
今年から少しですが、スタートアップ企業で技術顧問として、動画配信やAWS周りのサポートもしています。
両社ともフルリモートで事務所に行った事はないですが、問題なく業務が進んでいます。
日々、技術の積み上げを意識して、価値提供を目指しています。

検索(Blogのみ)

カテゴリー

  • AWS(Amazon Web Services)
  • GCP(Google Cloud Platform)
  • Java
  • Ruby on Rails
  • Vue.js(主にNuxt.jsとVuetify)
  • アプリケーション
  • その他
  • ミドルウェア

タグ

Action Cable ActiveRecord Apache API API Gateway Bootstrap CloudFront Config CORS DB設計書 Devise Devise Token Auth Docker DynamoDB Elemental ER図 FactoryBot HLS hls.js Jest Lambda Maven MediaConvert MongoDB MySQL Nuxt.js PostgreSQL RSpec SchemaSpy Seasar2 seed SQLite3 SSL/TLS Struts2 Vuetify WebSocket リファクタリング 共通化 定数管理 日本語化 環境構築 自動生成 設計書 認証 調査

最近の投稿

2022年5月17日 / 最終更新日時 : 2022年5月17日 admin AWS(Amazon Web Services)

CloudWatchにログが出力されなくなったので調べてみた

LambdaのログがCloudWatchに出力されなくなったので調べてみました。 原因は、2つ目のLambda関数を作成した際に、1つ目で作成したロールを指定した為でした。 共通で使うなら、ポリシーも確認しましょうという […]

CloudWatchLambda
2022年5月15日 / 最終更新日時 : 2022年5月15日 admin その他

バグ報告会:やってしまったり遭遇したバグや障害

契約している会社のバグ報告会で登壇する事になったので、今までにやってしまったり、遭遇したバグや障害についてまとめてみました。 場数(バカず?)を踏むのは大切だけど、出来ればヒヤリ・ハットで済ませたいですね。 失敗した事が […]

ApacheCloudFrontCORSDB設計書環境構築設計書調査
2022年5月10日 / 最終更新日時 : 2022年5月17日 admin AWS(Amazon Web Services)

CloudFront+Lambda@EdgeでDynamoDB(MediaConvertの情報)を返す

メモリ消費が少なく(128MB)短時間(5秒)で終わるプログラムであれば、CloudFront+Lambda@Edge(ビューワーリクエスト)の方がAPI GatewayやALBよりもコストが抑えられそう。 ただ、現時点 […]

APICloudFrontCloudWatchCORSDynamoDBLambdaPython
2022年5月7日 / 最終更新日時 : 2022年5月12日 admin AWS(Amazon Web Services)

ALB+LambdaでDynamoDB(MediaConvertの情報)を返す

アクセスが多い場合は、API GatewayよりもALB(Application Load Balancer)経由の方がコストは抑えられます。API Gatewayがリクエスト数に対して、ALBは時間+トラフィックの為。 […]

ALBAPICORSDynamoDBLambdaPython
2022年5月5日 / 最終更新日時 : 2022年5月17日 admin AWS(Amazon Web Services)

API Gateway+LambdaでDynamoDB(MediaConvertの情報)を返す

EventBridgeでMediaConvertの進捗率を取得する でDynamoDBに保存したステータス等の情報をAPIで返却できるようにします。 サーバーレスの選択肢としては、CloudFront Functions […]

APIAPI GatewayCloudWatchCORSDynamoDBEventBridgeLambdaPython
  • プライバシーポリシー
  • お問い合わせ

Copyright © Night Only Project. All Rights Reserved.