タグ

ブックマーク / techblog.kayac.com (36)

  • SREチームでポストモーテムを1年半運用してみた - KAYAC engineers' blog

    SREチームの藤原です。今回は、SREチームが主導してポストモーテムを書く取り組みを、社内で1年半ほど運用してみたという話です。 ポストモーテムとは? 「ポストモーテム」(postmortem=事後検証)とは、システムにインシデントが発生したことによる影響、緩和や解決のために取られた行動、インシデントの原因、再発防止策などをまとめた文書です。 カヤックのSREチームは、各メンバーがそれぞれのプロダクトに参加し、他のエンジニアとともに開発と運用を行う、いわゆる「Embedded SRE」という形態を取っています。そのため、SREチームのメンバーでも自分が関わっていないプロダクトで発生したインシデントについては詳しく把握できないことがありました。SRE以外で運用に携わっている、プロダクト専任のサーバーサイドエンジニアにはなおさら困難でした。 また、インシデント発生時に実際に手を動かす人がどうし

    SREチームでポストモーテムを1年半運用してみた - KAYAC engineers' blog
    hisasann
    hisasann 2022/08/08
    “「ポストモーテム」(postmortem=事後検証)とは、システムにインシデントが発生したことによる影響、緩和や解決のために取られた行動、インシデントの原因、再発防止策などをまとめた文書です。”
  • 突撃!隣のリモートワーク環境 2021 - KAYAC engineers' blog

    この記事は Tech KAYAC Advent Calendar 2021 の23日目の記事です。 技術部2年目サーバサイドエンジニアのkolukuです。 2年経っても未だにコロナ下にある昨今、去年から引き続きリモートワークを行っている会社も多いのではないでしょうか?自分自身も入社直後からリモートワークで人と接点が無く、時々他の社員はどんなふうに仕事をしているのか思いふけることがあります。 リモートワークといえば、昨年はリモートワークでこう仕事しています!という紹介記事がたくさんありました。それを思い出した自分は社内で「2年かけて熟成されたリモートワーク環境のデスクを見てみたいので、なるべくありのままの状態を見てみたい」という要望で募集したところ、なんと14名も企画に参加いただけました! エンジニアエンジニアデスクと聞くと「とにかくモニターがいっぱいに並んでいそう」「ガジェットでご

    突撃!隣のリモートワーク環境 2021 - KAYAC engineers' blog
    hisasann
    hisasann 2021/12/23
  • 2021年サーバーサイドのエンジニアが使ってよかったもの10選 - KAYAC engineers' blog

    こんにちは! Tech KAYAC Advent Calendar 2021 7日目を担当する荒賀(@ken39arg) です。 カヤックのエンジニアブログには2008年にPHPを使ったガラケー関連の記事を書いたのが最初になります。 それから10年以上たち、ガラケーも弊社でのPHPプロジェクトもほぼなくなり、メンバーもかなり入れ替わり、私自身も20代だったのがついに40歳になりました。そんな私にとってこのアドベントカレンダーは私は今でもここにいるよというPingのような役割になっているため、年に一度若者に混じってアドベントカレンダーに参加しております。 例年ですと、趣味のマラソンなどに関する実績も書いているのですが、昨年同様、今年も続くコロナ禍により多くの大会が中止となったためこちらに関しては特に特記すべき実績はありません。ただ2020年に走るはずだった東京マラソンは権利は移行を続けてお

    2021年サーバーサイドのエンジニアが使ってよかったもの10選 - KAYAC engineers' blog
    hisasann
    hisasann 2021/12/08
  • C#に潜むstructの罠 - KAYAC engineers' blog

    こんにちは。技術部平山です。 この記事ではC#のstructを使った際にはまった罠について書きます。 Unityでの体験を軸にお話しますが、Unityに限ったことではないかと思います。 お急ぎの方のために結論を申しあげますと、structを使うなとなります。 どうしてもstructを使いたい気分になった時に、罠にはまって時間を無駄にする覚悟をした上で使いましょう。 未来に活きる良い失敗ができると思いますし、最終的には製品の性能も上がるとは思いますが、 structを使わないといけない理由は、たぶんありません。なくても製品は作れます。 しかし、一回もstructと書かなかったとしても、C#で書く限りstructからは逃れられないのです。 (2019/04/10) 末尾に話を単純化しすぎた点について補足をいたしました。 structとは C#の型にはclassとstructがあります。 ...

    C#に潜むstructの罠 - KAYAC engineers' blog
    hisasann
    hisasann 2019/04/10
  • 【お詫びと訂正】iOS11でついにSafariからカメラにアクセスできるようになりました。(コピペで動くサンプルコード付き) - KAYAC engineers' blog

    お詫びと訂正:(2017/06/08 23:32) 記事内に掲載しているスクリーンショットが、 Apple.Incの開発者利用規約(APPLE BETA SOFTWARE PROGRAM AGREEMENT APPLE INC.)に抵触しているというご指摘をいただきました。 Apple.Incの開発者利用規約から、掲載内容を不適切と判断し、該当箇所を削除させていただきました。 Apple.Inc及び読者の皆様に深くお詫び申し上げます。 追記:(2019/02/17) Navigator.getUserMediaが非推奨となったため、MediaDevices.getUserMediaを使うように修正しました。 Navigator.getUserMedia - Web API | MDN MediaDevices.getUserMedia() - Web API | MDN ざっくり1行でま

    【お詫びと訂正】iOS11でついにSafariからカメラにアクセスできるようになりました。(コピペで動くサンプルコード付き) - KAYAC engineers' blog
    hisasann
    hisasann 2017/06/09
    video、 canvas、 getUserMedia
  • ぼっちiOS開発者がParse(Parse.com)使った結果wwwwwwwww tech.kayac.com Advent Calendar 2013 - KAYAC engineers' blog

    このエントリーはtech.kayac.com Advent Calendar 2013の7日目のエントリーです。 いきなり釣りっぽいタイトルで申し訳ありません。 LobiチームでiOSエンジニアをしております@_somtdです。 今回急遽、@soh335さんのバーターとしてAdvent Calendar 2013にて寄稿させていただいております。 大変光栄な機会をいただきありがとうございます! 普段はカヤック社内でも屈指の大人数チームで開発をやっているのですが週末はぼっちでiPhoneアプリなどを開発しております。 今回は、ぼっちiOS開発者の強い味方!Parseについて書こうと思います。 Parseって何? ここで改めて説明をするよりも、ものすごく簡潔にまとまっているスライドがありましたのでシェアさせていただきます。 5分でわかったつもりになるParse.com from Kenta T

    ぼっちiOS開発者がParse(Parse.com)使った結果wwwwwwwww tech.kayac.com Advent Calendar 2013 - KAYAC engineers' blog
  • #8 「iOSのバージョン間の溝を埋めるテクニック」 tech.kayac.com Advent Calendar 2012 - KAYAC engineers' blog

    こんにちは、iOSプログラマーの_ishkawaです。 このエントリは tech.kayac.com Advent Calendar 2012 8日目の記事です。 テーマは「私の中のマイイノベーション 2012」です。 12月。恋人たちが心の溝を埋めていく中、僕はiOSバージョンの溝を埋めております。 今日はそのテクニックを紹介したいと思います。 それと、紹介するテクニックを使ったマイイノベーションも紹介します。 基中の基 iOSでは、バージョンによってクラス/メソッドの有無やプロトコルへの適合状況が異なります。 これらの状況の違いは以下の方法で判別することができます。 メソッドが存在するかどうか: respondsToSelector: クラスが存在するかどうか: [Class class] プロトコルに適合しているか: conformsToProtocol: これらの条件を以下のよ

    #8 「iOSのバージョン間の溝を埋めるテクニック」 tech.kayac.com Advent Calendar 2012 - KAYAC engineers' blog
  • #2「JavaScriptでおっぱいを動かす」 tech.kayac.com Advent Calendar 2012 - KAYAC engineers' blog

    カップル爆発しろ どうも。「何かよく知らないけど訳分かんない人だと思ってた」と社内で最近言われたHTMLファイ部のdamele0nです。 このエントリはtech.kayac.com Advent Calendar 2012 2日目の記事です。 テーマは「私の中のマイイノベーション 2012」 季節のせいか周囲ではカップルが続々と誕生して次々とイノベーションを起こすなか、僕はといえば相変わらず人生にしかれた非モテのレールを光のスピードで突き進んでいます。 僕だって、2人でイノベーションを起こしたい…。 僕だって、冬のせいにしたい…。 僕だって、クリスマスに七面鳥抱えながら海岸沿いを2人でキャッキャウフフしたい…。 僕だって、ちちくりたい…。 僕だって、僕だって、僕だって…。 安心してください。 僕は、なんですか? あなたは、なんですか? そう、エンジニアです。 無いものは作ればいい。世界なん

    #2「JavaScriptでおっぱいを動かす」 tech.kayac.com Advent Calendar 2012 - KAYAC engineers' blog
  • instagramAPI公開!OAuth触りました - KAYAC engineers' blog

    ついに21歳になりました!itaniです。 みなさん!! つい先日、iPhoneで気軽に写真を共有できるサービス「instagram」のAPIが一般公開されましたね。 というわけで、さっそくOAuthを触ってみたので自分なりにまとめてみました。 なにができるの? instagramAPIを使えば以下のようなことが簡単にできます。 ユーザー情報を取得 ユーザーの写真を取得 写真に対してコメントやいいねを投稿する フォローしている人、フォローされている人を取得 上で挙げたものはほんの一例です。 まだ調査不足ですが、リアルタイム系のAPIも用意されています。面白そうですよね。 OAuthってなんだ!? 最近twitterやfacebookでよく聞く『OAuth認証』という言葉。 果たしてこれはなんなのか。お願いしますgoogle先生。 OAuth (オー オース) は、ブレイン・クックとクリス・

    instagramAPI公開!OAuth触りました - KAYAC engineers' blog
  • KAYAC engineers' blog

    こんにちは! カヤック面白プロデュース事業部のおばらです。 普段は受託案件のデザイン・フロントエンド開発などを担当しています。 さて、『JS体操』第2問 いかがでしたか? 今回初めての方々 第1問に引き続きの方々 複数のアプローチで何通りも回答してくださった方々 普段業務で JavaScript をバリバリ書いているであろう方々 JavaScript を学んでいる学生の方々 などたくさんの方々が挑戦してくださいました。 とても嬉しいです。ありがとうございます! 『JS体操』とは? 『JS体操』とはカヤックが主催する JavaScript のコードゴルフ大会です。 もともとは社内の勉強会として始めた施策です。 その詳細は以下のブログ記事を御覧ください! techblog.kayac.com 第2問の詳細はこちら https://hubspot.kayac.com/js-taiso-002 も

    KAYAC engineers' blog
  • Google Mapのデザインを変更する方法(StyledMapの使い方) - KAYAC engineers' blog

    豚を丸焼きにするイベントで日焼けしました。ago(@kyo_ago)です。 すでにだいぶ時間がたってますが、7/7に弊社コーポレートサイトのリニューアルを行いました。 その際会社までの道順を紹介するページでGoogle Mapのデザインを変更したのでその方法をご紹介したいと思います。 StyledMapType Google Map Ver3以降はStyledMapTypeというAPIが追加されており、このStyledMapTypeを使うことで地図上の指定された要素に対して独自の色情報を設定することができます。 色の変更方法 色を変更するにはStyledMapType API経由で以下のようにJavaScriptのObjectを渡すことで実現できます。 var styles = [ { // 色を変更する対象の指定(document参照) featureType: "road.local"

    Google Mapのデザインを変更する方法(StyledMapの使い方) - KAYAC engineers' blog
    hisasann
    hisasann 2011/08/01
    スタイル変えられるんだー
  • SVG Girlの公開と内部実装 - KAYAC engineers' blog

    乗り換え以外で初めてアメリカ行きました。ago(@kyo_ago)です。 すでに先週のこととなってしまいましたが、jsdo.it上でSVG Girlというコンテンツを発表したのでご紹介させていただきます。 (現在IE9のリリースに合わせて英語版のみ公開しています。日語版は26日の日語版IE9リリースにあわせて公開を予定しています) SVG Girlって? SVG GirlはSVGを使ったアニメーション作品で、動画コンテンツの中身をすべてSVGのみで表現しています。 先週開催されたMicrosoft主催のMIX11のキーノートでも発表され(00:08:40ぐらいからご覧いただけます)、大画面に表示されたアニメーションで会場をわかせました。 SVGって? SVGはテキストで表現されたベクターデータで、XMLで線画情報を保持しています。 ブラウザ上からは通常のDOM API経由で操作すること

    SVG Girlの公開と内部実装 - KAYAC engineers' blog
    hisasann
    hisasann 2011/04/19
    苦労されてますなー。かっこいい!
  • 今日から始めるCoffeeScript - KAYAC engineers' blog

    こんにちは。毎年花粉症になりかけている飯塚です。 最近のNode.jsの普及などによってサーバサイドJavaScript界隈が盛り上がっています。 そんなホットなJavaScriptをラクにかつエレガントに書くためのCoffeeScriptという言語をチュートリアル風に紹介します。 何かしらのライブラリを自分で書く程度にJavaScriptで開発している人は絶対に使ったほうがいいと思います。 JavaScriptを知っていれば1-2時間程度で十分駆使できるようになります。 (2011/6/28:@m_satyr様にご指摘頂いた箇所を修正しました。) 目次 CoffeeScriptとは? インストール Hello World 構文 関数 変数展開 Objectの生成 ループ 存在チェック ヒアドキュメント thisのバインド クラス 無名関数 {var} Tips ?の使い分け 存在チェック

    今日から始めるCoffeeScript - KAYAC engineers' blog
  • node.jsはじめました - KAYAC engineers' blog

    はじめまして! 技術部2年目のsugyanと申します。 初めてtech.kayac.comに投稿します! 先日自分のブログで書いた記事が思いのほか好評だったので、これについてもう少し詳しく書いてみようと思います。 node.js+socket.ioを使ったライブコーディングwebアプリを作ってる - すぎゃーんメモ node.jsについて 最近話題の、サーバーサイドJavaScript「node.js」。みなさん触ってみてますか? 「Google V8 JavaScript Engineによるイベント駆動の…」と、どんなものかは知っているものの実際には触っていない、という人がまだ多いような気がします。 僕も昨年の12月くらいにようやく触ってみた という程度なのですが、意外にお手軽で簡単に使えるし面白いので、 「JavaScriptはまだニガテで ><」というヒトでも安心して始められるのでは

  • jQuery.stopのjumpToEnd引数が便利すぎてやばい(JavaScript Advent Calendar 2010 5日目) - KAYAC engineers' blog

    JavaScript Advent Calendar 20105日目のago(@kyo_ago)です。 jQueryのソースを眺めててjQuery.stopに引数があることに気づいたので調べてみました。 まず、簡単なスライドダウンメニューを作ってみたいと思います。 jQuery.stop 1 - jsdo.it - share JavaScript, HTML5 and CSS JS部分は以下の通りです。 $(function () { $('div').hover(function () { $(this).find('ul').slideDown(); }, function () { $(this).find('ul').slideUp(); }); }); 少し触ると分かると思いますが、マウスがmenuから外れた後も何度も.slideDown、.slideUpが実行されるため非常に

    jQuery.stopのjumpToEnd引数が便利すぎてやばい(JavaScript Advent Calendar 2010 5日目) - KAYAC engineers' blog
    hisasann
    hisasann 2010/12/06
    animateメソッドを使えば、stop時の高さ問題は回避できるのかな?。。。
  • DOM Ready前にイベントを設定する方法(jQuery.liveの紹介) - KAYAC engineers' blog

    健康診断で身長伸びてました。agoです。 今開発中のサイトで$().liveを中心にした実装を行っているので簡単にまとめてみました。 $().liveって? jQuery 1.3系からサポートされた、イベントハンドラの設定用methodです。 $().bindとどこが違うの? $().bindは指定されたhtml elementsに対して直接ブラウザの機能を使ってイベントを設定しますが、$(selector).liveは一旦document objectでイベントをキャッチした後、jQueryが発生元の要素とselectorをつきあわせて一致した場合イベントハンドラを呼び出します。 何がいいの? 以下のような利点があります。 DOM Readyを待たずにイベントを設定できる。 通常jQueryでは$(function () {});(DOM Ready)内で初期化を行いますが、htmlの量

    DOM Ready前にイベントを設定する方法(jQuery.liveの紹介) - KAYAC engineers' blog
    hisasann
    hisasann 2010/06/16
    FireQuery入れてたけど全然使ってなかった
  • IEでswfを複数読み込んでいる場合の$('object:first').find('param')が正常に動作しない件に関して - KAYAC engineers' blog

    名字を検索するとサジェストに「読み方」が表示されます。agoです。 mist.jsでIEがswfを複数読み込んでいる場合に$('object').find('param').lengthが$('object:first').find('param').lengthと同じ値になる問題がありその内容に関して調査してみました。 症状 以下のようなtagを読み込んでいるとき、IEで$('object:first').find('param').lengthすると4が返ります。 (IE以外の場合、2が返る) サンプル <object data="http://wonderfl.net/swf/index.swf" width="100" height="100" type="application/x-shockwave-flash"> <param name="movie" value="http

    IEでswfを複数読み込んでいる場合の$('object:first').find('param')が正常に動作しない件に関して - KAYAC engineers' blog
    hisasann
    hisasann 2010/06/03
    「objectに対してgetElementsByTagNameを行うと、document.getElementsByTagNameと同じ結果を返しているのが原因」
  • そこそこ規模が大きくても何とかなるjavascriptの設計(URL dispatcherの薦め) | tech.kayac.com - KAYAC engineers' blog

    弁当生活始めました。agoです。 以前のjavascriptの開発はサーバサイドと同じPGが開発することが多く、機能をファイル単位で分割してそのページで必要なファイルのみを読み込むと言うことが行われていました。 ただ、最近はサーバサイドとクライアントサイドの分業が進んだことや表示速度の兼ね合いもあり、単一ファイルに全体を記述しサーバサイドでは全ページでその一ファイルのみを読み込むような形になることが多いです。 単一ファイルの利点としてはサーバサイドの実装に依存せずに任意の機能を追加できることがありますが、欠点として機能毎の切り分けが難しくなると言う点があります。 jQueryを使用して$('.selector')で切り出す方法もありますが、マークアップの全体像を正確に把握できていないと不要なページで間違って実行されてしまう危険性もあります。 そこで、以下のようなJSを先に読み込み、各URL

    そこそこ規模が大きくても何とかなるjavascriptの設計(URL dispatcherの薦め) | tech.kayac.com - KAYAC engineers' blog
    hisasann
    hisasann 2010/06/01
    1つのJSファイルを全体で使用して、URLごとにロードする処理を分割する
  • canvasをバイト単位で修正する方法(ImageDataの使い方) - KAYAC engineers' blog

    引っ越ししました。agoです。 思いっきりネタがかぶってますが、あまり気にせずcanvasネタを書いてみたいと思います。 今回はcanvasの中でもImageData関係をまとめて見ました。 ImageDataってなに? canvas内のバイト列を扱うためのObjectです。 canvas内の各バイト毎に赤、緑、青、透明度の情報を配列として保持しています。 何に使うの? canvas内をバイト単位で修正したい場合に使います。 canvas内に図形等を書く場合、通常提供されているlineTo等を使用することも出来ますが、こういった抽象メソッドは一回ごとの呼び出しコストが大きいため、細かい単位の操作には向きません。 その点、ImageDataであればバイト単位での操作しかできない代わりに呼び出し毎のコストが小さいため、細かい単位の操作も高速に行うことができます。 ただ、もちろん線を引く、丸を書

    canvasをバイト単位で修正する方法(ImageDataの使い方) - KAYAC engineers' blog
  • canvasでキラキラした背景を作る方法 - KAYAC engineers' blog

    tech.kayac.com、ささやかにリニューアルしました! tech.kayac.comをご覧の皆さん、はじめまして。意匠部ME課のfuchigamiといいます。 どうして技術部ブログに意匠部の野郎が?って感じですが、 技術部ブログのリニューアル記念ということで、ちゃっかりcanvasについて記事を書こうと思います。 最初なので、、、 簡単にぼくの属性を説明すると、html5とか好き、CSS3とか好き、canvasとか興味ある、非モテjavascriptはjQueryがなんとなくわかる程度、非リア充。こんな感じです。 今回のリニューアルではコーディング全般を担当しました。 特に、プログラミングに関してはド素人だ!ということを強調しておきます。 そんなぼくが、canvasを使ってキラキラした背景を作ってみました 「リニューアルするからには新しいことがやりたいよね。だったらhtml5とc

    canvasでキラキラした背景を作る方法 - KAYAC engineers' blog
    hisasann
    hisasann 2010/05/14
    globalCompositeOperation = "lighter"