この記事は以下のURLに移動しました。 この記事は今後更新はないので、以下のURLから最新版を参照してください。 Register as a new user and use Qiita more conveniently You get articles that match your needsYou can efficiently read back useful informationYou can use dark themeWhat you can do with signing up

この記事はリクルートライフスタイル Advent Calendar 2015 - Qiita の17日目です。 こんにちは。現在、ホットペッパーグルメのエンジニアをやっている敷地@shikicheeです。 gitで英語のコミットメッセージどう書けばいいの？ と思ったことはありませんか？ 英語で書きたいなーって思っても、いざ書くとなると躊躇しますよね。 ネイティブはどう書いてるのでしょうか。 そこで、github上で実際に使われているコメントを解析し、 よく使われている例をまとめてみました。 解析したデータ github上で1万スター以上を獲得している169リポジトリのコミットメッセージを対象としました。 bootstrap、jquery、react、d3、docker、node、tensorflowなどの有名なプロジェクトばかりなので、良いコメントが期待できます。 解析するコミットメッセー

JavaScriptは流れが早いと言われますが、その流れをどう捉えるかの一つの要素として使える素振りの話です。 流行り廃れが早いのはちゃんと循環してるということなので問題ないですが、 トレンドと言われるものの半分ぐらいは誰かの主張にすぎない事があります。 そのため、主張だけを見て判断しないで中身を見て確認する必要があります。 自分はJSer.infoというJavaScriptの情報サイトを2^8週間ほど継続してやっています。(5周年記念イベントを1/16(土)にやります) JSer.infoで紹介するものは何かしらの方法でその主張がおかしくないかの確認をとります。 売り文句は素晴らしいが中身を見た時におかしな部分や問題がありそうなら、そこで引き返して追わないという判断もします。 仮にそこで引き返した事が間違えであっても、それが素晴らしいものなら別の誰かがそういう主張を書いてくれるはずなので

AMP とは AMP（Accelerated Mobile Pages） は、Googleが発表したモバイル高速化技術です。 4,500社以上のパブリッシャーや、WordPress.com がパートナーに参加し、2016年2月後半からGoogle検索トラフィック送信を開始すると発表しています。 検索結果に影響があるとすれば、サイト運営者はGoogle様に振り回される対応を検討する必要がありそうです。 https://www.ampproject.org/ https://github.com/ampproject 追記：Google検索、AMP対応を2月24日に開始、検索結果に表示へ。 自然検索結果へのインパクトも予想されています。 http://www.sem-r.com/news-2015/20160219092116.html

脱jQuery AngularJSやVue.jsでは、DOMの直接操作は推奨されません。 そうなると、jQueryはAJAXでしか使わなくなります。 であれば、AJAX専用のライブラリにまかせてしまって、jQuery依存を外したくなってきます。 というわけで、AJAXだけをやってくれるライブラリとして、SuperAgentを導入してみましょう。 HTTPリクエストに特化したライブラリです。 Node.jsとブラウザ両方で使うことができます。 作者はExpress, Stylusの開発などで有名なTJです。 superagentの良さ かわいい。 ブラウザでの導入方法 まず、下記URLにアクセスし、ファイル名superagent.jsとして名前をつけて保存してください。 https://wzrd.in/standalone/superagent@latest scriptタグでsuperag

弊社 dot by dot inc. のコーポレートサイトをリニューアルしたときのいろいろをメモ。見た目シンプルなわりにいろいろあったのでね どんな仕組みでつくる？ 日々増えるニュースを簡単に更新できるようなブログ形式、前バージョンの背景エフェクトもってくる（かつページ遷移においてリロードしない＝エフェクトを途切れさせない）という前提で検討した結果、WordPress を CMS に使いつつ WP REST API で JSON ひっぱってきて React でごにょごにょやるんがいーかなーと。 ちょうどどうやってつくろっかなーと考えてる時に、VirtualDom - なぜ仮想DOMという概念が俺達の魂を震えさせるのか - Qiita を読んで、どうやらこれ流行りそう今っぽいーということでフロントのフレームワークを React に決定。ちょうど IntelliJ IDEA 14 が JSX

今回はReact.jsとも関わりがあるFluxについて紹介したいと思います。 Flux is Architecture ↑の図はfacebookのfluxのリポジトリにあるものですが、Fluxは上記のようなArchitectureの名称です。facebook/fluxのrepositoryに行ってもらうとわかるのですが、実装としてはDispatcherの部分があるだけです。 Unidirectional data flow 先ほどの図を見てもらうとわかる通り、Fluxではアプリケーションの複雑さをなくすため、データの流れを一方向にします。 そのため全体の処理の流れはわかりやすくなりますが、Angular.jsなどで書くときに比べて冗長に感じることもあるかと思います。 しかしながら単純なデータの流れを作ることで、ある程度の規模になってアプリケーションが複雑化してもデータやイベントの流れがスパ

今回はReact.jsのVirtual DOM実装の中でもユーザーが意識するべき点のkeyについて書きたいと思います。 React.jsではPropにkeyという値を指定することが出来て、Componentのリストを表示するような時につけていないとdevelopment環境だとconsole.warnで Each child in an array should have a unique "key" prop. Check the render method of KeyTrap. See http://fb.me/react-warning-keys for more information. と表示されます。 このkeyはVirtualDOMのdiffから実際のDOMに反映させるときに最小限の変更にするために使われます。 例えば var KeySample = React.creat

＜この記事は「Money Forward Advent Calendar 2015」の10日目の記事です＞ エンジニアとして成長するために日々、新しいことや興味のあることを勉強している方が多いと思います。 今回は私が実践していてオススメだと思う学習方法を紹介させていただきます。 その1 Twitter ある言語や分野について学んでいくうちに自ずと、その界隈で有名な人を知るようになると思います。 それは、困った時にググると毎回出てくるブログの著者の方だったり、勉強会に参加した時に発表していた登壇者の方だったり。 そうやって知った方々を私はTwitterでフォローするようにしています。 理由として、そういった方々はアウトプットが素晴らしいため、Twitterでのツイートも有益な情報をつぶやかれていることが多いと感じているからです。 また、その方がフォローしている方やBotもとても有益な情報をも

はじめに 2015年度新卒でドワンゴに入社しました@ytanakaといいます。普段はAndroidアプリ開発を主に担当していますが、大学院時代は増井俊之先生のもとでユーザインタフェースと情報推薦システムの研究をしていました。 ドワンゴに入社後、それまでの研究を活かしプログラマ向けのニュースキュレーションサービスMenthas(メンタス)を個人開発しました。今回はせっかくの機会なので、開発の経緯と概要そして仕組みについて述べたいと思います。 追記： 続編を書きました こちらの記事は以前のバージョンの内容になります。現行のMenthasの仕組み・構成は以下にまとめています。 約3年かけてプログラマ向けニュース推薦アプリを作り直した話 背景 さて、この記事をご覧になっているのはプログラマの方が多いと思いますが皆さん普段どうやって情報収集をしていますか？ 自分の見聞きする限りではTwitterやは

一つのファイルの中にたくさん変更を行ったんだけど、コミットする単位は小分けにしたいというケースがあります。 そんな時は、git add -pすると良いようです。試してみましょう。 $ git add -p app/models/blog.rb diff --git a/app/models/blog.rb b/app/models/blog.rb index 17bb72a..88634db 100644 --- a/app/models/blog.rb +++ b/app/models/blog.rb @@ -1,7 +1,10 @@ # coding: utf-8 - require_relative 'post' +module Conversions + +end + class Blog attr_writer :post_source Stage this hunk [y,n,

https://creativesdk.adobe.com/ 今まで散々様々なSDKを使ってきましたが、正直感動しました。 こんな簡単に超リッチな画像加工ができるなんて本当にすごいです。 しかも 実装方法が超かんたん。 まずは少しみてください。 一部機能の紹介 画像のフィルター フィルターの種類も豊富で、お手軽にインスタグラムっぽい画像を作れちゃいます 画像の切り抜き 画像の方向変換 文字入力 指定した色だけ色を出したり ほら、やばい 実装方法 swiftで書きますので、objective-cの方は適時読み替えてください。 一応今回のサンプルコードもgithubにアップしておきます。 https://github.com/yamasakitomohiro/AdobeCreativeSample SDKのダウンロード 以下のリンク作からiOS SDKをダウンロードしてください。 https:

この記事はATOM-editor Advent Calendar 2015の１２月５日担当の記事です。 前置き Advent Calendarに一回参加してみたかったのでやってみましたー。 (｀･ω･´)b 今回の内容ですが、他のエディターには無い？（自分が知らないだけかもですが…）って感じの開発者心に突き刺さる、尖りまくってるAtomのパッケージを、公式ブログで紹介されていた物を中心に紹介してみたいと思います。 ※と言っておきながら、一部他のエディターで見た事ある様な物もありますが、ご理解の程よろしくお願い致します。 解説を書いていて改めて思いましたが、Atom向けパッケージの魅力は、そのGUIに有ると言っても過言では無いですね！ 独自の凝ったGUIや、見た目が綺麗なGUIは他のエディターには無いAtomの強みだなーって思います。 汎用性が高い物については下記の記事にまとめてあるので、よ

ハイライト 1.関数型プログラミングを覚えるとどうなるのか 2.関数型プログラミングをどう実践するのか 3.関数型プログラミングとオブジェクト指向の共通点と違いは？ 関数型プログラミングを覚えるとどうなるのか 次のような悩みが減り、デバッグの効率が上がります。 「このフラグ、trueになるはずがfalseになってる！」 「どこにバグの原因があるかわからねえ」 「修正したらまたどこかで問題が出るかも」 関数型プログラミングをどう実践するのか 次の2つの関数をきっちり分けて設計し、かつ、ピュアな領域を増やしてダーティな領域を小さくします。 1.ピュアな関数 同じ引数に対して常に同じ結果を返し、かつ関数の外のスコープに影響がない関数のこと 2.ダーティな関数 同じ引数でも違う結果を返す、または関数の外のスコープに影響がある関数のこと もっと具体的に教えて 下記は一例です。パッケージ分けるとファイ

JavaScript Advent Calendar 2015 5日目の記事です（大嘘）。 文章と内容についてつっこみ期待しています。よろしくお願いします。 前書き 自己紹介 派遣JSコーダです。100行未満の小さいコードを書くことが多いです。雰囲気駆動開発です。 GitHub Pages + Middlemanでブログを更新しています。 この記事で書くこと この記事では補助スクリプトの書き方について書きます。補助スクリプトは小さい自作ライブラリ（モジュール）のようなものです。 （補助スクリプトの例 / JSDoc / 補助スクリプト使用例） この記事で書かないこと JavaScriptの仕様のことは書きません。例えば、pushメソッドはこんな動きをしますよ、といったことは書きません。 解決したい課題 この記事では下のコードをわかりやすく書きたい。 何をしているのか、と同時に何がしたいのか

この雑な文章は、dots girl Advent Calendar 2015 の4日目の記事です。 今 CSS に何が起きている？ CSS のシンプルなルール CSS は Web ページの装飾・レイアウトのための言語です。プログラミング言語と比べると、CSS は非常にシンプルなルールの元に成り立っています。 プロパティと値の組み合わせで、HTML にスタイルを適用する 上から書いた順にスタイルが適用される 詳細度の高い順にスタイルが適用される たったこれだけが、CSSのルールです。いわゆるカスケーディングってやつです。 CSS は壊れやすい しかし最近、至る所で「CSS の壊れやすさ」について触れられています。 壊れやすいCSS なんでCSSすぐ死んでしまうん メンテナブルでありつづけるためのCSS設計 CSS設計の長い夢 なぜ「CSS は壊れやすい」のか？それは、CSS を書けば書くほど

JavaScriptにおける、ECMAScript6についてのまとめの前編です。またこの記事では、実践で使える情報のみまとめています。網羅的にすべてをまとめている情報ではありません。 基本構文の続き、アロー関数やPromiseはこちらの記事で。 ECMAScript6のアロー関数とPromiseまとめ - JavaScript 技術情報のみつぶやくアカウント作成しました。ECMAScript6などの最新情報も追っていきます。 Twitter: @takeharumikami RSSはこちら Feedly: Feedlyをフォロー RSS: http://qiita.com/takeharu/feed letによるブロックスコープ JavaScriptの他言語との違いで、悩めるポイントとしてスコープの範囲があります。ECMAscript6から、let命令により関数スコープではなく、ブロックス

初めまして、GoogleのAngular Teamに働いてるブライアンです。よろしくお願いします。 僕はあまり日本語が分からないけども、日本の開発者達の情熱が見えます。勉強会とか、記事とか、イベントがたくさんありますね。日本のAngularのコミュニティはすごいと思います。Angular 2を使ってくれることに楽しみにしています。 When Okuno-san asked me to write an article, I thought for a while on what I could contribute. I wanted to write about my experiences working on Angular, especially what I've learned on the path from Angular 1 to Angular 2. The power

本記事は、『JavaScriptパターン』(O'Reilly)の第七章を読んで、JavaScriptでいろいろなデザインパターンを試してみようと思い書いた記事です。なお、各記事が長くなりそうなので分割しました。 リンク一覧 【まとめ】JavaScriptでデザインパターン 【JSでデザインパターン】シングルトン編 【JSでデザインパターン】ファクトリ編 【JSでデザインパターン】イテレータ編 【JSでデザインパターン】デコレータ編 【JSでデザインパターン】ストラテジー編 【JSでデザインパターン】ファサード編 【JSでデザインパターン】プロキシ編 【JSでデザインパターン】メディエータ編 【JSでデザインパターン】オブザーバ編 各デザインパターンについて シングルトン Javaのようなオブジェクト指向プログラミング言語では、静的と動的なプロパティ、メソッドが入り組んでいるためシングルトン

おきまりのやつ CYBIRDエンジニア Advent Calendar 2015 2日目担当の @keitarou です。 イケメンスタジオという謎の組織でWEBエンジニアをしております。 最近はNode.jsを使った大規模分散アプリケーションみたいなものを作ってます。 今回のCYBIRDエンジニア Advent Calendarの仕切り役みたいなのもやっています。みんな協力してくれるいい会社だなぁと 1日目は(@gotyoooo)さんの最近のCYBIRDゲームインフラ環境についてでした。うちのインフラエンジニアは超優秀だと思います。転職希望の方はご連絡ください。 はじめに ES6, Promise, Generatorなどの登場によってJavaScriptの非同期処理の実行パターンのバリエーションが一気に増えた気がします。 今回は今現在、どういった手法が存在するのか、どういうメリット・デ