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

Nuxt.js

  1. HOME
  2. Nuxt.js
2023年4月23日 / 最終更新日時 : 2023年4月27日 admin Vue.js(主にNuxt.jsとVuetify)

vee-validateにカスタムバリデーションを追加して使用有無を制御する

APIでは不正値が保存されないように必ずバリデーションを掛けますが、フロントは任意。 でも、あった方がユーザーが入力段階で気付けるのと、無駄なAPIリクエストを抑制できる。 フロントだけで完結できるものは追加した方が、親 […]

Nuxt.jsvalidates
2023年1月31日 / 最終更新日時 : 2023年2月1日 admin Vue.js(主にNuxt.jsとVuetify)

既存のRails環境でNuxt.js(CSR)を動かす(URL直打ちすると404になる件の対応)

既存サイトのフロントとAPIの分離を目的にNuxt.js(CSR)を導入しました。 ドメインやインフラは変えずにRailsが動いている環境で動かしたい。 簡単なのはRailsのpublicにgenerateで作成したHT […]

CircleCINuxt.jsyarn環境構築
2022年11月10日 / 最終更新日時 : 2022年11月10日 admin Vue.js(主にNuxt.jsとVuetify)

Dexie.jsでIndexedDBを使ってみる

IndexedDBはブラウザにデータを保持できる仕組みで、大量のデータをフロントで操作する場合や、APIのレスポンス等をキャッシュしたりする時に便利です。 ただ、IndexedDB APIをそのまま使うと同期処理の対応を […]

Dexie.jsIndexedDBNuxt.jsVuetify
2022年10月16日 / 最終更新日時 : 2022年10月28日 admin Vue.js(主にNuxt.jsとVuetify)

v-data-table:ボタンクリック(expand)で複数行の内訳の表示・非表示を切り替える

expandだけだとテーブル構造としては1行しか表示できず、hoverもしない。 追記:item全体をslotすると2行以上表示できて、hoverも出来ました。 一覧で表示し切れない情報を補足的に表示するには良さそう。 […]

Nuxt.jsVuetify
2022年9月11日 / 最終更新日時 : 2022年11月19日 admin Vue.js(主にNuxt.jsとVuetify)

Jestで無限スクロール(Vue-infinite-loading)のテストを書く

無限スクロールと言えばVue-infinite-loadingで、導入記事は多いのですが、 テスト(Jest)の記事は見つからなかったのでメモしておきます。 Vue warnとTypeErrorがなかなか消せなかったり、 […]

JestNuxt.js
2022年9月7日 / 最終更新日時 : 2022年10月9日 admin Vue.js(主にNuxt.jsとVuetify)

NuxtとRailsで、入力項目でEnterを押した時の挙動を調整する

Rails(普通にsubmitしている場合)と、Nuxt(jsでアクションしている場合)で挙動が違うので、確認して調整してみました。 地味だけど、方針を決めて、統一しておくと全体の操作性が上がりますね。

Nuxt.jsVuetify
2022年7月30日 / 最終更新日時 : 2022年7月30日 admin Vue.js(主にNuxt.jsとVuetify)

jestで同じMockが複数回叩かれるテストを書く

APIリクエストが2回以上で、同じMockを使わなければならない場合、 レスポンスも変えないとテストが通らない。知っていれば簡単なので、メモしておきます。

JestNuxt.js
2022年7月24日 / 最終更新日時 : 2022年7月24日 admin Vue.js(主にNuxt.jsとVuetify)

Nuxt2をNuxt Bridgeに移行してみる

Vuetify3がまだベータで、対応していないコンポーネントもあるので、直接Nuxt3への移行はあきらめて、Nuxt Bridgeに移行してみました。 Composition APIやTypeScriptへの変更は行わず […]

ConfigESLintJestNuxt.jsVuetify
2022年3月11日 / 最終更新日時 : 2023年2月10日 admin AWS(Amazon Web Services)

CloudFront(S3オリジン)構築とawsコマンド(S3, CloudFront)メモ

CloudFrontを久々に構築しましたが、UI変更や機能が追加されていたので、メモしておきます。 今回はS3オリジンで静的ファイル(SPAのNuxtアプリ)配信用で構築しています。

CloudFrontNuxt.jsS3環境構築
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共通化

投稿ナビゲーション

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

忘れん坊(β版)

定期タスクの管理・リマインダー(Slack・メールに対応)
タスクをカレンダーや一覧で管理し、チームで共有できます。

リマインドで、忘れやすい年次・月次タスクの実施忘れや、メンバー間の譲り合いによる実施漏れを防ぐ事ができます。

公開リポジトリ・動作確認サイト

  • rails-app-origin
    https://railsapp.nightonly.com/
  • nuxt-app-origin
    https://nuxtapp.nightonly.com/

    自己紹介

    一昨年からフリーランスになり、上場企業でPM兼テックリード(アーキテクトや技術顧問的な動きも)として、実現方法の検討、Rails/Nuxt.jsでの開発や改善・提案、フォローを行なっています。
    また、昨年は並行して、スタートアップ企業で技術顧問として、動画のストリーミング配信や決済、AWS周りのサポートも行っていました。
    両社ともフルリモートで事務所に行った事はないですが、問題なく業務が進んでいます。
    日々、技術の積み上げを意識して、価値提供を目指しています。

    検索(Blogのみ)

    カテゴリー

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

    タグ

    Action Cable ActiveRecord Ansible Apache API API Gateway Capistrano CloudFront CloudWatch Config CORS DB設計書 Devise Devise Token Auth Docker DynamoDB Elemental ER図 FactoryBot HLS hls.js Jest Lambda MediaConvert MySQL Nginx Nuxt.js PostgreSQL RSpec seed SQLite3 SSL/TLS Struts2 Vuetify WebSocket yarn テスト駆動 リファクタリング 共通化 定数管理 日本語化 環境構築 設計書 認証 調査

    最近の投稿

    2023年5月18日 / 最終更新日時 : 2023年5月18日 admin ミドルウェア

    既存サーバーでメールを受信して自由に転送する

    既存のメールサーバーを廃止する事にしました。 移行先として、G Suite(Gmail)のエイリアスにする場合は、アドレス部のアカウントが全て必要になります。 他のドメインのメールアドレスに転送してたり、ワイルドカードで […]

    DNSPostfixVPS
    2023年4月23日 / 最終更新日時 : 2023年4月27日 admin Vue.js(主にNuxt.jsとVuetify)

    vee-validateにカスタムバリデーションを追加して使用有無を制御する

    APIでは不正値が保存されないように必ずバリデーションを掛けますが、フロントは任意。 でも、あった方がユーザーが入力段階で気付けるのと、無駄なAPIリクエストを抑制できる。 フロントだけで完結できるものは追加した方が、親 […]

    Nuxt.jsvalidates
    2023年2月22日 / 最終更新日時 : 2023年2月22日 admin Ruby on Rails

    FactoryBot:リレーション先でリレーション元と同じidで作成されるようにする

    なんのこっちゃ? タイトルを上手く書けなかったので、ER図で説明します。 下記のようにtask_cyclesにspace_idを入れなくてもtasksを経由すれば引けるのですが、DBのindexを効率的に利かせたいのと、 […]

    ActiveRecordFactoryBotRSpec
    2023年2月6日 / 最終更新日時 : 2023年2月5日 admin Ruby on Rails

    Exception Notifierで例外をSlackやメールに通知する

    Sentryの無料枠でも問題なさそうですが、例外が発生した時に通知したいだけなので、 昔からよく使われているException Notifierを導入してみました。 昔はメールでキャッチしていましたが、今はSlackにも […]

    ConfigSlack定数管理環境構築
    2023年2月5日 / 最終更新日時 : 2023年2月5日 admin Ruby on Rails

    assets:precompileのWarnning対応:Though the “loose” option was set to “false”

    デプロイ時のassets:precompileでWarnningが大量に出力されるので対応しました。 これ自体はメッセージ通りやればOKなのですが、他のエラーにも遭遇したのでメモしておきます。

    Capistranoyarn環境構築

    β版リリースのお知らせ

    忘れん坊(β版): 定期タスクの管理・リマインダー(Slack・メールに対応) タスクをカレンダーや一覧で管理し、チームで共有できます。
    リマインドで、忘れやすい年次・月次タスクの実施忘れや、メンバー間の譲り合いによる実施漏れを防ぐ事ができます。
    • プライバシーポリシー
    • お問い合わせ

    Copyright © Night Only Project. All Rights Reserved.