$shibayu36->blog;

クラスター株式会社のソフトウェアエンジニアです。エンジニアリングや読書などについて書いています。

2016-01-01から1年間の記事一覧

TypeScriptでのフロントエンド開発環境作成総まとめ

これまで自分のブログで、TypeScriptを使ったフロントエンド開発環境についてブログをいくつか書いてきた。ひとまずこの辺りで、TypeScriptでフロントエンドを開発するための最低限の環境を構築できるようになったので、総まとめとしてブログエントリを書い…

Emacsで今編集しているJSのテストのみ実行する(Karma + Mocha環境の場合)

blog.shibayu36.org前回の記事でKarma, Mocha, Chaiを使ったJSのユニットテスト環境を作ることができた。しかしテストを書き続けていると、「手元で全体のテストを再実行するのに時間がかかる」という問題が起こった。そこで今回は「今編集中のテストのみをE…

最近は憂鬱だったけど去年も憂鬱だった

blog.shibayu36.org blog.shibayu36.org最近全体的に憂鬱で仕事もプライベートも何もやる気が起こらないと思っていたのだけど、はてなブログから1年前のブログが送られてきて去年も同じ時期に憂鬱であったことが分かった。単なる季節要因ではないかという気…

「オブジェクト指向入門 第3章モジュール性」メモ

以前途中まで読んで読みきれなかったのでオブジェクト指向入門をまた読み始めることにした。また、理解を深めるために章ごとに面白いことがあったらまとめておくことにした。 オブジェクト指向入門 第2版 原則・コンセプト (IT Architect’Archive クラシック…

Karma, Mocha, Chaiを使ってTypeScriptでのテスト環境を構築する

最近はTypeScriptを使ってフロントエンドの開発をしている。 JSをbrowserifyでビルドし、ライセンスコメントを適切に残す - $shibayu36->blog; gulp + browserify + tsifyを利用してTypeScriptコンパイル環境を作る - $shibayu36->blog; typingsを使ってnpm…

「ボールルームへようこそ」読んだ

[asin:B00AIG3W7Y:detail]本屋でうろうろしてたら、結構目立つ位置に置いてあったので、気になって読んだ。結構好きな感じで、今の最新巻まで一気に読んでしまった。この漫画は競技ダンスを題材としていて、「背筋をピンと」とかと同じようなジャンル。主人…

「百万畳ラビリンス」読んだ

百万畳ラビリンス(上) (ヤングキングコミックス)作者:たかみち少年画報社Amazon百万畳ラビリンス(下) (ヤングキングコミックス)作者:たかみち少年画報社Amazon最近マンガ大賞2022というのを見つけて、それにランクインしている「百万畳ラビリンス」を読んだ…

フロントエンド速度改善でやったこと(Expiresヘッダ、faviconのgzip圧縮、JSの読み込み遅延化)

フロントエンド速度改善をしようとして参考にしたもの - $shibayu36->blog; という記事を以前に書いたのだけど、結局何をやったか書いて欲しいと社内で言われたので、今回のフロントエンドの速度改善でやったことについて書いてみる。そこまで大したことはや…

Google Tag Managerを使ってバナーやメッセージをデプロイなしに切り替える

サイトを運用していると、例えばトップページのサイドバーにバナー画像を出したくなったり、ユーザーへの告知用のメッセージをトップページに出したいなどということがあります。この時、自由にその場所のHTMLを書き換えたいけど、書き換えるたびにコードを…

magit最新版でdiffの色設定をした

magit最新版にしたら、faceの名前が全然変わってて、異常に見づらくなってたので、色を再設定した。Before After 設定項目はcustomize-group magitして、faceの項目を見ながら勘で設定した。 ;; cursorが載っていない状態でのaddedのface (set-face-foregrou…

typingsを使ってnpmモジュールをTypeScriptで利用する

以前、npmモジュールをTypeScriptで利用する(tsdによる型ファイル管理) - $shibayu36->blog; という記事を書いたが、最近tsdを使っていると、 npm WARN deprecated tsd@0.6.5: TSD is deprecated in favor of Typings (https://github.com/typings/typings) …

フロントエンド速度改善をしようとして参考にしたもの

最近フロントエンドの速度改善をほんの少しだけやって、いろんな資料を参考にしたので、今後また速度改善をする時に備えて、参考になった資料をまとめておく。今回パフォーマンス改善やった項目としてはExpiresヘッダ付ける、gzip圧縮かける、JSをbodyの一番…

「開眼! JavaScript」を読んだ

最近TypeScriptとかを利用して結構JSも触るようになったし、久しぶりにJSのことでも学ぼうと思い、JS界隈の人がよく名前を挙げていた「開眼! JavaScript」を読んだ。開眼! JavaScript ―言語仕様から学ぶJavaScriptの本質作者:Cody Lindleyオライリージャパン…

Chromeのネットワークタブで、レスポンスにExpiresヘッダが付いていない通信だけ表示する

blog.shibayu36.org以前こういう記事を書いたけど、特定ヘッダが付いていない通信だけ表示するのも簡単に出来たのでメモ。Filterに「-has-response-header:Expires」と書くだけ。また拡張を除外したかったら-scheme:chrome-extensionとかも一緒に書いたら良…

web-modeでペースト時に自動でインデントされるのをやめる

Emacsのweb-mode.elはHTMLを編集するにあたって非常に便利なmodeなのだけど、気を利かせすぎてて微妙に使いにくいところがある。例えばペースト時に自動でインデントされるのは個人的にはちょっと困っていて、改行で自動インデントされたいけど、ペースト時…

Chrome Developer Toolsのネットワークタブから拡張のリソースを消す

ネットワークタブでパフォーマンスチェックをすると、Chrome拡張で入っているリソースもいろいろ出てきて、実際にこのサイトで使っているリソースがわかりにくかったりする。この場合、Filterを使うとChrome拡張のリソースを除外できることを知ったのでメモ…

ある文字列は含まれているけど、ある文字列は含まれていないファイルを探すワンライナー

ちょっと便利だったので自分用にメモ。 git grepにはgrepに引っかかったファイル名を出す --name-onlyオプションがある またgit grepでは逆にgrepに引っかからなかったファイル名を出す --files-without-matchオプションがある これを利用すると以下のコマン…

npmモジュールをTypeScriptで利用する(tsdによる型ファイル管理)

前の記事で、TypeScriptでフロントエンドの実装をし、ブラウザ用にコンパイルする事ができるようになった。blog.shibayu36.org今のままではnpmで入れたjQueryやlodashなどをTypeScriptから利用することができない。TypeScriptでJSのモジュールを利用するには…

「がん保険を疑え!」を読んだ

「生命保険のウラ側」を読んだ - $shibayu36->blog; に引き続き、がん保険についても知りたいので読んだ。前回の本が分かりやすかったので引き続き同じ著者の本を読んだ。がん保険を疑え!作者:後田 亨ダイヤモンド社Amazonこの本はがん保険について、保険会…

「生命保険のウラ側」を読んだ

保険について気になってきたので、「医療保険は入ってはいけない!」を読んだ - $shibayu36->blog;に引き続き、「生命保険のウラ側」を読んだ。生命保険のウラ側 (朝日新書)作者:後田 亨朝日新聞出版Amazonこの本は論点がはっきりしていて、非常に分かりやす…

「医療保険は入ってはいけない!」を読んだ

最近保険とかも気になってきたので読んだ。医療保険は入ってはいけない![新版]作者:内藤 眞弓ダイヤモンド社Amazonこの本は医療保険で喧伝されている内容があまり事実ではないことを紹介し、では実際に病気などのリスクに備えるにはどういう対策をしていっ…

gulp + browserify + tsifyを利用してTypeScriptコンパイル環境を作る

最近TypeScriptを書いている。TypeScriptはそのままではブラウザで動かないのでコンパイルしてES5の形式にする必要がある。tscを使えば普通にコンパイル出来るのだが、今回はgulp + browserify + tsifyを利用したTypeScriptコンパイル環境を作ってみたのでメ…

JSをbrowserifyでビルドし、ライセンスコメントを適切に残す

最近JSを利用するときは、依存モジュールはnpmを利用し、ES6やTypeScriptの仕様を開発には使った上で、ブラウザ用にコンパイルして配信するようになってきている。また同時にネットワークの負荷を下げるためにminifyを行う場合もある。minifyはライセンスが…

emacsでweb-modeを利用してHTML + Xslate(TTerse)の環境でsyntax highlightする

仕事でHTMLを書くときは大体HTML + Xslate(TTerse syntax)という構成でやっている。今まではhtml-modeを使っていたのだけど、流石にXslateのsyntaxがハイライトされないのだるくなってきた。そこでweb-modeというのが便利と見たことがあったので入れてみた。…