キングダムが好きすぎて意志を受け継げる矛を作った話 - KAYAC engineers' blog
この記事は、Tech KAYAC Advent Calendar 2020 の12日目の記事になります。 みなさん、こんにちは！技術部の入江です。普段はTonamelという大会運営サービスのフロントエンドエンジニアをやっています。TypeScript最高。 昨日は @mashiikeによる Amazon Athena + Google Colab で分析環境を作る話でした。便利そう。 さて、本題に入りますが、私は戦国時代が好きです。社内のSlackのアイコンも戦国武将の肖像画を拝借しております。 戦国時代の好きなところは、「パッションの強い個人が周りを巻き込み世界を変える。」そういうところにあると思います。 そんな戦国ファンな私が2020年一番熱いなと思ったのは、漫画キングダムです。 キングダム 58 (ヤングジャンプコミックスDIGITAL) 作者:原泰久発売日: 2020/07/17メ
イケイケデザイナーになりたいので、XDを使ってVJをした - KAYAC engineers' blog
こんにちは。KAYACクライアントワーク事業部デザイナーのちゃんちーです。（最近3Dになりました） 普段はtwitterをslackっぽくするchrome拡張やインターネットの音だけで作ったビートなどを作っています。 いきなりですが、新卒一年目の僕、イケイケのデザイナーになりたいです。 「CDO」、「CXO」、「イケメンデザイナー」、「有名アートディレクター」などなど、イケイケデザイナーの像ってたくさんありますよね。 そんな僕にもなりたいイケてるデザイナー像があります...... それがこちら...... 『平日デザインして、週末にVJしてるデザイナー』になりて〜〜！！！ そうなのです。平日は普通に業務をしながらも、週末はVJをして色んな人にちやほやされる。そんな思いを一度は経験したいのです。 しかし、VJなんて一度もやったことないし、VJとはなんなのか、どうやってVJしてんのかも正直わか
動的コンテンツを画像化できるJSライブラリ "html2canvas" を使おう - KAYAC engineers' blog
こんにちは、HTMLファイ部新卒の石崎です。 今回は、Webページを画像化できるJavaScriptライブラリ、html2canvas について紹介します。 html2canvasを上手に活用することで、Webサイト側で表示ページのキャプチャを用意して処理したり、ユーザに提供したり出来るため、作れるWebサービスの幅がきっと広がります。 スクリーンショットを撮る html2canvasを使うとWebページのキャプチャを作れますが、そもそもスクリーンショットを得る方法は他にいくつもあります。 Webページの見えている部分のキャプチャをユーザが撮る Mac command + shift + 4 + space Windows Alt + PrintScreen このコマンドで、Webページのウィンドウに表示されている部分のキャプチャを撮ることができます。 スマートフォンであれば、端末の電源ボ
不健康な人間が楽して健康を手にするためのTIPS - KAYAC engineers' blog
こんにちは。技術部の小池です。 今回は不健康な人間がいかにして楽して健康を手に入れるか、というゆるゆるエントリになります。 私の健康について 先日健康診断をビクビクしながら受診したところ、視力以外はほぼ問題ないレベルの健康状態でした。悪玉コレステロール値が2016年度のF判定からB判定になり、酒飲みのカルマである尿酸値と肝機能の各項目もA判定です。 私はここ3〜4年の間で酷いときは20代半ばにも関わらず尿酸値、肝機能もC判定やD判定を喰らってました。なんとなくやばいな、と思いつつ食生活を改める、酒の量を減らすといった改善はできませんでした。酒は心の栄養とはよく言ったもので、食事量や飲酒量を制限するとストレスに襲われ逆に健康を損なってしまいます。以前禁酒を試みたことがありますが、なんとなく夜眠れなくなったり気分が沈みがちになったりと散々でした。 そんな私がいかにして楽して健康を手に入れたのか
javascriptプログラマのレベル10 : tech.kayac.com - KAYAC engineers' blog
週末料理をしていて足を切ってしまいました。agoです。 以前Perlは書いていたんですが、その頃以下の記事を読んで非常に感銘を受けました。 Perlプログラマのレベル10 - Perlプログラミング救命病棟より - naoyaのはてなダイアリー 当時あまりコミュニティとのつきあいがなかったので、「自分のスキルの絶対位置」、「次のレベルへ行くために必要なもの」を知ることで非常に安心感を感じた記憶があります。 いま確認したところ、「JavaScriptプログラマのレベル10」はないようなので書いてみました。 Perlプログラマ Schemeプログラマ Rubyプログラマ （本家に直接リンクできるURLが無かったため、参照ページへリンクしています） haskellプログラマ 堕落したCプログラマ HTML知識レベル プログラマレベル 企業法務 JavaScriptの業務スキルレベル 判別表 （５
ウェブページをできる限りネイティブアプリっぽく魅せるテクニックまとめ 〜アップルにリジェクトされつづけるなら、ウェブアプリとストアをつくって自前で配信してしまおうという企み〜 - KAYAC engineers' blog
https://kimizuka.github.io/web-app-store/example/ 北斗市公式キャラクター ずーしーほっきー ©2013 北海道北斗市 を使用させていただいております。 ウェブページをできる限りネイティブアプリっぽくみせて配信するために色々研究しました。 もくじ はじめに ウェブアプリとは 今回制作したもの ネイティブアプリとの比較 ストア以外での配信方法 ホームアイコンの設定方法 フルスクリーンでの表示方法 オフラインでのアクセス プッシュ通知（断念） カメラへのアクセス GPS / 加速度センサ / ジャイロセンサ へのアクセス ランドスケープでの固定（断念） 大技（Safariから開かれたかホーム画面からひらかれたかの判定） 小技（タップした際の黒ずみ除去 / 長押しでメニューを開かない / テキスト選択不可 / スクロール不可） その他、実装の上で頑
jQueryのCSSセレクタAPIを高速に扱う方法 - KAYAC engineers' blog
最近Androidとの抗争が激化しているago（@kyo_ago）です。 jQueryはCSSセレクタを多用する特徴がありますが、jQuery内では実行ブラウザやCSSセレクタの記述によって呼び出されるブラウザAPIが変わり、それによって実行速度にも影響が出ます。 この記事では「セレクタAPIとはなにか」、「CSSセレクタの記述によって呼び出されるセレクタAPIの種類」、「高速なセレクタAPIを使用するための方法」、「高速なセレクタAPIが使われるかどうか確認する方法」などを紹介したいと思います。 （※この記事はJavaScript Advent Calendar 2011 (フレームワークコース) : ATNDの1日目の記事です） セレクタAPIとはなにか セレクタAPIとは「#hoge .huga」のようなCSSセレクタから、DOM上に存在する要素を取得するためのAPIです。 jQue
ソーシャル系ボタンの表示を非同期化してブログの表示を高速にする方法 - 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
KAYAC engineers' blog
SREチームの藤原です。 今回は Amazon CloudFront Functions をテストするためのOSSとして、cfft というものを書いたので紹介します。 github.com 3行でまとめ CloudFront Functionsのテストは手元ではできなくて面倒です CloudFront Functionsをテストする cfft というOSSを書きました KeyValueStoreの操作を含め、便利な使い方がいろいろありますのでどうぞご利用下さい CloudFront Functionsをテストするのが面倒という問題 CloudFront Functions (以下CFF) は、AWSが提供するCDNであるAmazon CloudFrontのエッジノード上でリクエストやレスポンスの操作が行える、JavaScriptの実行環境です。典型的なユースケースとしては、キャッシュキーの
誰も興味が無いnanoの基礎の基礎 - nanoはpicoの千倍なの！ - - KAYAC engineers' blog
タイトルを見てドン引きした人とはむしろお友達になれそうな気がします。 初めまして、新人の瀬戸と言います。 ネタが無いうえに先輩社員からの前振りがあったので、自分が使用しているエディタについて語りたいと思います。 この記事を見ている人は「エディタ」と聞いて何を思い浮かべるでしょうか。 vimやemacs、サクラエディタ、TeraPad、EmEditorなどを思い浮かべるのでしょうか。 「メモ帳で十分だろ常識的に考えて…」 と言う人や、 「純正viしか認めない！」 と言う人や、 「Eclipse使ってないの？ﾌﾟｰｸｽｸｽ（笑） …え？ IDEの話はしていない？」 と言う人や、 「漢なら黙ってcatとパイプ」 と言う人も居るのかもしれませんね まあ、何にしても人それぞれ好みのエディタがあって、それを使用している事でしょう。 （環境や言語などによって使い分けるということは往々にしてあると思います
jQuery使いが陥りやすい罠 : tech.kayac.com - KAYAC engineers' blog
肩こり歴20年のagoです。 社内でもjQueryを使う人間が増えてきたので、jQueryを使う人が陥りやすい罠をいくつかあげてみたいと思います。 （私が過去にはまったり、今はまっている罠です） 1 グローバルの名前空間を使わない jQueryはwindow objectの汚染が少なくほかのライブラリとの共存が行いやすいですが、特定のサイト向けに開発する場合window objectを使用してもそれほど問題は発生しません。 しかしjQueryに慣れるとwindow objectの使用をいかに避けるかを考えるようになり、jQueryと関係ないfunctionや変数まで$.hogehogeに実装しようとしてしまいます。 これはwindow objectの代わりにjQuery objectを汚染しているだけなので、素直にwindow objectを使用したほうが普通に実装しやすいでしょう。 2
1
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く
