Ajaxを劇的に簡単にするReact.js

Posted filed under Javascript, React.

ogp

 ここ数年、Javascript界隈でフレームワーク戦争が勃発してきました。クライアント開発の規模も年々大きくなり、jQueryだけでは複雑な画面遷移などを管理しきれなくなってきたのが原因だと思います。  私も昨年までAngularとbackboneを試しましたが、サーバサイドをMVCにしているのに、クライアントでもMVCを作るMVCの2階建ては、やり過ぎなのではないかと思っていました。フレームワークそのもの覚えるまでにも一苦労というのも面倒に感じました。 2014年、海外でブームに火が付いたReact.js  そんな中、2014年の後半からFacebook発のReact.jsの採用事例が聞こえてくるようになりました。AirBnBや米Yahoo! Mailなど大手がReact.jsを積極的に採用し出したので気になり、年末年始を使って色々調べてみることにしました。 Rails以来の衝撃  色々試していくうちにReact.jsは劇的にラクな事に気がつきました。そして既存のJSフレームワークより遙かに分かりやすい。初めてRailsを見たときと同じぐらいの衝撃がありました。  React.jsを一言でいうと「プログラムをAjax以前の構造に戻す」ことにあると思います。今までのフレームワークなどとパラダイムが大きく違うためちょっと理解するのに時間がかかりました。

チャットで勤怠管理する「みやもとさん」をリリースしました

Posted filed under Javascript, Toreta.

 トレタで使っている、チャットで勤怠管理する「みやもとさん」をオープンソースでリリースしました。 https://github.com/masuidrive/miyamoto  Slackの#timesheetsという部屋で、「おはようございます」と書き込みと出勤が記録され、「お疲れまでした」と書き込むことで退勤となります。「明日はお休みさせて頂きます」と書き込むと、休暇の届け出になります。  チャットで勤怠管理する最大のメリットは、オフィスに居なくても誰がいつ出勤・退勤したのか全員が分かることにあります。出退勤管理アプリは色々出ていますが、営業で直行直帰する人や、リモートワーカーなどは、帰った時間がリアルタイムでわかりにくいという欠点があります。  「みやもとさん」では、チャットでやりとりする事でみんなの見える形で出退勤が記録され「あ、帰る前にあれも!」など、ありがちなコミュニケーションがスムーズに行えるようになります。  出退勤のあいさつの判定はかなり幅を持たせているので、みんなが色々なあいさつを試して遊んでいますし、みやもとさんの返事のメッセージも色々変な答えをするようにして、人間味を出すようにしています。  このスクリプトは、Google Apps Script(Javascript)で動いていますので、一人だけGoogleアカウントを持っていれば、サーバを借りることなく無料で運用できます。  設置方法などは、https://github.com/masuidrive/miyamoto を参照してください。現在はSlack用ですが、アダプタを書くことで他のチャットにも多分対応できます。  トレタのチャットの活用法については、弊社中村の記事も合わせてご覧下さい。 なぜチャットで勤怠管理なのか  トレタでは、情報ハブ的なツールとして全社でSlackを導入しています。  もともと、別のチャットを使っていたのですが、スマホ版を含めたUIと、さまざまなツールとの連携が容易に行えるということで、夏に移行しました。最大の問題は英語のUIですが、思ったより抵抗感なく移行することができました。  Slackへ移行後は、辛口の人工無能「高橋」を作り、走らせて遊んでいました。  これはこれで社内で大ウケだったのですが、無意味なbotではなくトレタらしいChatOpsを作りたいなと思っていました。  社内システムには多くの課題があるのですが、その一つに勤怠管理がありました。営業の人が直行直帰したり、エンジニアが在宅業務するので、リモートで管理できる必要があります。 いくつかのiOSアプリなどを試したのですが、出勤退勤を押し忘れたり、修正には上司のアカウントが必要だったりと手間がかかり、なかなか定着しませんでした。  どこに居ても全社員必ずチャットは毎日使うため、チャットで「おはようございます」と書き込むと出勤扱いにすれば良いのではないかと思い、hubotで早速作り始めました。  とりあえず、動くモノはすぐできたのですが、日数の集計などを考えると管理側を作るのが、かなり面倒です。  そこで、データはGoogle Spreadsheetに書き出す様にしてみました。そうしているうちに、Google Apps ScriptでWebサーバを書き、SlackのWebhooksで通信すれば別途サーバを用意する必要がないことに気がつき、Google Apps Scriptで書き直しました。  これで9月から社内で勤怠管理として1ヶ月ぐらいつかっていますが、右の様に社内でも評判のツールとなっています。返答は顔文字を使ってユルい感じで返すようにすることで、みんな親しみを持ってくれています。  現在はSlack用として動いていますが、API部分は分離してあるので、他のチャットでもWebhooks的なモノがあれば、簡単に移植することができます。もし他のチャットに移植してくれる人がいたら非常にうれしいです。  今後の開発としては、月次の出勤日数や有給の管理、休み時間の登録などを予定しています。コレがないと社内的に困るので。 トレタ社内ツール  トレタでは、「みやもとさん」以外にも、日々の統計処理などでGoogle Apps Scriptを利用しています。社内で使うツールはGoogle Apps ScriptとSpreadsheetの組み合わせがかなり便利です。各種データはBigQueryに入れており、統計情報はここから取り出す事で、管理画面を作り込むことなく柔軟にデータをみることができるようになっています。  このようなツール以外にも、社内の文化をシステム方面からも構築していくため、日報システムを始め、色々なツールを内製しています。  こんな環境で、アプリを作ってみたい方をトレタでは探しています。興味のある方は、まずはランチでも食べにきてみませんか? → ランチ申し込み  トレタはITと少し離れた分野にITを届けて、働いている人にもお客さんにも幸せになってもらうシステムを作っています。そのためには社内のシステムも気持ちよく使えるモノをと考えています。  この「みやもとさん」が多くの場所で使ってもらえ、すこしでも便利だなと思って頂けたら幸いです。

iOSの標準Mailアプリにツールバーを追加しているLinkedIn Introはどうやって実現しているのか

Posted filed under iPhone, Javascript.

 LinkedInが本日、iOSの標準MailアプリでLinkedInのプロフィールを見ることのできる「LinkedIn Intro」というサービスをリリースしました。  このサービスを導入すると、メールの中で送信者の情報をインラインで見ることができます。  iOSにはメールアプリが沢山ありますが、このサービスの特徴は既存のアプリにLinkedInの機能を追加しているところが特徴的です。  通常、iOSでは「機能拡張」みたいな物を作る事はできないのですが、これはどうやって実現しているのでしょうか?  LinkedIn社のブログ「LinkedIn Intro: Doing the Impossible on iOS」でどのように実現しているのか、解説しています。  仕組みとしては、IMAPプロキシを作り、メールの本文にツールバーのHTMLを差し込んでいるそうです。

Appceleratorを退職しました

Posted filed under Life, TitaniumMobile.

 2012/09/30を持ちまして、Appcelerator, Inc.(以下Appc)を退職しました。2010/12に入社して以来、Titanium Mobile(以下Ti)のエバンジェリストとして活動し、多くの方々にお世話になりました。この場を借りてお礼申し上げます。

【Titanium Advent Calendar 2011:五日目】Titanium Mobileでソケット通信

Posted filed under TitaniumMobile.

 この記事は、@astronaughtsさんの「Titanium Advent Calendar 2011」企画で書いています。  2011年もTitnium Mobileを使って頂きありがとうございました!まだ使ってない方は、この年末のお休みにでも、ぜひ試してみてください。来年は、日本法人設立など前半から大きな動きがあると思いますので、来年も引き続きよろしくお願いします。  さて、本題ですが、ソケット通信の話になります。Titanium Mobile(以下Ti)では1.7からTCP通信の機能が充実しました。  いままでTiの通信と言えばHTTPでしたが、これからはTCPソケットを使って、色々なサービスと通信することができるようになりました。  ソケットと同時に、Tiでバイナリを扱うための、T.BufferとTi.Codecをサポートされ、ちょっと面倒ですがHTTP以外のプロトコルもバリバリ実装することができます。

バグフィックスをしたTitanium Mobile 1.5.1をリリースしました。

Posted filed under TitaniumMobile.

 今週、月曜日にリリースされたTitanium Mobile SDK 1.5へ、多くの人に興味を持って頂くことができました。また多くのフィードバックをいただきました。ありがとうございます。  頂いたフィードバックのうち、4つの重大な問題を修正した、Titanium Mobile SDK 1.5.1をリリースしました。 原文: Titanium Mobile 1.5.1 is released. « Appcelerator Developer Center

Titanium Mobile 1.5.0がリリースされました

Posted filed under TitaniumMobile.

Titanium Mobile 1.5.0 正式版がリリースされました! Androidのサポートが特に進化しています。新しい機能の追加やパフォーマンス、品質の改善も行われています。 先週、私たちは2つのRC(リリース候補)をリリースし、いくつかの問題を発見しました。それらを修正しTitanium Mobile 1.5.0をリリースしました。 12/10にリリースした、1.5.0 RC2から下記のiOSの2つの問題が修正されています。

【就職先決定】Titanium MobileのAppceleratorに勤めることになりました

Posted filed under Life, TitaniumMobile.

 先日のブログで求職をした所、多数の企業からお声がけを頂き、ありがとうございました。  あの記事を書いた後、10/28にシアトルを離れ、サンフランシスコに寄り道をし、11/1に日本に帰国しました。  はじめは日本で就職を考えていたのですが、サンフランシスコに寄った際、Titanium Mobile(タイタニウム モバイル)を作っているAppcelerator Incへ遊びに行き、join(就職)することを前提に話を進めることになりました。  帰国後、条件などをメールで詰めた後、12/1より正式にAppceleratorで働く事になりました。

nodejs本体をdebugする方法

Posted filed under nodejs.

 nodejsでsegmentation faultが出た場合は、下記のようにdebug付きnodeをコンパイルして、gdbで実行。 (extract source code) ./configure –debug && make gdb –args ./node_g myscript.js run (make it crash) backtrace via Segmentation Fault, how to debug? – nodejs | Google Groups.

Google V8ってruntimeのドキュメントないのか

Posted filed under Javascript.

 Google V8ってruntimeの仕様とかドキュメントないのかー。orz  ECMAScript 3rd editionベースなんだけど、5th editionの機能もちょこちょこ入っていて、どれをサポートしているかソースを読まないとわからないんだよなぁ。  どっかまとまってるところ知りませんか?>誰か