progLog 2020/12/27

今日学んだこと

GitHubの草のEmbed

こんなのあるんだね。Notionでも使えないかなー。

https://ikuwow.github.io/yourcontributions/

box-shadowで内側の影にする

box-shadow: inset 0 0 8px #ccc;

insetを最初につける。

縦と横の位置は0でも0じゃなくても関係なさそう。

他にもいろいろ参考になりそうなのあった。

https://www.nxworld.net/box-shadow-effect.html

ESlintの原因①

エラーが出ているたら、そのページを見て確認するのだ。

今回は

const doSomething = (condition) => {
    if (condition) {
        return true;
    } else {
        return;
    }
}

こんな感じのif文を使って戻り値が何パターンかあるときに、returnを使ったり使わなかったりしていると怒られるのだ。

条件分岐で処理だけを書くことが多い、かつ、elseを使わず早期returnするとエラーに巻き込まれやすい。しかも、エラーの波線がアロー関数の=だけにしかつかないので、ぼーっとしていると見逃す。

const doSomething = (condition) => {
    if (condition) return anotherFunc1();
		anotherFunc2()
}

とかだとESlintエラー

https://eslint.org/docs/rules/consistent-return

jestでテストやったよ

関数の単体テストを教えてもらった。

sample.test.tsって感じのファイル作って

import { describe, test } from '@jest/globals'
import { sampleFunc } from './sample'

describe('テストする関数のカテゴリ', () => {
  test('テストする関数の名前', () => {
    expect(sampleFunc(arg)).toBe("result")
  })
})

{ describe, test }

この2つを使うと、testに名前をつけてスコープ管理できるみたい。またちゃんとやってない。

https://jestjs.io/docs/ja/getting-started

Markdownの取り消し線

~~取り消し線~~

いつもショートカットを忘れるし、Markdownすら忘れる

~Notionの取り消し線~-> Notionの取り消し線

ツールによって微妙に違うのはやめてほしい。。。

https://gist.github.com/DQNEO/7096380

window.location.origin

URLのpathが付く前の部分を取得できる！これは良いぞ！

例：https://hoge.com/chat/1234->https://hoge.com

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

文字列の前方一致

"stringsssss".startsWith("str") // -> true

https://qiita.com/aqril_1132/items/9f69575bfbcf24bdf7b5#前方一致

https://developer.mozilla.org/ja/docs/Web/JavaScript/Reference/Global_Objects/String/startsWith

GitHubのファイルごとの変更履歴を見る

blameってやつ

https://docs.github.com/ja/free-pro-team@latest/github/managing-files-in-a-repository/tracking-changes-in-a-file

ESlintの原因②

型の名前の最初が大文字じゃないときのエラー

これ、よく忘れるんよね〜。

https://github.com/typescript-eslint/typescript-eslint/blob/v4.9.1/packages/eslint-plugin/docs/rules/naming-convention.md

所感

、と。まじ使いづらいやめます。

Storybookを勉強しているのですが、キレイにまとめられないので、割愛してます。