【JS体操】第2問「画像の横長具合を比較しよう」〜正攻法＆ハック部門の解説〜 - KAYAC engineers' blog
こんにちは！ カヤック面白プロデュース事業部のおばらです。 普段は受託案件のデザイン・フロントエンド開発などを担当しています。 さて、『JS体操』第2問 いかがでしたか？ 今回初めての方々 第1問に引き続きの方々 複数のアプローチで何通りも回答してくださった方々 普段業務で JavaScript をバリバリ書いているであろう方々 JavaScript を学んでいる学生の方々 などたくさんの方々が挑戦してくださいました。 とても嬉しいです。ありがとうございます！ 『JS体操』とは？ 『JS体操』とはカヤックが主催する JavaScript のコードゴルフ大会です。 もともとは社内の勉強会として始めた施策です。 その詳細は以下のブログ記事を御覧ください！ techblog.kayac.com 第2問の詳細はこちら https://hubspot.kayac.com/js-taiso-002 も
「JS体操」のすゝめ 〜その①〜 - KAYAC engineers' blog
このエントリは【カヤック】面白法人グループ Advent Calendar 2023 の24日目の記事です。 こんにちは！意匠部のおばらです。 面白法人カヤックでは日々、様々な社内勉強会が開催されています。本記事では JS 好きな社内のエンジニア向けに私が企画＆主催している「JS体操」についてご紹介します。 記事の最後にはみなさんも挑戦できるように最新の「JS体操」を紹介しています。ぜひ挑戦してみてください。 1.「JS体操」とは？ 2.「JS体操」の掟 3.「JS体操」のメニュー 3.1. 何らかのロジックを解く 3.2. コードゴルフで文字数を競う 4.「JS体操」の流れ 4.1. 出題方法 4.2. 解答方法 4.3. 実際の様子 5.「JS体操」の過去問の紹介 5.1. 第一回 5.2. 第二回 5.3. 第三回 5.4. 第八回 5.5. 第十一回 5.6. 第十四回 5.7.
blenderを使って「自分の埴輪」を作る：藤井寺市 オリジナル3D埴輪メーカーの事例 - KAYAC engineers' blog
こんにちは、OP事業部で主にUnityエンジニアをしている原です。 この記事はTech KAYAC Advent Calendar 2023の12日目の記事です。 Unityを触る傍ら、blenderもいくらか勉強を進めていて、その結果昨年から今年にかけてblenderを使った「オリジナル3D埴輪メーカー」という案件に携わりました。 www.kayac.com この案件では、利用者の顔を3Dスキャンし、そのデータをかわいい埴輪の3Dモデルと合体させて3Dプリントすることで、「自分の顔の造形をしている埴輪」という架空の遺物を生み出すことに成功しました。 本記事では、どのようにしてオリジナル埴輪を作り出したのか、その技術背景について解説いたします。 目次 そもそもオリジナル3D埴輪メーカーとは iPhoneアプリ「Heges」で顔をスキャンする スキャンデータどう扱うか問題 スキャンモデルのク
俺の管理画面 2023年冬 - KAYAC engineers' blog
面白法人カヤック技術部の谷脇です。私は元気です。 この記事は面白法人グループ Advent Calendar 2023の5日目のエントリーです。 というわけでこの記事では、現環境(私が取り組んでいる業務のこと)ベストの管理画面の技術選択について考えたことを書き連ねていきます。 前提知識 管理画面の定義 ここで読者と私の目線を合わせるため、この記事上での管理画面の定義をしておきます。 管理画面はサービスの運営上必要な操作やデータの閲覧をまとめたWebアプリケーションです。また、このWebアプリケーションは一般ユーザーには開放されておらず、サービス運営者側のみ閲覧と操作が可能となっている、とします。 管理画面を作る動機 ここではTonamelの管理画面について、考えて導入したことを書きます。 tonamel.com Tonamelはゲーム大会やイベントを開催するためのプラットフォームです。We
【Next.js】SWRとaspidaでフロントエンドのデータ取得部分を改善した話 - KAYAC engineers' blog
こんにちは、ちいき資本主義事業部でフロントエンドエンジニアをしている片岡です。 この記事ではカヤックが開発している「まちのコイン」の管理ダッシュボードで、APIサーバからのデータ取得部分の改善したことについて紹介します。 まちのコインについては、以下のURLをご覧ください。 coin.machino.co 管理ダッシュボードについて dev環境のダッシュボードのスクリーンショット画像 管理ダッシュボードは、まちのコインが導入されている地域の運営団体の方が主に利用します。ダッシュボードには、統計情報の確認やお知らせの配信、まちのコインの体験を作成できる機能があります。 管理ダッシュボード開発の課題 ダッシュボードは、Next.js(React)で開発をしていて状態管理ライブラリはRecoilを採用しています。 ReactコンポーネントでAPIを叩いてデータ取得をする場合は、React Hoo
完璧な結婚の挨拶をするために本気で準備をしていたら、いつの間にかマネキンにプロジェクションして仮お義父さんを作っていた話 - KAYAC engineers' blog
こんにちは。カヤックOP事業部デザイナーのちゃんちーです。 ※右です 突然ですが皆さん、人生、やっていますか？ かれこれ社会人5年目になり、 Instagramを開けば結婚、出産、子育て...、 Twitterを開けばご報告、ご報告、ご報告...、 これらを見るたびに、「みんな人生やってるなぁ.......」と思うわけです。 ……さて、そんな人生やっていきを感じる27歳の僕も、 ついに先日付き合っていた彼女と婚約し、 結婚までもうすぐというところまで人生をやっていきしている最中でございます。 ......しかし、そんな中で一つ心配なことがあります.....。 それがこちら…… 親への挨拶が怖い！！！ ……そう、婚約をし、結婚をするには、親へ挨拶をしなければならないのです。 が、人見知りかつ、緊張しいな自分が、 無事に許しをもらうことができるのかどうかが不安で不安でたまりません。 怖くて怖く
秘密情報には出どころも書いてくれ！頼む！ - KAYAC engineers' blog
SREチームの長田です。 KAYAC Advent Calendar 2022の11日目の記事です。 アプリケーションから何かしらの外部サービスを利用するとき、そのサービスを利用するためのAPI Keyなり秘密鍵なりの秘密情報を保持することになります。 暗号化したものをファイルとしてアプリケーションに持たせたり、 Amazon Web Services(AWS)ならAWS Secrets Managerや AWS Systems ManagerのParameter Store(SSM Paramater Store)に保存したものを実行時に読み込んだりするでしょう。 これらの秘密情報、どこから来たのかわかりますか？ どこから来た秘密情報なのか 秘密情報を使って出どころを調べられるのであれば問題はないでしょう。 # 例えばAWSのIAM User Credenntialsとか $ AWS_A
アーケード筐体奮闘記～アーケード筐体でPCゲームを遊べるようにした話～ - KAYAC engineers' blog
はじめに この記事はTech KAYAC Advent Calendar 2022の6日目の記事です。 こんにちは、OC事業部その他配属の橋本と申します。普段は専門部隊の手が届かないところにヘルプで入ってよしなにすることを仕事としているのですが、その仕事のうちの一つに「アーケード筐体をPCと繋いでよしなにゲームできるようにしておいて」という無茶ぶり仕事があったので、その時の奮闘を今回ブログとして供養したいと思います。 筐体について 今回動かす筐体はこちらになります。 今回動かす筐体 多分BLASTCITY SEGAのBLAST CITYだと思いますが、僕も細かい仕様はよく知りません。なんせインターネットが発達する前の代物です。しかも非売品。ろくな資料は見つけられませんでした。 さて、コイツの大まかな構成ですが、ものすごくザックリ言うと筐体の中にモニターとコントローラが入っていて、これらをよ
すき焼きの写真にすき焼きの3Dモデルを埋め込む方法 - KAYAC engineers' blog
この記事は Tech KAYAC Advent Calendar 2021の14日目の記事です。 こんにちは！意匠部のおばらです。 今日は、知っていても役に立たないかもしれない、 WEBページでの画像の変な使い方をご紹介しようと思います。 題して「すき焼きの写真にすき焼きの3Dモデルを埋め込む方法」です。 すき焼きの写真にすき焼きの3Dモデルを埋め込む方法 WEBページで読み込んでいるファイルは全部丸見え！ ブラウザのデベロッパーツール、便利ですよね。 特に Network や Source タブ。 読み込んでいるファイルがぜ〜んぶ丸見えです。 いけてるWEBサイトを見つけたら どうやって作ってるんだろう？ ふむふむ、3D部分はThree.jsで、モデルはglTFか〜 お、テクスチャはKTXを使ってる！ みたいに調べちゃいますよね？？ そう、デベロッパーツールは 覗く側としては、すご〜く勉
人間の行動を操るために覚えておきたい科学 - KAYAC engineers' blog
この記事はTech KAYAC Advent Calendar 2019の4日目の記事です。 こんにちは。技術部平山です。 この記事では、人の行動を操る、つまり、人の行動を予測したり、望みの行動を取らせるために役立つ科学について 軽く紹介いたします。プログラミングの話はございませんが、 プログラマに読みやすい味付けにはしておきました。 なお、「人を操る」とか言っていますが、実際それで思うように操れるのであれば、 私はもっと裕福だったでしょうし、高い地位を得ていたことでしょう。 理屈と実践は異なるということです。 ただ、これを知って気が楽になる方もいらっしゃるかもしれませんし、 もしかしたら、実際に何かを改善させられるかもしれません。 基本的には与太話ですので、お暇な方のみお付き合いください。 予測に使える理論は、制御にも使えるかもしれない 何かしらの理論によって現象が予測できるのであれば、
細かすぎるけど伝わって欲しいlodash.jsの話 - KAYAC engineers' blog
ギリギリの時間にこんばんは、12/2のアドベントカレンダーは、HTMLファイ部ののびーがお送りします。受託事業でWebフロントを書いたり、テクニカルディレクションをやったりしている人です。 さて今年はさっくりと、常日頃からお世話になっているlodash.jsというライブラリについて、掘り下げた紹介をさせていただきます。 lodash.jsとは https://lodash.com/ A modern JavaScript utility library delivering modularity, performance & extras. つまるところ、 ユーティリティー（なんか便利）関数を集めたやつ めっちゃかるい という特徴を持つライブラリです。近頃のフロントエンドの流行りであるThree.jsだったり、Vue.jsだったりといったものに比べると 地味 です。非常に地味ですが、個人的
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
1
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く
