読者です 読者をやめる 読者になる 読者になる

牌語備忘録 -pygo

あくまでもメモです。なるべくオフィシャルの情報を参照してください。

牌語備忘録 -pygo

Javascript でカタカナ->ひらがな変換とか全角英数->半角英数に変換とかのメモ

カタカナ->ひらがな変換

const katakanaToHiragana = (katakana) => {
  return katakana.replace(/[\u30a1-\u30f6]/g, (match) => {
    const chr = match.charCodeAt(0) - 0x60;
    return String.fromCharCode(chr);
  });
};

console.info(katakanaToHiragana('カタカナヴ'));
//-> かたかなゔ

全角英数->半角英数に変換

const zenkakuEisuToHankaku = (str) => {
  return str.replace(/[A-Za-z0-9]/g, (s) => {
    return String.fromCharCode(s.charCodeAt(0)-0xFEE0);
  });
};

console.info(zenkakuEisuToHankaku('ABCDEfghi12345'));
//-> ABCDEfghi12345

文字列を半角数字のみに変換

const stringToOnlyNumbers = (str) => {
  return zenkakuEisuToHankaku(str).replace(/[^0-9]/g, '');
};

console.info(stringToOnlyNumbers('foo12bar34HOGE56fuga78'));
//-> 12345678

参考

Javascript のソースコードを prettier で git commit 時に自動で整形してみるメモ

インストール

$ npm init -y
$ npm install -D prettier lint-staged husky

package.json

precommit と lint-staged を追加

{
  "scripts": {
    "precommit": "lint-staged"
  },
  "lint-staged": {
    "*.js": [
      "prettier --write",
      "git add"
    ]
  }
}

.git/hooks/pre-commit

#!/bin/sh
npm run precommit

exit 0

コミットしてみる

index.js(コミット前)

const foo = {
    a: 1,
    b: 2,
    c: 3,
}

const bar = {c:'d'}

const baz = ["foo", "bar", "baz", "foo", "bar", "baz", "foo", "bar", "baz", "foo", "bar", "baz"]

console.info(foo)
console.info(bar)
console.info(baz)

コミットして見る

$ git add index.js
$ git commit -m "add index.js"

index.js(コミット後)

const foo = {
  a: 1,
  b: 2,
  c: 3
};

const bar = { c: "d" };

const baz = [
  "foo",
  "bar",
  "baz",
  "foo",
  "bar",
  "baz",
  "foo",
  "bar",
  "baz",
  "foo",
  "bar",
  "baz"
];

console.info(foo);
console.info(bar);
console.info(baz);

おまけ

prettier の整形の設定は6個くらい (gofmt は変更できる設定は0)

$ node_modules/.bin/prettier --help
Usage: prettier [opts] [filename ...]

Available options:
  --write                  Edit the file in-place. (Beware!)
  --list-different or -l   Print filenames of files that are different from prettier formatting
  --stdin                  Read input from stdin.
  --print-width <int>      Specify the length of line that the printer will wrap on. Defaults to 80.
  --tab-width <int>        Specify the number of spaces per indentation-level. Defaults to 2.
  --single-quote           Use single quotes instead of double.
  --bracket-spacing        Put spaces between brackets. Defaults to true.
  --jsx-bracket-same-line  Put > on the last line. Defaults to false.
  --trailing-comma <none|es5|all>
                           Print trailing commas wherever possible. Defaults to none.
  --parser <flow|babylon>  Specify which parse to use. Defaults to babylon.
  --color                  Colorize error messages. Defaults to true.
  --version or -v          Print prettier version.

Boolean options can be turned off like this:
  --no-bracket-spacing
  --bracket-spacing=false

追記

配列を改行したくても1行になったりのケース

デフォルトで –print-width 80 だとそれ以下の文字数の場合に改行してると1行に変換されてしまう。

整形前

const baz = [
  "foo",
  "bar",
  "baz",
  "foo",
  "bar",
  "baz",
]

整形後

const baz = ["foo", "bar", "baz", "foo", "bar", "baz", "foo", "bar", "baz"];

Reactのソースコードで使われてるらしいけど

感想

  • prettier 使わずに eslint でチェックしつつコード書くでもいいかも?
  • eslintrc –fix でもいいような気がしてきた
  • 既存コードを大量に整形しないといけないとかだったら prettier 便利かも

参考

Django の templates で forms.py で設定した max_length とかのみ表示するメモ

忘れるのでメモ

forms.py

class ContactForm(forms.Form):
    username = forms.CharField(max_length=100) 

template/hoge.html

<p>{{ form.fields.username.max_length }}</p>

<p>100</p> みたいな感じで表示できる

Emacs の Flycheck で csslint の設定を変えてを使うメモ

(emacs25.1.1)

インストール

Emacs と flycheck、node.js と npm のインストールは略

$ npm install -g csslint

設定

flycheck のソースコード を見てコマンドの設定を追加してみる

  (flycheck-define-checker css-csslint
    "See URL `https://github.com/CSSLint/csslint'."
    :command ("csslint" "--format=checkstyle-xml" "--warnings=import" "--errors=important" source)
    :error-parser flycheck-parse-checkstyle
    :error-filter flycheck-dequalify-error-ids
    :modes css-mode
    )

参考