ScalaJS for TypeScripter - Chatwork Creator's Note
こんにちは。@kyo_agoです。 だいぶScalaJSでの開発知見が溜まってきたので共有したいと思います。 d.tsから.scalaへの変換 TypeScriptを使っていると真っ先に思い浮かぶのが「型定義は？」ということだと思います。 これに関してはScalaJSでもTypeScriptと同じようにScala側のコードからJS側のコードを呼び出す際に型定義が必要になります。 基本的には TypeScript Importer for Scala.js を使うことでd.tsから.scalaのコードを出力できますが、一部の機能は変換できないためエラーになったり定義が出力されなかったりします。 （ Type Definition Importer for Scala.js でWeb上から試すことができますが、必ずしも最新版でない可能性があるので注意してください） サポート範囲に関しては sc
JavaScriptでmacOSを自動操作できるJXA - JavaScript勉強会
JavaScriptに、ちょっと便利な用途がありました！ Macには、操作を自動化できるAppleScriptという道具が用意されています。 このAppleScriptの代わりに、JavaScriptも使えるようになっていました。 JavaScript for Automation (JXA)とは？ qiita.com AppleScriptの代わりにJavaScriptを使えるようになってました。 Yosemiteからの新機能だそうです。 JXAとも呼ばれています。 そもそも、AppleScriptって何？ AppleScript - Wikipedia AppleScript（アップルスクリプト）は、アップルが開発したClassic Mac OS/macOS用のオブジェクト指向のスクリプト言語。 AppleScriptはMac OSのスクリプティング機構Open Scripting A
TravisCIで実ブラウザ環境のテストを行う方法 | チャットワーククリエーターズブログ
骨折しました。@kyo_agoです。 今日はTravisCI上で実ブラウザ環境のテストを行う方法を紹介したいと思います。 弊社ではこれまで実ブラウザ環境のテストではTravisCIからProtractorを使ってSauceLabsへ接続してテストを行っていました。 しかし、これには以下のような問題があったため、ProtractorとSauceLabsを使用しない構成へ移行しました。 テストが高頻度で失敗するテストに影響しない部分の修正ですらテストが失敗し、コードの修正よりテストを通すほうが難しい状況になっていました。 （これは社内では「e2eガチャ」と呼ばれ、レビュー依頼のコメントには「e2eガチャ 1/5」と成功率が書かれていました。ちなみに「1/5」はわりといい確率です。悪い時は「1/12」くらいになります） 遅いSauceLabsへの接続時間、WebDriver経由のテスト実行などは
ZenHub2.0について - Qiita
専用の拡張をインストールすると、GitHubそのものが拡張される。 GitHubに足りないアジャイルらしさを組み込むもの。2.0以前の機能は、ZenHubとはを参照してください。 ZenHubが2014年にリリースされてから、フェイスブックやソニー、NBC、マイクロソフトなど大手に取り上げられたZenHubは、2015/6/21にバージョン2.0となり、デザインなどが一新しました。 ZenHubのバージョン2.0とされる機能は以下のとおりです。 Task Board（カンバン）の複数リポジトリ対応 新しいZenHub Boardは、複数のリポジトリのissueを同時に表示する事ができます。 1つのプロジェクトに対して、複数のリポジトリがある場合があります。 例えば、プロジェクト開発用のリポジトリ（A）と、そのプロジェクトについてのウェブサイトを管理するリポジトリ（B）を作ったとします。新し
ユーザプレビュー用Extension Plumberを公開しました | チャットワーククリエーターズブログ
ココナッツオイルの硬度に春を感じている@kyo_agoです。 ユーザプレビュー用のChrome extensionを公開したので紹介したいと思います。 問題弊社ではリモート（シリコンバレー）に非エンジニアの決済者がおり、「新機能のレビューをどうやって行うか」が問題になっていました。 非エンジニア決裁者に向けた、技術アーキテクチャの説明 | チャットワーククリエーターズブログ これまでは以下の様な方法でレビューを行っていましたが、それぞれ問題があり解決策が求められていました。 画面を共有して説明するChatworkのLive機能で画面を共有しつつ説明する方法です。 メリット開発環境への接続方法等を考えなくていいので簡単気になる部分はその場で確認できるデメリット時間を合わせる必要がある（時差があるので時間調整が難しい）自分で操作できない（相手に音声で操作を依頼する必要がある）相手の環境でしか確
Chrome extension向けTypeScript,gulp,power-assert,karma設定
Chrome extension向けTypeScript,gulp,power-assert,karma設定 ベース設定的なものができたので紹介。 gulp or grunt今回はassertionにPowerAssertを使うため、変換時に中間ファイルを必要としないgulpを選択。 gulp-tsc or gulp-typescriptgulp-tscはだいぶ更新されてないし取り込まれてないPRもあるけど、gulp-typescriptはしばらく触ってみてファイルを結合する方法がわからなかったので断念した。 gulp-tscはコンパイル時に「Compiling TypeScript files using tsc version null」って出るのさえ気にしなければそれ以外はそんなに問題ない。 gulp-typescriptはjsとd.tsと.mapをそれぞれ別々に処理する方法を提供し
始めるPR駆動E2Eテスト生活 | チャットワーククリエーターズブログ
髭伸ばしてみました。@kyo_agoです。この記事はE2EテストAdventCalendar -3日目です。 さて、みなさま前回の記事でE2Eテスト入門できたでしょうか？ この記事は前回の状態を踏まえて説明しているため、未読の方は是非一度ご覧の上以下の内容をお試しになることをお勧めいたします。 前回の記事では以下の状態になることが目的でした。 ブラウザ上でE2Eテストが走ることPR毎にテストが走ることマージ前にテストが成功したかどうかがわかることただ、これには以下のような問題があります。 PRの内容でテストが成功するかわからない（テスト対象がインターネット上のURLになるため）この記事ではこの点に関して解決していきたいと思います。 以下の様な手順で進めます。 travis上でhttpdを立ち上げるtunnel-identifierを指定するテスト用のhtmlを設置するテストの対象を変更する
攻撃シナリオを使って解説するApplicationCacheのキャッシュポイズニング
攻撃シナリオを使って解説するApplicationCacheのキャッシュポイズニング 吾郷 協 最近ウィンナーと燻製の自作にはまっています。@kyo_agoです。 この記事は1/28に行われた、第44回HTML5とか勉強会（HTML5とセキュリティ編）で発表した内容を元に書いています。 今回はApplicationCacheのキャッシュポイズニングに関してお話したいと思います。 最初に用語について説明します。 キャッシュポイズニングとは、キャッシュに対して攻撃コードを送り込み、そのキャッシュ経由で攻撃コードを実行させる攻撃手法です。 Googleで「キャッシュポイズニングを検索」した場合、検索結果の上位はDNSのキャッシュポイズニングに関する内容がほとんどですが、最近はクライアントサイドのキャッシュポイズニングも話題に上がるようになっています。 「クライアントサイドのキャッシュポイズニング
Webの高速化によって失われるもの
このエントリはFrontrend Advent Calendar 2013 - Adventar 25日目の記事です。最近asm.jsやPNaClやSPDYやHTTP2.0が話題になっていますが、その影で個人的に気になっていることがあります。 それはHackabilityHackabilityとはこの記事に詳しく書かれていますが、簡単に言うと「外部からの手の加えやすさ」（私の理解では） 最初に挙げた技術（asm.jsやPNaClやSPDYやHTTP2.0）は「Webの高速化」という点で大きな効果が期待されています。 しかし、同時に「これまでの技術に比べてHackabilityが低い」という点も持ち合わせています。 （asm.jsは素のJSとはいえ「元コードへアクセス出来ない」という点で既存の技術に比べると低いと考えています） これらの技術が使われている場合、以下の様なことはこれまでより困難
ネットワーク通信を行う場合に検討すべきこと
特にモバイルアプリで頻繁にネットワークが切れる可能性がある場合こういった対策を考えた方がいい。 接続のタイムアウト通信を行う場合には基本的にタイムアウトの設定をする。 「どのくらいの秒数でタイムアウトするか」は難しいが、「課金や決済等の2重投稿が問題になる通信」は長く、「ページの表示等の2重投稿が問題にならない通信」は短くするのがいい。 ただし、2重投稿が問題になる通信でも、「タイムアウト後は再送信前にサーバに最初の通信が成功したかどうか確認する」のであればタイムアウトは短くても機能的な問題は少ない。 （または、サーバ側が2重送信前提で処理を行う） 自動再接続特にストリーミング等で「常時コネクションを張り続ける」系の実装を行う場合、一度通信が切断しても自動的に再接続する実装が行われることが多い。 ただ、このときにコネクションの管理が正しく行われず複数のコネクションが同時張られる状態になると
Chrome上で動くLocal Proxy "Klepto"をベースにしたフロントエンド開発フローの展望
（HTTP）Proxyとは ブラウザとサーバの通信を中継したりする 高速通信のためにデータをキャッシュしたり サーバ側でリバースプロキシとして使ったり 大学や企業で検閲に使ったり SquidやDeleGateとか有名
iOS, AndroidでSafariからアプリのインストール状態によって遷移先を変える方法
制限すべてのOSで「表示開始時にアプリがインストールされているかを判断して表示を変える」事はできない iOS6以下の方法で画面上部にバナー（Smart App Banner）を出せる 以下の形式でパラメータを渡すことも可能 【iOS6】ページ上部にアプリが開けるバナーを表示！ Smart App Bannerについて : Excite Smartphone Engineer’s Blog ただし、この方法では「要素をクリックした場合にアプリかストアへ遷移する」動作は実現できないので、クリック時の飛び先を変更したい場合は以下の方法を使う iOS5以下、AndroidアプリのカスタムSchemeを確認して遷移する （カスタムSchemeが設定されていないアプリはこの方法は使えない） 以下の方法で画面遷移前に「インストールされていればアプリ起動、それ以外はストアへ遷移」が実現できる Safari
スマホ環境でのブラウザ、WebViewデバッグ方法
Local ProxyWindowsFiddler Web Debugger - A free web debugging tool MacCharles Web Debugging Proxy • HTTP Monitor / HTTP Proxy / HTTPS & SSL Proxy / Reverse Proxy CocProxy for nginx - #生存戦略 、それは - subtech CocProxyだとSSL通信のMitMが大変かもしれない。 （Fiddler、CharlesはMitM機能を持っている） pacLocal Proxyはstreaming通信を中継できないし、SSL認証で認証局エラーを確認している環境では通信できない。 そういった環境の検証にはpacを使うと不要な通信を除外できる （local_ip_adderは検証機から接続可能なIPを記述する） fu
#3 「あまりApplication cache（cache manifest）のことを甘く見ない方がいい」 Advent Calendar 2012 - KAYAC engineers' blog
最近色々あってAndroidと心を通わせられるようになってきたago（@kyo_ago）です。 このエントリは tech.kayac.com Advent Calendar 2012 3日目の記事です。 Application cache（cache manifest）とは WHATWGやW3で議論されているHTML5 Offline Web Applicationの仕様の一部です。 細かい仕様等に関しては最後に参考URLをつけたのでそちらをご覧ください。 ここでは色々誤解の多いApplication cacheの使い方をご紹介したいと思います。 使い方 .appcacheの拡張子に対してtext/cache-manifestのMIMEタイプを設定してください。 .appcacheファイルは以下の形式で作成してください。 CACHE MANIFEST: #更新用ID（日付+連番等） キャッ
あなたの知らないECMAScript
http://events.html5j.org/conference/2012/09/ function hoge () { alert('ECMAScript valid'); } URLそのまま貼っちゃった！
ソーシャル系ボタンの表示を非同期化してブログの表示を高速にする方法 - KAYAC engineers' blog
付箋がないと本が読めなくなりました。ago（@kyo_ago）です。 先日リニューアルした弊社デザイナーブログの表示を高速化したのでその方法を紹介したいと思います。 KAYAC DESIGNER'S BLOG 元々トップページに記事が12件表示され、その記事毎にFacebook、Google Buzz、はてブ、Topsy（Twitter）を読み込んでいたのですが、その結果12件*4件=48件の外部APIアクセスが発生し表示に10秒程度かかっていました。 しかし、実際に外部APIを使用している部分は最初は表示されず、記事をクリックしてから表示されるようになるため、以下のようなJSを使用して各記事を表示する段階で外部APIアクセスを行うようにしたところ、トップページの表示が3秒程度に高速化しました。 // for topsy init=preload window.preload = func
1
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く
Next FRESH! Applications with Amazon ECS
Scala.jsやってみた #ScalaMatsuri
pacファイルを使ったLocalProxyデバッグ方法