タグ

ブックマーク / jinjor-labo.hatenablog.com (7)

  • TypeScript >= 4.1 の Template Literal Types を活用した引数パーサーを作ってみた - ジンジャー研究室

    ヘルプっぽいものを書くと文字列をパースして型をつけてくれる。 デフォルト値を指定すると T | null が T になったりする。 公開は今のところ GitHub Packages だけです(メンテしなくていい方法を考え中) github.com 型レベルのパーサーはこちらの記事を大いに参考にしたというかパクりました。 (ネタ) TypeScript 型パズルで作るmini interpreter | by Yosuke Kurami | Medium こんなに格的じゃないけど。 難しいなと思ったのは、せっかく型レベルでパースしてもその結果を値レベルの実装に利用できない点。 なので、型は型、値は値でそれぞれパースして最終的に辻褄が合うように実装しました。 それでは皆さま良いお年を。

    TypeScript >= 4.1 の Template Literal Types を活用した引数パーサーを作ってみた - ジンジャー研究室
    efcl
    efcl 2021/01/01
    Template Literal Typeで引数パース
  • puppeteer + express + mocha で快適 TDD している話 - ジンジャー研究室

    TDD という用語を使うとテストおじさんがやってきて、それはそうじゃないとか色々言い出すと思うんだけど、それが趣旨ではないので勘弁して欲しい。予防線ここまで。 Puppeteer でテスト Puppeteer が世間的にも個人的にもブームだ。ヘッドレス Chrome を操ってクローリングしたりスクリーンショットを撮ったり色々出来る。 github.com で、あれこれと遊んでいるうちにテストに使えるんじゃね?ということに気づいたので実践してみたら快適だったという話。ブラウザ操作してテストというのは昔から Selenium というのがあり、こちらはクロスブラウザで出来たりするんだけどまあ大掛かりでだるさを感じてしまう。メリットデメリットの比較はさておき、どうせならナウいやつを使ってみたい。よし使おう。 何をテストするか 普段から画面を見ながら開発しているので、どこに何が表示されているべきとい

    puppeteer + express + mocha で快適 TDD している話 - ジンジャー研究室
    efcl
    efcl 2018/03/26
    Puppeteerを使ったAPIのテスト
  • Context Menu のデザイン - ジンジャー研究室

    ブラウザ上に Context Menu を実装するときに何を参考にすればいいのかわからなかったので、自分用にメモ。 見た目 Win10 - Chrome Win10 - Firefox Win10 - Edge Win10 - Desktop Mac - Browsers/Desktop Google Spreadsheet 位置 クリックした位置からメニューが出る方向と、はみ出したときに画面内に収める方法。 環境 デフォルト方向 左右はみ出し 上下はみ出し Win10 Desktop 左下 シフト 反転 Win10 Chrome 右下 シフト 反転 Win10 Firefox 右下 シフト 反転 Win10 Edge 右下 反転 反転 Mac Desktop/Browsers 右下 反転 シフト Google Spreadsheet 右下 反転 反転

    Context Menu のデザイン - ジンジャー研究室
    efcl
    efcl 2016/11/09
    ブラウザの右クリックメニュー/コンテキストメニュー
  • TOEICのリスニングCDを分割するWebアプリを作った - ジンジャー研究室

    TOEICのリスニング問題集をやっていて「ムキーッ!」となることありませんか? 私は2つほどあります。1つは「ひとつの問題を繰り返して聞きたいのにファイルが分かれていない」こと、もう1つは「何を言ってるのかさっぱり分からない」ことです。そこで今回、1つめの問題を解決すべく、CD音源を複数の問題別に分割するWebアプリを作りました。 Wave Cutter for TOEIC®(Source) Chrome、Firefox、Edgeで動作確認済みですので、ぜひ遊んでみてください。 使い方 MP3ファイルを読ませると自動的に空白を判断して分割します 自動分割で上手くいかなかったところを手動で調整します 完了ボタンを押すとZIPファイルが手に入ります 2に関しては、出力予定のファイル名(左側)と波形データの内容(右側)を一致させるゲームだと思うと手っ取り早いです。 主な機能 波形の削除、分割、結

    TOEICのリスニングCDを分割するWebアプリを作った - ジンジャー研究室
    efcl
    efcl 2015/12/29
    無音箇所で分割して再生出来るウェブアプリ
  • OSS関係で英語を書くときに心がけていること - ジンジャー研究室

    最近、OSS関係でGitHubとかMLとかに顔を出していて、当然ながら会話は全部英語。 というわけで、英語を書くときに心がけていることを簡単に書く。 「英語が下手ですいません」とか前置きしない 読めば下手だって分かるから、わざわざ言う必要ない。これ言ってる人を見かけるとほぼ確実に日人なんだけど、必要以上に卑屈なオーラを感じるので良くないと思っている。いくら日人が英語苦手とは言え、英語圏の人は糞な英語に慣れてるから大体分かってくれるし、分からない場合はこういう意味かとレスが来るから、その都度説明すればいい。ただし後にも書くように礼儀は必要なので、甘え切って雑になるのはよろしくない。逆に丁寧に書けば懸命さが伝わり好印象。 あと、日人以外にも非ネイティブは沢山居ると思うと結構気が楽。自分の感覚としては非ネイティブの書く英語ほど分かりやすい気がしていて、ネイティブの方が表現が小洒落てて時とし

    OSS関係で英語を書くときに心がけていること - ジンジャー研究室
    efcl
    efcl 2015/08/30
    OSSでの英語でのコミュニケーションについて
  • 脱PolymerなWeb Componentsデザパタ - ジンジャー研究室

    はじめに 今朝話題になっていたWeb Componentsの基的な使い方・まとめ に触発されてみる。 すごい…!私にはこんな緻密な資料は書けないorz だけど何か書きたい。書くぞ。 そろそろWeb Componentsしたい Web開発に革命をもたらすと噂のWeb Componentsだが、そろそろプロダクションへの導入を検討したい。 2014年12月現在、Chrome 36+で全機能が使えるので、デモ画面や開発(テスト)ツールでは既にPolyfillなしで色々出来る。積極的に遊んでみたい。 とはいえ、現状と言えばWeb Componentsに関する情報は紹介記事がほとんどで、あまりプラクティカルな領域に踏み込めていない感がある。まあそんなものは実際に使い始めればわんさか出るので、別にその時になってからでも良いのだが、せっかくなので戦略の一つや二つ練っておきたい。 もうひとつ、Googl

    脱PolymerなWeb Componentsデザパタ - ジンジャー研究室
    efcl
    efcl 2014/12/14
    Custom Elementだけを使った開発について。 元々の要素を継承する形で利用すれば親和製があることや遅延初期化について
  • Angular.jsとBackbone.jsのDOM依存を図解する - ジンジャー研究室

    果敢にもMVCフレームワークの図解を試みたので、どうぞ! MVCの動機 MVCという言葉が初めて登場してから30年以上たった今、最早なんだったのか分からないほどMVCの定義は混迷をきたしているわけだが、どれがMVCでMVVMでMVPであるという定義についてあれこれ考察するのは個人的には好きでなくて、「結局何がしたいのか」という動機がぶれていなければ何でも良いと思っている。 じゃあそれは一体何なのかということを自分なりに考えてみたところ、次の一言に落ち着いた。 「ModelはViewに依存したくない」 世間的には(?)ModelとViewを単に「分ける」と説明されることが多いが、私はそれだけでは納得していなくて、依存の方向こそが重要だと思っている。たとえ分かれているように見えてもModelがViewを参照していたら、情報の取得先や表現方法は固定化されてしまう。 ModelはViewの事情から

    Angular.jsとBackbone.jsのDOM依存を図解する - ジンジャー研究室
    efcl
    efcl 2013/06/22
    Angular.jsとBackbone.jsの依存の方向について。
  • 1