個人で運用しているサービスのstylelintを13系から14系の上げたので、そのあたりでやったこととかをメモしておきます。 stylelint.io アップデート手順 公式で14系へのマイグレーションガイドが公開されているので、基本的にはそれをみてやっていきます。 st…

フロントエンド側から非同期でRails側にリクエストを投げたいときとかに今までは以下のような定数を集めたmoduleをフロントエンド側に用意してたりしていたのですが、 export const BLOG_API_ENDPOINT = "/api/blogs"; export const LIKE_API_ENDPOINT = "/a…

Ruby on RailsでMagic Link的な認証を作ってみたく調べてたところpasswordlessというgemを見つけて色々触ってみたので使い方とかをメモしておきます github.com Magic Linkとは？ サイトに用意された「マジックリンク」と名付けられたボタンを押します。する…

個人のサービスでwebpackでフロントエンド関連のファイルを管理していてsimpackerを使ってRailsで読み込むみたいなことを行なっているのですが。。。 新規のページをつくるときとかに手でエントリーのJSを用意してページ用のCSSファイルを作ってインポートし…

SidekiqのDashboard等をmountしたengineの画面をログイン必須にしたい時、特定のサブドメインのときだけアクセス可能にしたい等、Rails のルーティングのconstraintsを使うと実現できそうだったので、そのあたりをメモしておきます api.rubyonrails.org Rail…

今までsecret_key_base等を設定するときにわざわざ以下のような感じでconsoleを起動してセキュアな文字列を取得していたのですが、 $ bin/rails console irb(main):010:0> SecureRandom.hex(64) => "ad56c1c986e397149281da99f6e268d4e3657d65a46600dcaeccd8…

最近Herokuで動かしている個人のサービスの構成をTerraformで管理するようにしてみたので、そのあたりのTerraformの使い方とか移管方法とかを備忘がてらMEMOしておきます Terraformとは Write, Plan, Apply https://www.terraform.io/ 上述の通りオープンソ…

APIから取得した結果を保存するModelやユーザー情報を扱うModel、中間結果を保存するテーブル等、直接更新してしまうと危険なのでコンソールから起動するときにはReadonlyにしたいなぁと思い色々やり方を考えてみたのでメモしておきます ※rails console -sも…

認証にDeviseを利用しているとロック解除等のメールに送信されたLinkをクリックといったGETリクエストでDBを更新するような処理実行時にRailsの複数DBを使っているとActiveRecord::ReadOnlyErrorが発生してしまうため、そのあたりの対応方法をメモ railsguid…

Rails 7からimportmap-railsを使ったフロントエンド環境が提供される予定です。 Rails new時にimportmap-railsを使用するoptionも追加され試しやすかったので、軽く使ってみました。 利用方法とかメモしておきます github.com github.com import mapsとは 簡…

個人で作成しているライブラリでDBのDocker Imageのbuild直後だけ、たまにコネクションが作れなくてエラーになる事象が発生し以下のRspec::Retryを導入してリトライして解消したので導入方法をメモしておきます Rspec::Retryとは？ RSpec::Retry adds a :ret…

最近、割とRails newする機会があり.railsrcとRailsテンプレートを使うといい感じにこのあたりの作業をコード管理して再現性と効率的に行えそうだったのでメモしておきます .railsrcとは Railsテンプレートとは railsrcとRailsテンプレートを使ってみる おわ…

@vue/compiler-sfcを3.2系にあげたときにタイトルどおり以下のエラーが発生したのですが、 TypeError: vue_1.createElementVNode is not a function CHANGELOG等を見ても破壊的変更に記載されておらず、多少ハマったので対応方法をMEMOしておきます blog.vue…

最近以下の本を読んで、なんかしらのデータの特徴をグラフにしてピタゴラスの定理を使って2点間の距離を算出すると、簡単なレコメンドシステムを作れることを勉強したので、実際にピュアなRubyのコードで作ってみました。自分の学びのためにも流れをメモして…

StoryBookをGitHub Pagesで公開して見えるようにすると結構便利そうだったのでやり方をMEMO Storybookの導入方法については以下のエントリを参照してください madogiwa0124.hatenablog.com 今回は以前書いた以下のアクションにStorybookのbuildプロセスを追…

ViewComponentとは？ ViewComponentの使い方 ViewComponentをテストする おまけ：VueのSFCみたいなのは実現できるか？ おわりに ViewComponentとは？ 3rd Party製のコンポーネントフレームワークのためにレンダー済みのHTMLを返すrender_inが定義されているO…

以下のような環境にStorybookを導入してみたので対応したこととかをメモしておきます。 package version vue 3.1.4 webpack 5.44.0 Storybookとは まずはStorybookについて簡単に説明します。 storybook.js.org Storybook is an open source tool for buildi…

個人のWebサービスをVue2系からVue3系にアップグレードしてみたので、やったこととかメモしておきます 基本的な流れとしては以下の記事を参考にさせていただきました‍♂️ zenn.dev 事前準備 plugin:vue/vue3-recommendedを有効化する Vue本体のアップデート …

タイトル通り、本当に見られたくない無い要素はrequest specでも検証したほうが良さそうに思ったので、自戒の意味も込めてメモしておきます 想定しているケース 実装イメージ 問題点 対応策 見せたくない情報はマスキングして渡す レスポンスを直接検証して…

OK Computerのヘルスチェックをブラウザで見やすくするGemを作ったので、使い方とかをメモしておきます 作ったGem github.com モチベーション github.com OK Computerはヘルスチェックをしてくれる便利なGemなのですが、Viewがテキスト or JSONのみの用意と…

個人のWebサービスでGAでトラッキング出来るようにしてみたので、やったこととか手順とか色々、MEMOしておきます GA(Google Analytics)とは? marketingplatform.google.com ユーザー像を把握。 ユーザー像を詳しく分析して理解を深めましょう。Google アナリ…

JSON.parseの結果は基本的にはHashになると思うのですが、任意のClassのオブジェクトで取得したい場合に、JSON.parseの引数object_classを利用すると簡単に実現出来ることを知らなかったのでメモしておきます やり方は以下の通りでdef []=(key, value)を持つ…

個人で運営しているRails製 WebサービスのAPMをSkylightというサービスを利用して取得してみたので、手順とかをMEMOしておきます www.skylight.io Skylightとは？ Skylight is a smart profiler for Ruby and Rails applications. It turns performance data…

個人のWebサービスにLogrageを入れてみたので導入方法とか使い方をメモしておきます github.com Logrageとは？ Logrageの使い方 Logrageを導入する ログ出力項目を追加する 独自に作成したフォーマッターを使用する おわりに Logrageとは？ Lograge is an at…

Railsでカスタム設定を扱う場合、以下に記載したSettingslogicやGlobalを使うことが多かったんですが、Rails標準のconfig_forを使っても同じようなことが出来たので、使い方とかをMEMOしておきます github.com github.com ちなみに、Rails 6.1.3.2環境で試し…

OK ComputerというGemを教えてもらい、個人サービスに入れてみたところ、適当に設定すると色々見れて便利だったので導入方法とかをメモしておきます github.com 導入方法 OK Computerのインストール OK Computerのmount 監視項目の追加 Basic認証の追加 おま…

Vue、TypeScriptが導入時されているプロジェクトにJestを導入したので、そのあたりの手順をMEMOしておきます 関連ライブラリのinstall Jestの設定ファイル作成 Jest実行用のコマンドをpackage.jsonに追加 CIでJestを実行する 導入時に発生したエラー解消ログ…

以下のPRで導入されたRails 6.1から使える機能を使うといい感じでroutesを複数ファイルに分割できたのでやり方をメモしておきます github.com やり方 以下のようなroutesをnamespace毎に分割したいときには、 Rails.application.routes.draw do root to: 'bo…

FactoryBotを利用してテストデータを管理していて、開発が進んでいくとデフォルトで作成したときにエラーになるようなFactoryが作られてしまったりします。 github.com そんなときにFactoryBot.lintを使うとFactoryが壊れたときに気づけて便利だったのでメモ…

JavaScriptのエラー検知にRollbarを使用しているのですが、最近npmで公開されているRollbar.jsを利用するとSnipetを使わなくて済むことがわかったので利用方法をメモしておきます 公式ドキュメント記載のSnipetを利用する方法 Rollbar.jsを使ったSnipetを使…