リモートで働くプログラマーの検索結果

リモ太がググったことの覚書

Nuxtプロジェクトにwebフォントを利用する

Nuxt.js Google Fonts

公式のFAQに書いてある通り グローバルな設定と個別な設定方法が書いてあるが今回はグローバルな設定方法を試す

ja.nuxtjs.org

試しにgoogleフォントのLemonadaを導入する

fonts.google.com

nuxtl.config.tsのheadのリンクに追記

export default {
  mode: 'spa',
  /*
   ** Headers of the page
   */
  head: {
    title: 'sample',
    meta: [
      { charset: 'utf-8' },
      { name: 'viewport', content: 'width=device-width, initial-scale=1' },
      {
        hid: 'description',
        name: 'description',
        content: 'sample'
      }
    ],
    link: [
      { rel: 'icon', type: 'image/x-icon', href: '/favicon.ico' },
      {
        rel: 'stylesheet',
        href:
          'https://fonts.googleapis.com/css2?family=Lemonada:wght@500&display=swap'
      } // 追加
    ]
  },
// 以下略

vue-sticky-directiveをnuxtプロジェクトでつかえなかった

Vue.js Nuxt.js vue-sticky-directive

結論 使えなかった

vue.runtime.esm.js?2b0e:619 [Vue warn]: Failed to resolve directive: sitcky

以下、試した手順

スクロール時に特定の部分を固定するためのライブラリ vue-sticky-directive をNuxtプロジェクトに導入してみる github.com

  • インストール
npm install vue-sticky-directive --save
  • 初期化plugin plugins/vueStickyDirective.tsを作成
import Vue from 'vue'
import Sticky from 'vue-sticky-directive'
Vue.use(Sticky)

nuxt.config.tsに作成したpluginファイルを追記

// 省略
  plugins: [
    '@/plugins/vueStickyDirective' // 追記
  ],
// 省略
  • 使い方
<template>
  <div sticky-container>
    <div v-sticky sticky-offset="offset" sticky-side="top">
      ...
    </div>
  </div>
</template>
~~~

rubyで２つの配列からkeyと値のハッシュを合成する

Ruby 
a = [1, 2, 3, 4, 5]
b = [200, 300, 100, 600, 400]

Hash[*[a,b].transpose.flatten]
=> {1=>200, 2=>300, 3=>100, 4=>600, 5=>400}

[a,b].transposeとすることで

[[1, 200], [2, 300], [3, 100], [4, 600], [5, 400]]

こうなるので、この配列をflattenしてハッシュにすると求めるハッシュが作れる

nodenvで利用しているnodeのバージョンでyarnを使えるようにする

nodenv yarn node

nodenv-yarn-installというプラグインをnodenvに導入してからnodenvでnodeをインストールすると利用可能になる github.com

導入方法をプラグイン用のフォルダをなければ作成しgitからcloneする READMEの通りだかが以下のコマンドで導入する

For Bash, Zsh users

mkdir -p "$(nodenv root)/plugins"
git clone https://github.com/pine/nodenv-yarn-install.git "$(nodenv root)/plugins/nodenv-yarn-install"

For fish users

mkdir -p (nodenv root)"/plugins"
git clone https://github.com/pine/nodenv-yarn-install.git (nodenv root)"/plugins/nodenv-yarn-install"

プラグインの導入をしたあとnodenvでnodeをインストールすればyarnが利用可能になる すでにnodeをインストール済みの場合も再度インストールすればよい

特定ユーザーの月ごとのcommit数を調べる

git 
author="調べたい人のユーザー名"
year=2020
month=("01" "02" "03" "04" "05" "06" "07" "08" "09" "10" "11" "12")
for m in "${month[@]}"
do
  echo "$year-$m\t"$(git log --date=iso --author="$author" --pretty=format:"[%ad] %h %an : %s" | grep "$year"-"$m" | wc -l)

調べたい人のユーザーと年を指定してターミナルで上コマンドを実行すると以下の様に月ごとのcommit数が表示できる

2020-01   0
2020-02  35
2020-03  39
2020-04  184
2020-05  191
2020-06  51
2020-07  40
2020-08  0
2020-09  0
2020-10  0
2020-11  0
2020-12  0

ActiveRecordで保存したときにbelongs_toで紐付いた親のレコードも更新する

Rails

belongs_to のオプションで :touch を指定する

:touchオプションをtrueに設定すると、そのオブジェクトがsaveまたはdestroyされたときに、関連付けられたオブジェクトのupdated_atタイムスタンプやupdated_onタイムスタンプが常に現在の時刻に設定されます。

class Book < ApplicationRecord
  belongs_to :author, touch: true
end

class Author < ApplicationRecord
  has_many :books
end

railsguides.jp