雨模様の天気と裏腹な心模様

RUNTEQの開発合宿に行って勝手に刺激をもらってきたRUNTEQ卒業生駆け出しエンジニアスバルです。

合宿は、好きな開発テーマ毎にメンバーを割り振る形で進んでいました。

Flutterでなんか作る、GraphQL理解する、github actionsでセルフレビューLGTM生成CI環境作成などのチームがある中、僕はreactとtypescriptのチュートリアルを通して五目並べゲームを作成しました。

vueのcomposition APIの書き方がreactの書き方を真似ていたこともあり、意外とreactの基礎理解した!という気分になりました笑

開発って楽しい!

あと、「暇と倫理の退屈学」面白すぎて他の小説が読めなくなってしまった。。

雨続きだけど心は晴れやかな今日この頃です。

 

 

ポリモーフィック関連付け

ダックタイピングの一種。

インスタンスにも親クラスと同じメソッドを持たせておくことで、親クラスを呼び出した時の出力を定義すること。

このように、「違うものがある決まった振る舞い/入出力を持つことで、同じように扱えるようにすること」をダックタイピングと呼びます。そして、その「ある決まった振る舞い」「入出力の定義」のことをインターフェースと呼びます。

コード例に沿って表現すると、DuckCatは違うクラスですが両方とも#soundというメソッド(インターフェース)を持つので、Animalの中ではどちらのオブジェクトであるかを意識せず#soundを呼ぶことができる、というのがダックタイピングです。

呼び出すのは親クラス。下記が今回のインターフェイスということになる。

Animal.new(インスタンス名).sound を実行したときに、鳴き声が返ってくる」

入力: Animal.new(インスタンス名).sound を実行

出力: 鳴き声が返ってくる

この定義を守ることで、どんな動物のインスタンスを入れたとしてもその動物の鳴き声が出力されることが担保される。

これを実現してくれるのがポリモーフィック関連付けという。

Railsのポリモーフィック関連とはなんなのか - Qiita

 

浅いネスト

ネストしたリソースを書くときにshallowをtrueにするとshow/edit/update/destroyのような、idを必要とするアクションを省略して表現することができる。

resources :articles do
  resources :comments, shallow:true
end
POST /articles/:article_id/comments(.:format) comments#create article_comments_path
GET /articles/:article_id/comments/new(.:format) comments#new new_article_comment_path
GET /comments/:id/edit(.:format) comments#edit edit_comment_path

Rails のルーティング - Railsガイド

Storybook

画面遷移のモックを開発中のアプリに作成することができるライブラリ。

reactやvueの書き方で既存のプロジェクトに画面遷移のモックを実装できるから学習コストが少ない。

下記参照記事が詳しい。

storybookを理解する

Component Story Format 3.0

例えば、プロジェクトの実装で挨拶ページを作成したいと思ったとする。

下記のようにpugという拡張子のファイルと**.stories.jsというファイルを作成する。

#greeting.pug

mixin Greeting (props = {})
  .container.p-4
    block
    .row
      .col
        p=props.hello_ja
      .col 
        p=props.hello_en
#greeting.stories.js

import startCase from 'lodash/startCase';
import Greeting from './greeting.pug';
import { renderer } from 'storypug';

const { render } = renderer({ startCase });
export default {
  title: '挨拶',
};

export const Basic = () => {
  // setup props
  const props = {
    hello_ja: 'おはよう',
    hello_en: 'hello',
  };

  const contents = `<h3>| 挨拶</h3>`;
  const wrapper = render(Greeting, props, contents);
  return wrapper.$root;
};

これだけで下記のような画面が表示される。



不要なマイグレーションファイルの削除

$ rails db:migrate:status #不要なマイグレーションファイルの日付を確認
  database: hoge_development

   Status   Migration ID    Migration Name
  --------------------------------------------------
     up     20220712031711 Create users table
          up     20220712031711 Create posts table
     up     20220712062672 Change users age to integer
     up     20220713032240 Change posts body to text

$ rails db:migrate:down VERSION=20220713032240 #確認したファイルの日付を=の後に入れる

ファイル名を適当な名前に変える

class Hoge < ActiveRecord::Migration[6.0]
  def change
  end
end
$ rails db:migrate:status #不要なマイグレーションファイルがdownになっていることを確認

database: hoge_development

   Status   Migration ID    Migration Name
  --------------------------------------------------
     up     20220712031711 Create users table
          up     20220712031711 Create posts table
     up     20220712062672 Change users age to integer
    down    20220713032240 hoge

$ rm 20220713032240_hoge.rb #不要なファイルを削除

【Rails】ロールバック(rollback)で何が起こっているか?schema_migrationsとは?意味と役割。UPとDOWNとは?それぞれの使い方

クエリのキャッシュ制御

一度実行したクエリはキャッシュとして保存されている。

# データベースからbooksを取得する
author.books.load
# booksのキャッシュコピ-に対してsizeメソッドを実行する
author.books.size

キャッシュを破棄して新しいキャッシュを作成したい場合は下記のようにreloadを使う。

author.books.reload.size

Active Record の関連付け - Railsガイド