import/export

ES6

Named Exports 複数エクスポートしたい時 // myModule.js export function foo() { } export function bar() { } // main.js import { foo, bar } from 'myModule'; foo(); bar(); // or... import * as myModule from 'myModule'; myModule.foo(); myModule…

lsコマンドでソート

サイズが小さい順でソート $ ls -lhSr <target> | head -n 10</target>

配列走査いろいろ

シンプルにループを回したい時 const list = [1, 2, 3]; // for...in for (let i in list) { console.log(list[i]); } // for...of for (let value of list) { console.log(value); } // Array.forEach list.forEach((value, index, array) => console.log(v…

ディレクトリ作成と同時にそこに移動

べんなり👷🏻‍♂️ mkdir foo && cd $_

nodebrewでバージョン切り替え

インストール可能バージョンをリストアップ nodebrew ls-remoteバージョン指定でインストール nodebrew install vX.X.X nodebrew use vX.X.Xインストールされたバージョンをリストアップ nodebrew ls参考qiita.com

Chrome Extensions

入れときたいやつ‍ちなみにExtensionsのページを開く時は、chrome://extensions・Vimium ・Grammarly for Chrome ・Keyboard Shortcuts to Close Other/Right Tabs ・Keyboard Shortcuts to Reorder Tabs ・MobX Developer Tools ・React Developer Tools ・…

使ってるVSC Extensions

・GitLens ・Toggle Quotes ・Quokka ・TODO Highlight ・React-Native/React/Redux snippets for es6/es7 ・Bracket Pair Colorizer 2 ・DotENV ・ESLint ・TSLint(deprecated) ・Mobx/Rematch React Snippets ・JSON Tools

Macを買った時のセットアップ

Mac

色々やり方あるけど、とりあえず今回(Macbook Pro 13" 2018)やった手順まとめ‍・古いマシンでやっておく ・iTunes, Dropbox 等の、Deauthorize↓ 以降、新マシンでの作業・Update OS・各種システム設定をいじる ・マウスカーソルを大きく ・三本指でのドラッ…

HEICをJPGに変換

$ brew install imagemagick $ magick mogrify -monitor -format jpg *.HEIC参考apple.stackexchange.com

CSSチートシート

CSS Cheat Sheet [Infographic + PDF Download] | On Blast Blog CSS Click Chart | CSS3 Browser Support and Information CSS layout cheat sheet · Web Dev Topics · Learn the Web The Complete CSS Cheat Sheet in PDF and JPGs GRID: A simple visual …

Reactアンチパターン

■ bindするのは、アロー関数を使ってハンドラを書いていない時 constructor(props) { super(props); this.onTap = this.onTap.bind(this); } onTap() { console.log("tapped!!"); } onTap2 = () => { console.log("you don't need to bind this."); } render…

Create React App プロジェクトで Decorators を使う

MobXプロジェクトをCRAで作りたくて、Decoratorsを有効にしたいんだけど、という時に使用 create-react-app <app_name> --scripts-version custom-react-scripts参考medium.com</app_name>

npmのパッケージを列挙

npm

globalにインストールしたnpmパッケージを列挙したい時 npm list -g --depth 0参考https://medium.com/@alberto.schiabel/npm-tricks-part-1-get-list-of-globally-installed-packages-39a240347ef0

vimでちょっと便利なカーソル移動

vim

ctrl + y : カーソルそのままで上移動 ctrl + e : カーソルそのままで下移動 z + t : 選択行を最上段に移動 z + b : 選択行を最下段に移動 ctrl + f : 1ページ分上に移動 ctrl + b : 1ページ分下に移動参考stackoverflow.com

バッテリー残量をコマンドで知る

pmset -g batt | grep -Eo '\d+%'参考coderwall.com

コマンド名の由来

ls : list segments

Visual Studio Code の編集Tips

code.visualstudio.com矩形編集等々...

pipを使えるように

~ ❯❯❯ brew install python3 ~ ❯❯❯ python3 -V Python 3.7.3 ~ ❯❯❯ pip3 -V pip 19.0.3 from /usr/local/lib/python3.7/site-packages/pip (python 3.7)参考qiita.com

vimでyankしたらクリップボードにもコピー

vim

brew install vim .zshrcに追記 export PATH="/usr/local/Cellar/vim/8.1.1150/bin:$PATH".vimrcに追記 set clipboard=unnamedこれでyankした時にクリップボードにもコピーされる ちなみにviはvimへのリンク貼ってあるから、自動でvim利用されている ~ ❯❯❯ t…

MobXのプロジェクトでdecoratorのエラーが消えない時

MobXのプロジェクトを開いて、なんかエラー出るなと思って対応。プロジェクト直下に tsconfig.json を作って、以下設定。 { "compilerOptions": { "experimentalDecorators": true, "allowJs": true, } } 参考https://ihatetomatoes.net/how-to-remove-exper…

Fira Codeを使ってみる

プログラミング用のフォントとして、名前の挙がることの多い Fira Code をVisual Studio Codeで使ってみる。github.comインストール後、VSCodeで以下設定を行えばOKhttps://github.com/tonsky/FiraCode/wiki/VS-Code-Instructions

rbenvでバージョンを変更したらrehashを忘れずに

・状況 rbenvでrubyのバージョンを設定後、gem install rails -v 5.2.1でrailsをインストール。 rails -v してもnot foundだが、rbenv rehash すると、出てくる。・結論 バージョン変えたらrehashを忘れずに。 rbenv global <version> rbenv rehash 参考qiita.com</version>

mysqlコマンドがcommand not foundの時

brewで入れたmysqlにPATHが通ってなかった.zshrcに追記 export PATH="/usr/local/opt/mysql@5.6/bin:$PATH"参考weblabo.oscasierra.net

iTerm2でデフォルトのウィンドウサイズと位置を設定する

起動時のウィンドウ位置とサイズをセットしたい時・好みの位置とサイズにウィンドウを表示する ・Window > Save Window Arrangement を選択し、名前をつけて保存 ・Preferences > Arrangements で該当の項目を Set Default する ・Preferences > General で …

whichの代わりにtype

zsh入れたあとにwhichコマンドを使うと、検索対象によっては"aliased to nocorrect"と出てしまう。 ~ ❯❯❯ which heroku heroku: aliased to nocorrect herokuパスを指定して以下のように実行するか ~ ❯❯❯ /usr/bin/which heroku /usr/local/bin/herokutypeコ…

Windowsで文字化けしないZipファイルを作る

qiita.com助かりました🙋‍♂️ こちらの「terminalで実行」の手順を辿ればOK🏖

現場で使う英語

よく使う言い回し・I'll take a look! ・Here is my findings. ・How would you like it to be? ・Need to be fixed asap.=============================メッセージをやり取りする時などに使う省略形・BDD : Behaviour-Driven Development ・F2F : Face to f…

MDN web docs: JavaScriptを読んだメモ

developer.mozilla.orgtypesにはこのような種類が存在するNumbersJavaScriptにおける数値の扱いには気をつける。 小数点の計算がズレる場合があるので、以下の3パターンから選んで対応する。 ・整数になおしてから計算 ・文字列にして計算 ・ライブラリを使…

JavaScriptをオンラインで試せるところ

JS BinJSFiddleCodePenTypeScript Playground

ES7: async/await

ES7

developer.mozilla.orgasync関数は実行するとPromiseが返る。 何もreturnしなくてもresolve扱いになるし、何か値をreturnすると、その値をもってresolveされる。 function multiplyBy2(number) { return new Promise((resolve, reject) => { setTimeout(() =…