[B! Tips][便利] hagyroomのブックマーク

console.log(); しか使えなかった自分へ。。。 - Qiita

この記事について Webエンジニアになって早１年半。railsのデバッグをする時にはエディターのデバッガーでスマートにできていたが、javascriptになるといつもconsole.log();ばかりを使って原始的なデバッグをしていた。。。そんな脳筋な過去の自分に教えてやるための記事です。 console.log({変数名}); 「いきなりconsole.log();の紹介かい！！！」って思われるかもしれませんが、この技を知ったときは「なんで知らんかったんや。。。」って思うくらい便利だったので最初に紹介します。以下のようなHTMLがある場合 <form> <input type="text" value="名無しの権兵衛" id="name"> <input type="text" value="80歳" id="age"> <input type="text" value="バスケ"

hagyroom 2022/05/25

リンク

開発体験を変える! Chrome DevTools Tips 7選 - Qiita

最近Chrome DevToolsについて調べていて発見した便利機能を紹介します。誰もが使える最高便利な開発マシンChrome DevToolsを使いこなして開発体験を変えましょう！ 1. $0で選択中のDOM要素の取得特定の要素に何かしたいという時には、要素のIDやclassを確認してConsoleでdocument.querySelector("#xxx")で取得するというのが一般的だと思います。実はそれはカーソル選択と$0で代替できます。 Classや、IDがついていない特定のDOMを取得したい時とかにも使えるので地味に便利です。手順カーソルで取得したい要素を選ぶ Consoleタブで$0を入力最近知ったChrome DevToolsの便利機能① $0 での選択中のDOM要素取得 Elementsタブで選択状態のDOM要素は、Console上で $0 を入力することで取得で

hagyroom 2020/08/26

リンク

あなたが知らないJavaScriptの便利すぎるショートハンド19選

日頃書いているJavaScriptをもっと短く書く方法を知っていますか？目からうろこ、すぐに使えるJavaScriptのショードハンドを紹介します。 JavaScriptを使うすべての開発者に向けて、私が長年かけて身につけたJavaScriptのショートハンド（短縮記法）を資料にしました。コードの違いが分かるように通常の記述方法も併記しました。 1．三項演算子 if-else文を1行に収めた短縮記法です。通常const x = 20; let answer; if (x > 10) { answer = 'is greater'; } else { answer = 'is lesser'; } ショートハンドconst answer = x > 10 ? 'is greater' : 'is lesser'; 従来のif文を1行に収めることも可能です。 const big = x >

hagyroom 2019/02/26

リンク

http://kakipy.com/articles/5

See related links to what you are looking for.

hagyroom 2014/05/01

リンク

一日18時間VimでRailsを開発している僕が選ぶVim Tips 10選 - Qiita

寝ている時間以外はVimとRailsを触っている僕が選ぶVim Tips10選を紹介します。 Vimを使い始めて3ヶ月ぐらいの人にオススメです。 ※ あんまりRailsは関係ありません。 diw （ノーマルモード）カーソル上の単語を消すこいつがなくてはVimを使う意味が無いというほどよく使うコマンド。ノーマルモードで hoge という文字列上の、どこかにカーソルがある状態でdiwとタイプするとhogeという単語が消えます。この何を単語とするのか、その判定が非常に秀逸で、直感にマッチしていて便利です。たとえば、|をカーソル位置だとして、 ho|ge bar -> bar ho|ge.bar -> .bar "ho|ge" -> "" <di|v> -> <> このように、うまい感じに特殊記号等を避けて、単語を削除してくれます。 ciwとタイプすることで、hogeを削除後、挿入モード