虎の穴開発室ブログ

虎の穴ラボ株式会社所属のエンジニアが書く技術ブログです

MENU

JavaScript

Deno 1.15 へのアップデートと変更事項まとめ

皆さんこんにちは。急に寒くなってきましたね。おっくんです。 去る 2021 年 10 月 13 日に Deno 1.15 がリリースされました。 今回も、リリースノートを参考に 変更事項の気になるところを紹介したいと思います。 実行環境 Docker イメージ denoland/deno:c…

GoogleスプレッドシートとGASでイベント出欠管理ツールを作ってみた話 その2

こんにちは、虎の穴ラボのA.M.です。 前回の記事の最後の方でも触れていますが、作った出欠管理ツールを運用していく中で、「スマートフォンから入力しづらい」または「入力できない」という声が多く上がっていました。 そこで、今回はその解決策としてイベ…

Deno 1.14 へのアップデートと変更事項まとめ

皆さんこんにちは。最近、転居先を探しています。おっくんです。 去る 2021 年 9 月 14 日に Deno 1.14 がリリースされました。 今回も、リリースノートを参考に 変更事項の気になるところを紹介します。 実行環境 Docker イメージ denoland/deno:centos(確…

Deno についてのLT会 toranoana.deno #0 を開催しました

皆さんこんにちは、虎の穴ラボのおっくんです。 2021年 8月 17日 (火) に Deno についてのLT会 『toranoana.deno #0』を開催しました。 yumenosora.connpass.com 目的意識 開催にあたっての目的意識としては、次のようなものがありました。 虎の穴ラボにDeno…

Deno 1.13 へのアップデートと変更事項まとめ

皆さんこんにちは。自宅のダイナゼノンが、カイゼルグリッドナイトになりました。おっくんです。 去る 2021 年 8 月 10 日に Deno 1.13 がリリースされました。 今回も、リリースノートを参考に 変更事項の気になるところを紹介したいと思います。 実行環境 …

Deno 1.12 へのアップデートと変更事項まとめ

皆さんこんにちは、暑い中ですがお元気ですか?おっくんです。 去る 2021 年 7 月 13 日に Deno 1.12 がリリースされました。 今回も、リリースノートを参考に 変更事項の気になるところを紹介したいと思います。 実行環境 macOS Catalina 10.15.7 Docker イ…

Deno 1.11 へのアップデートと変更事項まとめ

皆さんこんにちは、ゴルドバーン抽選先行販売に受かりました。おっくんです。 去る 2021 年 6 月 8 日に Deno 1.11 がリリースされました。 今回も、リリースノートを参考に 変更事項を、紹介したいと思います。 実行環境 macOS Big Sur 10.4 Dockerイメージ…

Canvas初心者がエンジニアのスキルシートをキャラクターシート風に作れるサイトを作ってみた

こんにちは、虎の穴ラボのH.Kです。 最近はお友達とオンラインで『Among Us』を楽しんでいます。 そのお友達は以前より人狼(汝は人狼なりや?)やTRPGを楽しんできた仲間で、キャラクターシートで自己紹介したいという話題になったので作ってみることにしま…

ブラウザでも使えるSQL「AlaSQL」を試そう ~動作確認から検索画面まで~

みなさんこんにちは。 2021 年もお元気ですか? おっくんです。 皆さん SQL 実行してますか? 「CLI で」「DB クライアントで」「ORM を介して」などのいろいろなパターンがあると思いますが、 今回はブラウザで SQL を実行する方法として「AlaSQL」を紹介し…

GoogleスプレッドシートとGASでイベント出欠管理ツールを作ってみた話

こんにちは、お久しぶりです。虎の穴ラボのA.M.です。 虎の穴ラボ Advent Calendar 2020 - Qiita 4日目の記事になります。 今までは全文検索エンジンについての記事を書いてたりしましたが、今回は趣向を変えまして、趣味でプレイしているMMORPGのギルドイベ…

Software Design 2020 年 9 月号 あなたはどこから学ぶ[ステップアップ式]Vue.js 講座 JavaScript フレームワークの潮流がわかる を読みました

みなさん、こんにちは。 半年以上待ち続けた 3D プリンタが届いたので、最近の週末は 3DCAD ソフトばかり触ってるおっくんです。 今回は、Software Design 2020 年 9 月 号の感想を共有していきたいと思います。 虎の穴ラボでは、福利厚生として技術書の購入…

暴動(Riot)を始めよう ~ 「Riot.js で簡単 Web アプリ開発」を読みました ~

みなさんこんにちは。 ずっと見ないふりをしていた自宅のエアコンの故障疑惑を、認めざるをえなくなった虎の穴ラボのおっくんです。 みなさん、熱中症にはお気をつけください。 今回は、桑原 聖仁さん(@kuwahara_jsri)が書かれた、「Riot.js で簡単 Web アプ…

バーコード を読めるようになりたかったので ~ Shape Detection API を使ってみる~

皆さん、こんにちは。 とらのあなラボのおっくんです。 「バーコードを見れば、なんとなくは読める」となんてことを言う友人がいます。 詳しく聞くと、すべてではないけれど一次元バーコードであれば目で見てなんとなく読めるんだそうです。 言うからには「…

Web NFCを試してみました 〜 動作確認とアプリケーション作成 〜

皆さんいかがお過ごしですか?ラボのおっくんです。 気温が高い時期になってきました。室内にいても気が付くと脱水から熱中症になることもあるそうですので、お気を付けください。 今回は、Web NFC を試してみましたので、そちらをレポートします。 最終的に…

ボタンで閉じられる jQueryツールチップの作り方

こんにちは!そろそろ推しのアイドルのライブが恋しくなってきた、虎の穴ラボのS.Sです。 jQueryを使って簡単にツールチップを実装することが出来ますが、これに一手間加えて、ボタンで開閉ができるツールチップを作ってみましたので、今回はその作り方をご…

Puppeteerを使ってWebサイトの自動テストツールを作ってみた

こんにちは。虎の穴ラボのH.Hです。 今回はWebサービスの自動テストを試作したので、作ったアプリケーションについて書こうと思います。 なぜ作ろうと思ったか 虎の穴ラボでは、とらのあな通販やFantiaなど多くのWebサービスの開発を行っています。 日々様々…

Denoに触れてみる ~ 導入から かんたんなアプリケーションまで ~

こんにちは、皆さん雨の季節をいかがお過ごしでしょうか? ラボのおっくんです。 最近、「天気の子」の BD が届いたんですが、雨で思い出す作品の枠が更新してしまいましたね。 ちなみに前は「言葉の庭」でした。 さて、去る 2020 年 5 月 13 日に「deno 1.0…

新幹線の車内ニュースに思いを馳せて - CSSアニメーション -

こんにちは、虎の穴ラボのおっくんです。 昨今の COVID-19 関連ニュースの裏で、去る 3月13 日にひっそりと東海道新幹線車内のニューステロップの提供が終わってしまいました。 toyokeizai.net 特別な思い入れがあるわけではないのですが、そこに在ったもの…

ローカル環境でストリーミングをとりあえず試したい

こんにちは、虎の穴ラボのおっくんです。 これまで虎の穴開発室ブログで、AWS Elemental MediaConvert を使った動画ストリーミングについての記事を2件公開しています。 toranoana-lab.hatenablog.com toranoana-lab.hatenablog.com 今回は、もっと手軽にお…

Googleスプレッドシートに書き込まれたらSlackに通知する

こんにちは、最近はサウナにハマってるS.Sです。今回は、Googleスプレッドシートに書き込みがったあった時に、Google Apps Script (以降、GAS)を使って、Slackに通知する方法をご紹介します。 サンプルで用意しました以下のスプレッドシートを使って説明し…

Tone.jsとp5.jsで音の発生を可視化する

こんにちは、年末年始に新しくWindows10の自作PCを組んだ虎の穴ラボのおっくんです。 昨年から、Web audioを取り扱うライブラリとしてTone.jsを使って、 ブラウザで音を鳴らしたりということをしていたのですが、一歩進んで再生する音を可視化したいと思いま…

Chart.jsでいい感じの色を自動で割り当てる!

こんにちは、虎の穴ラボのH.Kです。 今回はChart.jsで可変の表示要素に対していい感じの色を割り当てる方法をご紹介します。 この記事で解決する課題 取得したデータによって比較対象に当たる要素数が可変になるようなグラフ(Chart.js)に綺麗に色をつける …

WebAssemblyで遊んでみるその4〜WebAssemblyで非同期通信して脱衣(仮)ブロック崩しにする〜

皆さんこんにちは。虎の穴ラボのY.Fです。 前回は番外編として、WebWorkerを使ったCanvas描画について書きました。 (前回の記事) toranoana-lab.hatenablog.com

WebAssemblyで遊んでみる番外編〜Web Workerを使う〜

こんにちは、Y.Fです。 前回までは、Rustを使ったWebAssemblyの作成と、JavaScript側との協調などについて書いてきました。 前回の記事はこちら toranoana-lab.hatenablog.com 今回は、少しWebAssemblyから離れて、Web WorkerによるCanvas描画及び、Worker内…

WebAssemblyで遊んでみるその3〜RustとTypeScriptの分業〜

こんにちは、Y.Fです。 (前回の記事はこちら) toranoana-lab.hatenablog.com 前回はweb_sysを使ってDOM操作までRustで行っていましたが、以下の理由から分離したいと思います。 web_sys に OffscreenCanvasRenderingContext2d のラッパーが無い WebWorkerで…

WebAssemblyで遊んでみるその2〜web_sysでブロック崩し〜

こんにちは。とらのあなラボ所属のY.Fです。 前回のWebAssemblyの記事ではチュートリアルを通して環境構築&JavaScriptとWebAssemblyを連携する方向でアプリケーションを作成しました。 (前回の記事はこちら) toranoana-lab.hatenablog.com 今回は、web_sysと…

WebAssemblyで遊んでみる〜Rust+wasm-pack環境構築編〜

こんにちは。とらのあなラボ所属のY.Fです。 最近情報収集していると俄にWebAssemblyの盛り上がりを感じます。 私はフロントエンドベースにして、Web周りを何でもやるエンジニアとして働いているのですが、 フロントエンドやるにあたってWebAssemblyについて…

Ionicでアニメ情報を取得するスマホアプリを作ってみた

こんにちは、虎の穴ラボのS.Sです。普段は、WEBエンジニアをやっている私ですが、 今回は、Ionicを使って、簡単にスマホアプリを作ってみましたので、 その内容をご紹介させていただきます。 Ionicとは Ionicとは、Google社のAngularというアプリケーション…

AWS CloudFront API を使ったキャッシュ削除ツール

こんにちは、虎の穴ラボのS.Sです。季節の変わり目でもあり、最近は朝晩が少し肌寒くなりましたね。さて弊社の通販サイトでは、画像のキャッシュサーバーにAWS CloudFrontを利用していますが、 キャッシュしている画像をリンクはそのままに、今すぐに新しい…