Go でツール書くときはタスクランナーとして make を使っています。ビルドだけじゃなくて、テストや配布用パッケージ作成も一括して make でやっています。 今回は整理も兼ねて、自分が普段どういう Makefile を使っているのか解剖していきます。 なぜ make を使うのか ビルドフラグ覚えるのが面倒だから、make は (Windows を除く) 大半のプラットフォームに入っていて使いやすいからというのが理由です。script/build みたいにシェルスクリプトを複数用意するのでもまあ良いと思いますが…。大半の Go プロジェクトは Makefile 置いてありますね。 make を使った開発フロー 基本的には、リポジトリを git clone / go get -d した後に以下のコマンドを打てばアプリケーションをインストールできるようにしています。 $ cd $GOPATH

この記事は Vim Advent Calendar 2016 9日目の記事です。 この記事で言いたいこと 翻訳作業に是非参加を！ vim-jp/vimdoc-ja-working: vimdoc-ja working repository vim-jp/lang-ja: Manage Japanese language files which distributed with vim. 以上です。以下はどうしてvimdoc-jaに翻訳参加することになったのか、やってみてどうだったか書いていきたいと思います。 やったこと 未翻訳部分を翻訳。 repeat.jax eval.jax(進行中) 英語版と日本語版とのバージョンが不一致な箇所修正、更新分を翻訳 autocmd.jax cmdline.jax filetype.jax 動機 そういえば最新のVimではpackagesというプラグイン管

この記事は Vim 8.0 Advent Calendar の 1 日目の記事です。 Vim 8.0 では Vim script の関数機能が強化されました。この記事では Partials とラムダを紹介します。 Partials これまでの Vim script では function() 関数で関数参照(Funcref)を作成できました。これにより、関数を変数に入れ、直接呼び出すことができます。 let Foo = function('strftime') echo Foo('%Y-%m-%d') " => 2016-12-01 echo Foo('%Y-%m-%d', 1482634800) " => 2016-12-25

Go その2 Advent Calendar 2015 2日目です。 今日書くこと APIを提供するためのコード APIを利用するためのコード マイクロサービス (･∀･)ｨｨｲｲ!! かもしれない やれなかった / この記事には書いていないこと 以下サンプルで利用するコードは こちら。 お手元で起動する1 ための手順は READMEをご覧ください。 APIを提供するためのコード Go言語には APIのためのよさげなフレームワークはありますが、 今回はそれらを使わずともかんたんに APIサーバが作れることをお伝えしたく。 ベースとなっている元ネタは A RESTful Micro-Framework in Go これなのですが ここから、やりたいことができるように変えていった結果をサンプルに、 どうすれば APIサーバが書けるのかを記します。 まず、APIのエンドポイントが実装すべきインタ

[2018/07/07 追記] 本記事ではChrome拡張について説明していますが、Firefox1やEdgeの拡張機能もほぼ同じ仕組みで動いています。 [2023/11/06 追記] #参考 ページを追加しました。 Chrome拡張。便利な機能を簡単に追加できるので使っている人も多いと思います。 ただ、インストール時の権限の注意書きが分かり難いので無条件に承認（追加）していることもあるのではないかと思われます。 そこで、本記事ではChrome拡張の権限の種類・確認方法の他、拡張がどこまで（悪いことを）できるのかとその対策を3段階の権限（危険性）レベルごとに紹介していきたいと思います。 便利だが危険性もあるChrome拡張 Chrome拡張をインストールすると、Webページを読むというブラウザ本来の機能だけでなく様々なことができるようになります。 例えば、Webメールの新着通知や記事などの

この記事は「WACUL Advent Calendar 2016」の3日目です。 今年の10月からWACULでフロントエンドエンジニアをしている@bokuwebと申します。 本記事ではRxJSの勉強にテトリスを実装した話しを書いてみます。 つくったもの リポジトリ: https://github.com/bokuweb/rxjs-tetris デモ: https://bokuweb.github.io/rxjs-tetris/ デモの遊び方 Enterキーでゲームが開始します。(音が鳴るのでご注意ください。) → : ブロックを右へ移動 ← : ブロックを左へ移動 ↓ : ブロックを下へ移動 SPACE : ブロックを回転 概要 先に全体の流れを図示すると以下のような構成になりました。 後述しますが、Timer/KeyInputStraemからActionが発行され、ゲームのステートを更新

flowtype v0.31.0がでましたね！（既にv0.32.0もでてますけど） CHANGELOG読んでみると Added a new "magic" type called $PropertyType. This utility extracts the type of the property 'x' off of the type T. magic typeなる気になる用語があるじゃありませんか！！ どうやら$から始まる定義済みの型のことを指してるようなのですが、公式のドキュメントや過去のCHANGELOGを見てもそんなものは一切出てきません。 仕方ないので実際にコードを見てみると https://github.com/facebook/flow/blob/master/src/typing/type_annotation.ml type_annotation.mlの中に$から始

DDD: ImmutableなEntityの実装方法〜ステートソーシングなEntityとイベントソーシングなEntity〜ScalaDDDドメイン駆動設計 ドメイン駆動設計では、Value ObjectはImmutable、EntityはMutableという雰囲気があるように思うが、ScalaでDDDを実践しようとなると、EntityがMutableでは逆に実装が複雑になることが多い。僕がDDDを始めた2013年頃は、ImmutableなEntityの実装に関する情報がほとんどなく実装方法を試行錯誤していた。その中で、個人的にImmutable Entityの実装方法が落ち着いてきたので、僕がどのように実装しているかについて紹介したい。 なお、ここで紹介するScalaコードはGitHubのsuin/scala-playgroundで公開しているので、コンパイル・実行など試してみたい場合はご

cssnextとは策定中のCSS仕様を先立って使えるようにするツールのことです。 ひとことで言うとCSS版Babelです。 CSSを変換する仕組みはPostCSSのプラグインとして有志によって作成されています。 cssnextはそのプラグインをまとめたプラグインパックと呼ばれるものです。 ※古いブラウザに対応させるためのフォールバック機能を提供するプラグインも含んでいます。 本記事は策定中のCSSの知識をつけることが目的です 参考リンクなど cssnext（PostCSS）の背景や使い方は先日記事を書いたので是非見てみてください Step by Stepで始めるCSSモダン化（PostCSS） playgroundでcssnextが実際にどのように変換するのかを試せます。 機能一覧 本記事で紹介する機能一覧を出すのに使ったcssnextのページです。 postcss-cssnext fea

Electronさわってみました アイコンフォントを作り直す案件があり、位置調整やサイズ感の確認のたびにコマンド叩くのも、（リモートの）デザイナーさんとやりとりするのも大変だなということで、デザイナーさん向けの検証用のツールを作りました。 ゴール: GUIでSVGからwebfontに変換できるようにする github: svg2webfont に置いてます。 ツールとしては、ブラウザ上で使えるIcoMoon や fontello に近いものです。 もちろんこれで不便なければこちらを使えば良いのですが、 unicodeとアイコン名が対応しているjsonファイルが欲しい web上のサービスに依存するのが怖い（手元でやりたい） 一度作ってしまえばどのプロジェクトでも使いまわせそう Electronで何か作ってみたかった（重要） ということで、お試しでつくってみました。 Electronを使う利点

注）本文中の「コンテナ」「アイテム」について 本文中でいう「コンテナ」「アイテム」は、flexコンテナとflexアイテムのことを指しています。 コンテナ display: flexや、wrap指定などをする 複数のアイテムを含む アイテム flex: 1 0 0%などの指定をする 1. アイテム潰れる問題（Safari） Chrome Safari 潰れてますね。 起きる条件 Safari なぜ コンテンツの最小サイズを尊重してくれない模様 どうすればいいのか flex-shrinkに0を指定 flex-basisにautoを指定（デフォ値なので、指定がなければそのままでOK） Safari10にて修正済み（つまり、SierraとiOS 10以降では対応不要） 2. align-items:center はみ出す問題 Chrome IE11 はみ出てますね。 起きる条件 IE10-11 f

互換性のない変更 #4483: Node 4 未満のバージョンのサポートを終了 Node.js v0.10 は9月末、Node.js v0.12 は12月末でメンテナンス サポートが終了します (参考: https://github.com/nodejs/LTS )。これに先立って、ESLint では v0.10 と v0.12 のサポートを終了します。 ESLint 3 がサポートするのは Node.js v4 以上のバージョンとなります。 Node.js v0.10, v0.12 で ESLint を実行する必要がある場合は ESLint 3 へのアップグレードをお控えください。 Travis CI のようなツールで複数の Node バージョンでのテストを実施する場合、同じソースコードをすべての Node バージョンで ESLint によるチェックをする必要はないかもしれません。その場

2年くらい前までは、brewdleが行方不明になったり、そのせいでBrewfileはオワコン扱いされたりといろいろありましたが、 Homebrew CaskがHomebrewに取り込まれたことでセットアップ界はだいぶ落ち着いたと思われます（自分調べ）。 というわけでHomebrew関連のセットアップツールについて現在の状況をまとめました。 なお、AnsibleとかBoxenとかについては触れません。ご了承ください。 Homebrew Cask Homebrew Caskは簡単に言うとその辺に転がっているパッケージをインストールできるツールです。 もともとは後述するbrewdleで有名になったと記憶しているんですが、便利すぎたので本家に吸収されちゃっています。 $ brew cask install alfred $ brew cask install android-studio $ br

この翻訳について Airbnb React/JSX Style Guideの和訳です。 間違っていたり分かりにくい箇所があれば、ご指摘いただけると幸いです。 Airbnb React/JSX スタイルガイド このスタイルガイドは現在一般的に使用されている標準に基いていますが、場合によってはいくつかの慣例（async/awaitやstatic class fields）が含まれていたり禁止されていたりします。現在、このガイドにはステージ3より前のものは含まれておらず非推奨です。 目次 基本的なルール クラス vs React.createClass vs ステートレス ミックスイン 命名規則 宣言 アラインメント 引用符 空白 引数 参照 括弧 タグ メソッド 順序 isMounted 基本的なルール Reactコンポーネントは1ファイルに1つだけにしてください。 ただし、1ファイルに複数の

##記事の想定読者 コードレビューで困ったことのある方 感覚的な経験を他人に納得させるための言葉が必要な方 ##一言で答えると 再代入は参照透過性を壊すため ##参照透過性って何さ 以下のような性質のこと 関数は同じ引数に対して常に同じ値を返す 値は最初に定義した値から常に変わらない ##参照透過性を確保したい理由 関数やクラスの仕様を一意に定められるため、バグの混入を避けやすい。 テストが容易になる。 状態の変化を考慮する必要がないため、パターンの組み合わせ爆発が起きにくい。 ##まとめ : 再代入を許容すると何が起きるのか 言い換えてみるとわかりやすい hoge = fuga だった値が、いつのまにか hoge = piyo に変更されている状況では 値が変わった場合でも正しく動作するということを再度テストする手間と 値が変わったことを検出する手間と それを見落としてしまうリスクが生じ

Help us understand the problem. What is going on with this article? 18日午前（日本時間で19日深夜）に行われたGoogle I/O 2016のKeynoteでは、Google社から新しいメッセージングアプリ「Allo」が夏にリリース予定であることが発表されました。実際にAlloが動作しているデモがKeynote内で行われていましたので、どんなアプリになっているのか、そのデモを見ることで理解することができるでしょう。 AlloのAndroidアプリは、すでに事前登録を開始しています。 このデモを見たときに、他社と比べてアプローチの仕方が大きく違うことに気がつきました。Alloの登場によって役者が出そろった感があるので、僕の知っている範囲で少し整理をしてみたいと思います。 主力メッセージングアプリ 基本的に、メッセージングア

作ったもの 成果物は Alcatraz を便利に検索する Alcatraz Search という web アプリを開発しました を参照ください。 ソースコードは starhoshi/AlcatrazSearch にあり、 GitHub Pages で公開 されています。 今回作るためにした勉強や開発の感想、 React と Angular の比較などをつらつら書いていきます。 多少なりともフロントの心得がある人向けで、あまり説明的ではない内容です。 フロントエンド開発経験 2015年7月くらいから業務で Angular, TypeScript, Browserify, gulp やらで Cordova 製のスマホアプリを開発。 半年ちょいのニワカです。 AlcatrazSearch は仕事終わりと土日に開発して 1 ヶ月かかった。 勉強のための開発なので、期間は目安といった感じ。 あと業務

Karmaを使うことでフロントエンドの単体テストを楽しくかつ機能的に行うことができます。 ステップを通して少しづつ理解できるように執筆しました。 また、最後に重要だろうと思われる補足内容を記載しました。 Karmaの導入に一役買えれば幸いです。 テスト全体の流れについては以前書いた記事フロントエンドにテストを導入を参照してください。 Karmaとは ブラウザ上で 単体テストを実行するためのテストランナーです。 テストを実行するだけでなくファイルの変更監視や結果のレポートを出力してくれたりと単体テストに必要な機能が一通りそろっています。 特定のフレームワームに依存しておらず汎用的に使えるツールで、プラグインを使った機能の拡張が強力です。 前提 Nodejs,npm,chromeが導入済みであること 流れ Karmaは4つの大きな機能（プラグイン）が存在します。 Step 3 〜 Step 6

はじめに ReduxはSingle Store、immutableなState、副作用のないReducerという３つの原則を掲げたFluxフレームワークです。しかし他のフレームワークと違って提供しているものは最小限で、とてもフルスタックとは言えない薄さです。そのためすべてにおいて定番と言える書き方が定まっているわけでもなく、どうしようか迷ってしまうことも少なくありません。その筆頭とも言えるのが 非同期処理 の扱いです。コミュニティでは今でもさまざまな方向に模索が続いていますが、よく使われているものだとredux-thunk、redux-promiseあたりでしょうか。Reduxに限定しないのであればreact-side-effectというものもあります。こちらはTwitterのモバイルウェブ版で使われていますね。どれを使っても非同期処理が可能になりますが、それはあくまで道具であって、設計の

この記事の内容 オブジェクト指向と10年戦ってわかったこと Twitterやはてブコメントを見たら、「わかりやすかった」というコメントもあったのですが、どちらかというとネガティブ方面なコメントが多く目につきました。マサカリという用語で忌憚なく意見を言う風潮については別にいいんですが、「わかりにくい」「間違っている」「古い」みたいなコメントは何も生み出さないし、みんなでニコニコポエムを投稿しあうやさしいインターネッツになったらいいなって思ったので、僕もオブジェクト指向について投稿しようと思います。 何原則？ ３原則じゃなくて4では？みたいなコメントもあったのですが、別に3でも4でも5でも重要ではないかなって思います。この4原則の出どころがどこかは知らないですが、C++かSmalltalkあたり(このあたりの話を見かけたのはJava登場前だった気がする)をターゲットとしている気がします。Jav