タグ

ブックマーク / blog.shibayu36.org (130)

  • コードレビューを段階的に行ってもらう話 - $shibayu36->blog;

    最近コードレビューをどのように回していくかについて考えたことがあったのでブログに書いておく。 コードレビューの目的 コードレビューには誤りの発見以外にいろいろな目的がある。自分の中ではid:hisaichi5518が昔プレゼンでまとめていた目的が結構しっくり来ている。 https://speakerdeck.com/hisaichi5518/kodorebiyufalsehua?slide=8 http://hisaichi5518.hatenablog.jp/entry/2014/10/29/165721 機械的に発見できない誤りの発見 技術力の向上 属人性の排除 コードレビューの目的としては誤りの発見と同様に、技術力の向上や属人性の排除といった教育的側面も重要である。 コードレビューで課題に思っていたこと 自分のチームでは基的に一人がコードレビューをして、OKだったらmergeをして

    コードレビューを段階的に行ってもらう話 - $shibayu36->blog;
  • Emacsで英和辞書や和英辞書をすぐに引けるようにしたい - $shibayu36->blog;

    ちょっと調べてたら、 英語力を向上させたいのでまずは Emacs からはじめた | Futurismo google-translate.el : 【設定パワーアップ】Google翻訳で言語自動判別しつつ英訳・和訳する! というような記事を見つけて、google-translate.elというのを見かけたので導入してみた。特にrubikitchさんの記事は自動で日語か英語かを判定してくれるので、そのまま導入した。 動作 キーバインドはほぼ一つで以下の動作が出来ます。 インストール M-x package-install google-translateで。 設定する (require 'google-translate) (require 'google-translate-default-ui) (defvar google-translate-english-chars "[:asc

    Emacsで英和辞書や和英辞書をすぐに引けるようにしたい - $shibayu36->blog;
  • 自分のSlack見がち問題対処法 - $shibayu36->blog;

    Slack見がちなぜコードが書けないのか,あるいは仕事が遅いのか - masawadaの日記 blog.sushi.money に関連して。 むちゃくちゃ雑に書くけど、結局僕は3年前と変わってなくて、しかもこれだけでもなかなか上手く行っている。 今日はもっとIRC見づらくしようと思って、すごいダサい感じの対処方法だけど、クライアントを画面の外の方に押しやって、普通にショートカットでクライアントをアクティブにしても画面の外にあるから見えない状態みたいにしてみた。仕事の仕方が悪かった - $shibayu36->blog; あと必要のないチャンネルに入らないことも重要ですね。 2016/5/27 15:00補足 そういえば、Slack自体を終了するという戦略を取らない理由もありました。僕はAlfredとかのアプリランチャーでSlackを開くとか、メールアプリを開くとか、そういういろいろが手癖に

    自分のSlack見がち問題対処法 - $shibayu36->blog;
  • 最近コード中のTODOコメントの書き方を工夫している - $shibayu36->blog;

    コード中に後でやろうと思って以下の様なTODOコメントを書くことがあります。TODOコメントというのは # TODO: 後でリファクタリングしたい ... # TODO: 投稿機能ができたら置き換えること ... みたいなやつです。 コード中にTODOコメントを気軽に書いてしまいがちですが、よくTODOコメントが放置されて気づいたらプロジェクト中に大量のTODOコメントが書かれたりすることがあります。直せる量を超えてくると、直すモチベーションも下がってきて、結局ただのコメントと同じ状態になります。 最近いろいろ工夫して、TODOコメントの書き方を変えたところ、そこそこうまく回ったのでメモしておきます。 TODOコメントの問題点 問題点として次のものがあると考えました。 (1) 書く人によって形式がバラバラ TODO, XXX, FIXMEなどバラバラだったりする (2) TODOコメントの

    最近コード中のTODOコメントの書き方を工夫している - $shibayu36->blog;
  • 「オブジェクト指向入門 第6章 抽象データ型」を読んだ - $shibayu36->blog;

    オブジェクト指向入門 第2版 原則・コンセプト (IT Architect’Archive クラシックモダン・コンピューティング) 作者:バートランド・メイヤー翔泳社Amazon 「オブジェクト指向入門 第3章モジュール性」メモ - $shibayu36->blog; の続きで、「第6章 抽象データ型」を読んだ。 この章では、オブジェクトを適切に表現する記述として、抽象データ型というものを紹介している。これが非常に参考になったので軽く読書メモをとっておく。 抽象データ型とは 抽象データ型の仕様の記述とは以下の4つを記述することであるようだ。 TYPES(型) FUNCTIONS(関数) -> その抽象データ型に適用可能な操作の集合 AXIOMS(公理) -> その抽象データ型が必ず満たす条件 PRECONDITIONS(事前条件) -> 部分的な関数のソース集合の定義域 STACKの例を見

    「オブジェクト指向入門 第6章 抽象データ型」を読んだ - $shibayu36->blog;
  • TypeScriptでのフロントエンド開発環境作成総まとめ - $shibayu36->blog;

    これまで自分のブログで、TypeScriptを使ったフロントエンド開発環境についてブログをいくつか書いてきた。ひとまずこの辺りで、TypeScriptフロントエンドを開発するための最低限の環境を構築できるようになったので、総まとめとしてブログエントリを書いておく。 今回のサンプルコードは https://github.com/shibayu36/typescript-project-sample/tree/4653cd002eef3ee1946a2ca1da344e0076b2844f に置いたので参考に。 これまでの記事 EmacsでTypeScript環境を整える - $shibayu36->blog; JSをbrowserifyでビルドし、ライセンスコメントを適切に残す - $shibayu36->blog; gulp + browserify + tsifyを利用してTypeSc

    TypeScriptでのフロントエンド開発環境作成総まとめ - $shibayu36->blog;
  • フロントエンド速度改善でやったこと(Expiresヘッダ、faviconのgzip圧縮、JSの読み込み遅延化) - $shibayu36->blog;

    フロントエンド速度改善をしようとして参考にしたもの - $shibayu36->blog; という記事を以前に書いたのだけど、結局何をやったか書いて欲しいと社内で言われたので、今回のフロントエンドの速度改善でやったことについて書いてみる。そこまで大したことはやってないので参考程度にどうぞ。 前提 ページのレンダリングが遅いと思い始めたので改善をすることになったのだが、改善をし始めたところChromeのアップデートがあり爆速になってしまった(FirefoxやSafari等はもともと速かった)ので、では明らかにやったほうが良いことだけやりますかという話になった。そのためあんまりbefore/afterもちゃんと取っていないので、今回はやったことの紹介くらいに留める。 やったこと 計測や調査をしてみたところ、以下のようなことはやってしまったほうが良いということになった。 静的ファイルに適切にEx

    フロントエンド速度改善でやったこと(Expiresヘッダ、faviconのgzip圧縮、JSの読み込み遅延化) - $shibayu36->blog;
  • Google Tag Managerを使ってバナーやメッセージをデプロイなしに切り替える - $shibayu36->blog;

    サイトを運用していると、例えばトップページのサイドバーにバナー画像を出したくなったり、ユーザーへの告知用のメッセージをトップページに出したいなどということがあります。この時、自由にその場所のHTMLを書き換えたいけど、書き換えるたびにコードをデプロイしないといけないと大変です。そこで、今回はGoogle Tag Managerを使ってバナーやメッセージを配信するのを試してみたので紹介します。 どうやってやるのか Google Tag ManagerはAnalyticsの設定を入れたり、任意のHTMLを入れたりなど、Googleの管理ツールを触るだけで簡単にサイトにタグを入れたりできるツールです。そしてGoogle Tag ManagerのカスタムHTMLというのを利用することで、自分の好きなHTMLタグをサイトに差し込むこともできます。 これを利用して、カスタムHTMLにバナーを入れるため

    Google Tag Managerを使ってバナーやメッセージをデプロイなしに切り替える - $shibayu36->blog;
  • フロントエンド速度改善をしようとして参考にしたもの - $shibayu36->blog;

    最近フロントエンドの速度改善をほんの少しだけやって、いろんな資料を参考にしたので、今後また速度改善をする時に備えて、参考になった資料をまとめておく。今回パフォーマンス改善やった項目としてはExpiresヘッダ付ける、gzip圧縮かける、JSをbodyの一番下にとか基的なことしかやらなかったので、そのあたりはこの記事ではまとめていません。 今回は「測定する」「ブラウザがどう表示しているか知る」「改善を検討する」の流れで調べていったのでその順にまとめる。 測定する 何はともあれ測定しないと何も始まらないので、まずは測定の仕方について調べた。 PageSpeed Insights( https://developers.google.com/speed/pagespeed/insights/ )と、webpagetest( http://www.webpagetest.org/ ) はとりあえ

    フロントエンド速度改善をしようとして参考にしたもの - $shibayu36->blog;
  • JSをbrowserifyでビルドし、ライセンスコメントを適切に残す - $shibayu36->blog;

    最近JSを利用するときは、依存モジュールはnpmを利用し、ES6やTypeScriptの仕様を開発には使った上で、ブラウザ用にコンパイルして配信するようになってきている。また同時にネットワークの負荷を下げるためにminifyを行う場合もある。 minifyはライセンスが絡むと少し難しい。例えばコメントを全て削除してしまうとライセンスコメントまで消えてしまう。この問題にはみんながそれぞれの手法で対処しているみたい。1年ほど前の記事でクライアントサイドJavaScriptのライセンス管理 | エンジニアブログ | GREE Engineering というものがあり、いろんなJSのコンパイルのためのライブラリが独自でライセンスの形式を決めていて、それにマッチしないものは消えてしまう、みたいな辛いことが起きてそうだった。 そこで今回は自分の勉強も兼ねて、npmのモジュールを含めてブラウザ用にコンパ

    JSをbrowserifyでビルドし、ライセンスコメントを適切に残す - $shibayu36->blog;
  • 「師弟登壇2015」ではてなの研修について発表しました - $shibayu36->blog;

    pepabo.connpass.com 「師弟登壇2015」ではてなの研修について発表してきました。 speakerdeck.com 今回の発表は 実践で手を動かすのが一番勉強になる 出来るだけ早く知識を身に付け、チーム配属できるように工夫している をテーマに話しました。久々に発表したら緊張して、最初の方全然調子出なかったので、定期的に前に出て発表しないとなあという気持ちになりました。 ちなみにこの発表の後に、@amagitakayosi くんが、新卒研修受けてないという発表をしてて面白いと思いました。まあなんにせよ実践でいろいろやってるのでよし!!!! speakerdeck.com ちなみに自分の時はどうだったかな―って思ったら、amagiくんに下のような指摘を昨日受けてウケてました。なんで新卒の時から研修について考えているのか!!!! こんなこと書いてるけど、最近はちゃんと研修やって

    「師弟登壇2015」ではてなの研修について発表しました - $shibayu36->blog;
    fumikony
    fumikony 2015/12/07
  • Scala入門記 - $shibayu36->blog;

    僕はこれまでまともに学習したプログラミング言語がPerlJavaScriptしかなくて、静的言語的パラダイムや関数型パラダイムは概念は知っているものの、それがどう役に立つのか、逆にどういう面で課題がありどのように対処されているのか、などといったことを知らなかった。知らなくてもまあ仕事PerlとJSでやっているので問題ない。しかしすでにこれらの言語から得られる概念的な知識の吸収の速度が鈍化してきていて、このままではエンジニアとしてまずいのではないかという危惧感があった。 そこで静的言語であり、関数型言語であり、また社内でも使われ始めているためサンプルコードがあるScalaの学習をすることにした。 学習するにあたって困ったことは、どういうドキュメントを読み、どのように実践するとScalaの概観をつかめるか分からないということだった。そこで今回は自分の経験を踏まえて、このように入門していくと

    Scala入門記 - $shibayu36->blog;
  • 暗号技術の要点を学ぶ - 「暗号技術入門」を読んだ - $shibayu36->blog;

    最近SSLやユーザアカウント管理の安全性とかに興味があって、その要素技術である暗号技術に興味が湧いてきたので、最近新板が出た「暗号技術入門」を読んだ。 暗号技術入門 第3版 秘密の国のアリス 作者:結城 浩SBクリエイティブAmazon このは、暗号学者がよく使う仕組群(このでは暗号学者の道具箱と呼称)である、対称暗号、公開鍵暗号、一方向ハッシュ関数、メッセージ認証コード、デジタル署名、擬似乱数生成器について、仕組みを順に解説してくれる。また、ただ解説してくれるだけではなくて、その仕組みによって解決できる問題と解決できない問題を明示し、では解決できない問題を解決するにはどうするかというふうに章が進んでいくので、暗号技術を分かりやすく学んでいくことが出来る。 暗号技術というと数学的で非常に難しい印象があるけど、著者である結城さんが単純化して説明してくれているおかげで数学的知識がなくとも分

    暗号技術の要点を学ぶ - 「暗号技術入門」を読んだ - $shibayu36->blog;
  • 乱数の性質とセッショントークンの作成 - $shibayu36->blog;

    ユーザアカウントのログイン機能とか作ってると、何らかの形でセッション用のトークンを作成する機会がある。今まではこれは適当にランダムな値を利用していればいいんでしょと思っていたのだけど、ちょっと違ったのでメモ。 乱数の性質 http://akademeia.info/index.php?%CD%F0%BF%F4によると、乱数には三つの性質がある。 無作為性:統計的な偏りがなく、でたらめな数列になっているという性質。 予測不可能性:過去の数列から次の数を予測できないという性質。 再現不可能性:同じ数列を再現できないという性質。再現するためには、数列そのものを保存しておくしかない。 この時、少なくとも無作為性のみ満たされていると弱い擬似乱数、無作為性と予測不可能性が満たされていると強い擬似乱数、全てが満たされていれば真の乱数と呼ばれる。ソフトウェアだけでは、真の乱数を作ることができず、真の乱数に

    乱数の性質とセッショントークンの作成 - $shibayu36->blog;
  • 「体系的に学ぶ安全なWebアプリケーションの作り方」再読した - $shibayu36->blog;

    ユーザアカウント周りの実装で気をつけるべきことをもう一度学び直すために「体系的に学ぶ安全なWebアプリケーションの作り方」を再読した。 体系的に学ぶ 安全なWebアプリケーションの作り方[固定版] 脆弱性が生まれる原理と対策の実践 作者:徳丸 浩SBクリエイティブAmazon 以前読んだ時はXSSとかSQLインジェクションとかCSRFとかの特に基的な部分に関して頭に入ってきてたとけど、今回はアカウント周りとターゲットを決めたのでクッキー周り、セッション周りについて重点的に学ぶことができた。とくに5章にはユーザアカウントの登録や管理、メールアドレス変更、パスワード変更など、ユーザアカウント周りを実装するにあたってまさに必要な情報が書いてある。 サービスを作るにあたってアカウント周りに関することをやることは多いので、そういう時にはもう一度読んでみると良さそうと思った。

    「体系的に学ぶ安全なWebアプリケーションの作り方」再読した - $shibayu36->blog;
  • プロジェクトを成功させるために最初におこなっていること - $shibayu36->blog;

    ディレクター時代に仕事プロジェクトを受け持つ時にどうやったら成功させることが出来るのかについていろいろ考えていた。僕は開発フローをいろいろ考えるのが好きなのだけど、実際に自分がリーダーシップを取ってプロジェクトを進めることを経験すると、そもそもその前に考える・決めるべきことがたくさんあるということが分かったので、ブログに書いておこうと思う。 ここで言うプロジェクトとはサービスを一から作ったり、サービスの一機能を作ったり、受託案件一つだったりを指す。特に開発プロジェクトに限定するものでもない。 プロジェクトを成功に近づけるためには、まずプロジェクトの開始時に、プロジェクトの5W1Hを明確にし、個々のメンバーの責任範囲を決め、それらを一つの場所にまとめておくということをしておくと良いと考えている。 5W1Hを決める すごい基的なことだけど、プロジェクトをやる上でやはり5W1Hは大事である。

    プロジェクトを成功させるために最初におこなっていること - $shibayu36->blog;
  • #yapcasia 2015に参加しました - $shibayu36->blog;

    今年もYAPC::Asia 2015に参加しました。今年のYAPCも非常に面白いトークが多く、またいろいろな人と会話でき、非常に楽しめた。 トークとしては、Effective ES6、Perlの上にも三年 〜 ずっとイケてるサービスを作り続ける技術 〜 、3分でサービスのOSを入れ替える技術が非常に参考にった。フロントエンドPerl、インフラといろいろな層の話が聞けてYAPCはすごい。 今年でYAPCが終わりということで非常に寂しい気持ち。はてなでアルバイトとして入ってプログラミングを始めた時にYAPCに初めて参加して、さまざまなPerlハッカーの人たちにあこがれて、いろいろやっていたら、一年ごとにだんだんPerl界隈の人とも会話させてもらえるようになったので、YAPCに育てられたという気持ちになっている。最初のころantipopさんに連れられてmiyagawaさんの隣で写真を取らせても

    #yapcasia 2015に参加しました - $shibayu36->blog;
  • 自分流Elasticsearch入門 - $shibayu36->blog;

    【2016/09/10追記】 勉強しなおして、Elasticsearchの知識についてさらにまとめた記事を書いたので、そちらを参照してもらうと良さそうです。 blog.shibayu36.org 最近Elasticsearchの勉強をした。ただ、入門のためどのような資料が適しているかを知るのが大変だった。そこでどのように勉強したかについてメモをしておく。少しまとめエントリー的なノリになりそう。 Elasticsearchの概念を知る 全文検索技術の基を知る Elasticsearchのドキュメントのたどり方を知る の順に学習を進めていった。 Elasticsearchの概念を知る Elasticsearchの学習を始めようとした時に、まずは基からということで以下のを読んでいた。 高速スケーラブル検索エンジン ElasticSearch Server (アスキー書籍) 作者:Rafal

    自分流Elasticsearch入門 - $shibayu36->blog;
  • 第10回elasticsearch勉強会に行ってきました - $shibayu36->blog;

    elasticsearch.doorkeeper.jp 最近elasticsearchを触ることがあるので勉強会に行ってきました。 今回のなかで個人的に一番面白かったのは@mats116さんの「AWSで実現するelasticsearchの大規模運用」という話。nodeをmaster/data/searcher/indexerという役割に分けて、インフラを構成しているという話がなるほどという感じ。ある程度大規模になると大体master/data/searcherみたいな構成になりそうに感じる。searcherの部分はhttp.enabledをfalse、node.dataをfalseにするといっていたので、なんかのライブラリを利用してtransport層で通信しているのかなと思った。 またjohtaniさんの紹介していたelasticonの発表の中で、以下の話が面白そうだったので時間がある時

    第10回elasticsearch勉強会に行ってきました - $shibayu36->blog;
  • emacsの正規表現をもっと便利に使う - $shibayu36->blog;

    emacsで正規表現を使って置換したいみたいな要求はそれなりにあると思いますが、それをやろうとするとemacsの正規表現のバックスラッシュ地獄みたいなものに遭遇することがよくあります。そんな時に使いたいtipsを少しだけ紹介します。 re-builderを使う emacsにはre-builderというものがあって、書いている正規表現のマッチ状況をリアルタイムにプレビューすることが出来るツールが存在します。M-x re-builderして、いろいろ書いてみると現在のマッチ状況がプレビューされます。 実行中にC-c C-wすればその正規表現をコピーでき、C-c C-qで終了出来ます。emacsにはいろいろな正規表現syntaxがあるので、C-c C-iで切り替えもできます。 詳しくは以下の記事を見るとよいでしょう。 Emacsの正規表現編集モード re-builder とややこしいバックスラッ

    emacsの正規表現をもっと便利に使う - $shibayu36->blog;