% cat

不定期!弊社のslackで話題になった技術tips集!😘 Vol.8

🐉 説明しよう!tips集とは!?

弊社のslackチャンネルには、各々が感じた、技術的なtipsを誰に向けるわけでもなく放り投げるチャンネルがあります!

↑こんな感じです。

この記事は既出であろうがなかろうが、tipsをひたすらまとめていく記事である!!😄

内容にまとまりがないのはご愛嬌です!弊社の仕事の様子の鱗片が少しでも感じられれば幸いです👌

次回: Vol.9
前回: Vol.7

📌 Ruby編

FloatにInfinityはあるがIntegerにはない。

pry(main)> 1.0/0
=> Infinity
pry(main)> 1/0
ZeroDivisionError: divided by 0

* について

1.引数を渡す際、配列にアスタリスクを付けて関数呼び出しすると、配列が展開して渡される。
(呼び出す側で与える引数の数と、呼び出される側で与えられる引数の数が同じでないとエラー)

2.関数定義の引数にアスタリスクを付けると、0個以上の引数が配列にまとめられて渡される。

ruby引数処理に使えるテクニック - Qiita

Safe Navigation Operator &.

レシーバが nil の場合に nil を返す。

10&.to_s  # => "10"
nil&.to_s # nil

gem の内部をいじった時

gem pristine を使えばインストール次点のソースへ戻すことができる

Enumerable#one?

を、 length == 1 であれば true を返すものだと勘違いしておりました。
真である数が 1 のときに true を返すのですね。

[nil, true, false].one?
# => true

ブロックを与えると、真偽判定を変えることができます。

[3, 4, 5].one?(&:even?)
# => true

精進いたします。

ruby コーディング規約の聖書

ruby-style-guideの和訳Readme - github

💬レス: 👆これめちゃくちゃいいですね

# 悪い例
class FooError < StandardError
end

# 悪くない例
class FooError < StandardError; end

# 良い例
FooError = Class.new(StandardError)

知見すぎる......

📌 Ruby on Rails編

rails sしてる時にキャッシュのログを見る

config.action_controller.enable_fragment_cache_logging = true を追加するとよい

Railsの詳細情報確認

rails c中にRails::Info

コントローラー名からモデル名を求めたりしたい

Railsでコントローラー名からモデル名を求めたりしたい、逆もまた

ActiveRecordの挙動

User.send(:sanitize_sql_array, ['WHERE `users`.`id` IN (?)', User.none])
# => "WHERE `users`.`id` IN ()"

User.send(:sanitize_sql_array, ['WHERE `users`.`id` IN (?)', []])
# => "WHERE `users`.`id` IN (NULL)"

👋😇

ActiveRecord

User.where(id: ids)

するとして、

ids = (1..10000).to_a.shuffle

ids = (1..10000).to_a

だと後者のほうが探索が速い

ids = [1] * 10000

ids = [1]

も結構違いが出る

scope で nil が返ると all と同じ挙動(なにもしない)になる

scope :piyo, -> { nil }
User.piyo.to_sql
# => "SELECT `users`.* FROM `users`"

コールバック止めるときに throw :abort する理由

ActiveRecord::RollbackやActiveRecord::RecordInvalidを除く例外は、その例外によってコールバックチェインが停止した後も、Railsによって再び発生します。このため、ActiveRecord::RollbackやActiveRecord::RecordInvalid以外の例外を発生させると、saveやupdate_attributesのようなメソッド (つまり通常trueかfalseを返そうとするメソッド) が例外を発生させることを想定していないコードが中断する恐れがあります。

order/pluck にSQL文使えなくなるらしいですね。Rails 6から

https://qiita.com/QUANON/items/8fcc8c6cee64d246a5a6

💬レス: Rails6 では create_or_find_by が使えるようになる…はず

https://github.com/rails/rails/commit/fe6adf43e124f4c9132e5a88a80ebba3f10fd2cb

📌HTML(slimなども含む)&ブラウザ編

slimでasync属性がついたscriptタグを埋める方法は、{}をつける

script{async src="https://example.com/sample.js"}

data属性で true を表現するときは true と書かないと危ない

CSS用に data-has-errors とだけしてると、js で空文字列が取得されて falsey になってしまう
jQuery の data() は型変換して取得するから尚更よくない

画像のALTタグについて

divタグの背景に画像を指定する background-image で画像を配置しているとaltタグが利用できなくなってしまう。
マウスオーバーした際のTool tipsを表示するだけであれば div タグの title要素に入れてあげれば反応するが
音声読み上げなどには対応していないのでaltタグの代用にはならない。

なので divタグに背景を指定するのではなく、意味のある画像なのであればちゃんとimg タグを利用してaltを設定したほうが良い

📌 Javascript編 (node、vueなども含む!)

body内の要素監視について。

$('body').on 'DOMSubtreeModified propertychange', ->

https://developer.mozilla.org/en-US/docs/Web/Events/DOMSubtreeModified

ただ、DOMSubtreeModifiedこちらは非推奨になってます。下記がいいかも?

https://developer.mozilla.org/ja/docs/Web/API/MutationObserver

vue.js でトランジションするとき

http://chibinowa.net/note/vuejs/vue-22.html
http://chibinowa.net/note/vuejs/vue-23.html

📌 CSS(style)編

scroll-snap-points 神すぎる...

これまで使ってなかったの本当に勿体ない

https://webkit.org/demos/scroll-snap/

iOS の Safari でみると分かりやすいです。

https://caniuse.com/#feat=css-snappoints

もうすぐ対応するブラウザも多し。

Safari transparent と rgba() のグラデーションが作れない

transparent の代わりに rgba でアルファ値 0 にする必要がある

CSSの詳細度の計算のうち、属性セレクターはクラスセレクターと同じ優先度っぽい。

- 型セレクター (例えば h1) と 疑似要素 (例えば ::before)
- クラスセレクター (例えば .example)、属性セレクター (例えば [type="radio"])、疑似クラス (例えば :hover)
- ID セレクター (例えば #example)

https://developer.mozilla.org/ja/docs/Web/CSS/Specificity

📌 Go編

Goには構造体にタグをつけられて、jsonとかに変換する時によしなにやってくれる

(他の静的型付け言語もできるかもですが)

(あとアンスコのメンバ名つけると注意される)

http://text.baldanders.info/golang/struct-tag/

💬レス: 便利ですよね、値のないものに対して omitempty 付けるとキーごと消しちゃうのもたまに使います。

https://qiita.com/taroshin/items/59e62d8ec852c5f84bc1

go test実行時、-vオプションをつけないとテストが失敗した時しか標準出力してくれない

https://qiita.com/taizo/items/82930518430f940721a0#tlog

amazon linuxにmecab入れて、goから呼べるようにする際

soファイルが読まれなくて上手く入れれなかった。ビルドする際にで他のlinuxだと呼ばれるディレクトリが呼ばれないらしい

https://moznion.hatenadiary.com/entry/2013/08/23/105920

golangで特定の文字列の位置を検索する場合

stringsというpackageの中にIndexというそれっぽい関数があるが、これはbyteとしての位置を返すためちょっと工夫が必要
(あとbyteの方の結果は半角スペースはカウントされてないっぽい?)

https://play.golang.org/p/FEjU0XWKgN6

📌 データベース編

Mysql describe

describe テーブル名詳細データが見れる。

さらに desc と省略できる

ClearDB に文字コード utf8mb4 で保存する

http://xyk.hatenablog.com/entry/2015/01/14/143508

📌 shell & Linux編

zshの単語単位で削除

ctrl-wでできる。今月1の感動でした。

sed / は任意だった...

以下は同じこと

sed 's/hoge/piyo/'

sed 'skhogekpiyok'

vim

shift + v で行選択
{ } で空行ごとにジャンプ

📌 AWS & GCP & Heroku編

Heroku で固定 IP を使いたい場合

Proximo add-ons を使う。月$5
https://elements.heroku.com/addons/proximo

AWS マルチAZのDBインスタンスは停止できない

💬レス:

それな。マルチAZ やめたら停止できるけど1週間くらいで勝手に起動する

🖌 迷惑すぎる...使わないけどデータは保持してたい...修正してほしいですよねぇ。

📌 Docker編

いつの間にかdockerのサブコマンド体型が変わっていた

docker ps # => docker container ls
docker exec # => docker container exec
docker build # => docker image build

https://qiita.com/zembutsu/items/6e1ad18f0d548ce6c266

REPOSITORY で docker images を filter したいとき reference というのを使う

https://docs.docker.com/engine/reference/commandline/images/#format-the-output

$ docker images --filter=reference='gcr*/*/*:*'
REPOSITORY                             TAG                 IMAGE ID            CREATED             SIZE
gcr.io/banana-ci/dummy-project-rails   pr-20-1             d1e54a5f6bf4        4 months ago        917MB
gcr.io/banana-ci/dummy-project-rails   pr-20-4             d1e54a5f6bf4        4 months ago        917MB
gcr.io/banana-ci/dummy-project-rails   pr-10-1234567       0e331b8e14ff        4 months ago        917MB

こんな感じで、image name に / があると、 gcr*:* ではヒットしなかった

コンテナ内でコマンド打っていると、横幅狭いなーってことないですか?ぼくはありました。

https://qiita.com/reflet/items/8722af15200ab2553d9c

なので、 Dockerfile で

ENV COLUMNS=200 LINES=200

しちゃいます。

📌 Git & GitHub編

コミットを一つにまとめたいなーというとき

git rebase -i の出番。

まとめたい最初のコミットの一つ手前の番号を指定するとまとめる操作ができる。

rebase -i でコミットをまとめる - Qiita

git commit --fixup=XXXXも便利

XXXX に任意の commit の sha を指定するとその commit と fixup するためのマーキングをしてくれます。
そして git rebase -i --autosquash すると勝手に順番を変えてくれます

git commit --fixup とは何か

gitでcommitログのauthorを変更する方法

git commit --amend --author="hogehoge <hogehoge@example.com>"

git revert テクニック

mergeコミットのrevert(A)のrevert(B)をしたい時、かつ、(A)以降に、(A)に対して既に差分がマージされたあとの場合、 GithubのGUI上ではrevetができないので、 ローカルのコマンドから -m オプションをつけてrevertしてあげる。

$ git revert xxxxxxxxx -m 1

参考:https://blog.toshimaru.net/git-revert-mainline/

ふとおもむろに修正したコード行数を確認したい時

git diff --stat
git diff --cached --stat

📌 ツール紹介編

slack の特定チャンネルへの動線を作れる

Deep linking into Slack clients - api.slack.com

ATOM todo-show 見やすい

todo-show - Atom

集中線 Webサービス

https://lab.syncer.jp/Tool/Intensive-line-Generator/

Sequel Proを上手く使うコツ

Sequel Pro

お気に入りに保存する際、色指定ができる。

実際に接続したときのタブの色にもなる。

これを駆使すると複数データベースと接続して触ってるとき、あれ?今どこのやつ触ってたっけ?を防げるのでおすすめ。

google spreadsheetsのショートカット

https://www.popxpop.com/archives/2007/05/google_spreadsheet.html

DevTools で $$('.piyo') とするとCSSセレクタのクエリが試せる

$x('//*[@class="piyo"]') で xpath

https://qiita.com/letsspeak/items/80882748daf7060903d8

📌考え方&仕組み編

GA tips

Aサイト https ⇒ Bサイト httpはリファラルではなくダイレクトで計測される

https://www.uneidou.com/ga-solution/post-12875/

https://web-omusubi.com/blog/omusubi49.html

📌 おすすめ編

下位10%のダメなエンジニアにだけ解けないパズル

Puzzles for Software Engineer

http://challenge-your-limits.herokuapp.com/

↓作者のブログ

【パズル1】ほとんどのエンジニアには解けるが、下位10%のダメなエンジニアにだけ解けないパズル? - ベルリンのITスタートアップで働くジャバ・ザ・ハットリの日記

まもなくdev.toがopen sourceになる

https://github.com/thepracticaldev/dev.to

鹿野さんのファンなので鹿野さんのICSデビュー記事を貼っておきます(N回目)

https://ics.media/entry/1808

🖌 編集後記

久しぶりに書いてみると、流石に量が尋常じゃないことになっていましたw

独断と偏見でtipsっぽいやつを絞って記載してます!少しでもみんなの参考になれば...いいですね!

さて、今回は2018/07/30 ~ 2018/08/14で放出されたtipsをまとめてみました。こんな感じで弊社の開発部はわいわいがやがややっておりますぞい!

🖌 雑談こーなー

エンジニアが食べる食べ物は寿司。というのが弊社です。 え?なぜ、寿司なのか?

成る程、いい質問ですね。

弊社では月に1度勉強会を開くのですが、その際にいつも食べるものを注文します。

オードブル? 冷えた揚げ物はちょっと辛い。

ピザ? 最初はいいけどアツアツなうちに食べきってしまいたい。でもそうなると発表に集中できない。

寿司? 成る程、もともと 冷えた食べ物 だし、寿司嫌いな人間はほぼいない。ビール、ワイン、日本酒、ハイボールと全てのお酒との相性も良い。何より一口で一区切りがつくサイズ感で話の合間合間に食べるのに丁度いい。

エンジニアにとって、寿司ほど優れた食べ物はない!!

...少し盛りましたが、色々あって寿司に落ち着きました。

ちなみにエンジニアは日本酒が好き説もあるのですが、この企画が続けば、また次の機会に雑談として載せますね。

それでは、また!

最新記事

AWS WAFの実施方法

こんにちは、ベーシックの [@buiduyson1992](https://twitter.com/buiduyson1992) です。 AWS AWFはウェブアプリケーションを攻撃から保護できます。例えば、SQL インジェクション...

BuiDuySon
2018年11月15日

SVG アイコンを CSS 変数とか併せて良さげに使う

こんにちは。[@rigani_c](https://twitter.com/rigani_c) です。 みなさん、SVG 吸ってますか? SVG 吐いてますか? Web ページ上で自前の SVG アイコンを使用するときの良...

rigani
2018年11月09日

【ランキング 2018】エンジニアが選ぶ本ベスト3 in 株式会社ベーシック

# 突然ですが、みなさん本はお好きですか。 ベーシックのwebエンジニア、[@namitop](https://qiita.com/namitop) です。 わたくしは、「本好きですか?」と聞かれたら、「まあまあ。」ぐらいのレ...

namitop
2018年11月02日