タグ

TypeScriptに関するski_yskのブックマーク (8)

  • DevHub - GitHubをTweetDeck風に閲覧

    MOONGIFTはオープンソース・ソフトウェアを紹介するブログです。2021年07月16日で更新停止しました TweetDeckは開発者でもよく使っているTwitterクライアントになっています。多くの検索条件でツイートを閲覧したり、メンションやDM、タイムラインなどを切り替えることなく閲覧できる一覧性が便利です。 そんなTweetDeck風のUIGitHubで実現してくれるのがDevHubです。 DevHubの使い方 メイン画面です。通知やアクティビティが閲覧できます。UIはまさにTweetDeck風です。 ユーザを指定してカラムに追加しました。 カラムのフィルタリング条件も指定できます。 ダークモードにも対応しています。 DevHubはGitHubをよく使っている人ほど便利でしょう。組織やリポジトリも指定できるので、仕事とプライベート両方で便利に使えるはずです。コメントにいち早く反応

    DevHub - GitHubをTweetDeck風に閲覧
  • JsStore - IndexedDBを使いやすくするO/Rマッパー風ライブラリ MOONGIFT

    HTML5でWebブラウザ内にデータを残す方法としてlocalStorageが有名ですが、他にIndexedDBがあります。しかしIndexedDBは検索できるKVSであったり、localStorageと違って非同期で使う、スキーマが必要など何かと面倒なイメージがあります。 そこで使ってみたいのがJsStoreです。IndexedDBをまるでデータベースのように使えるようにするソフトウェアです。 JsStoreの使い方 IndexedDBを開く処理です。スキーマの定義も行います。 var dbName ='JsStore_Demo'; function getDbSchema() { var tblProduct = { name: 'Product', columns: [ { name: 'Id', primaryKey: true, autoIncrement: true }, {

    JsStore - IndexedDBを使いやすくするO/Rマッパー風ライブラリ MOONGIFT
  • CodeWich - TypeScript対応、サーバレスなHTMLプレイグラウンド MOONGIFT

    JSFiddleやCodePenなど、HTML/JavaScript/CSSのプレイグラウンド的サービスが多数あります。多くのサービスは専用のURLが払い出され、そのURLにアクセスして使います。そして、そのサービスが落ちたりすると使えなくなるリスクがあります。 そんな中注目したいのがCodeWichです。コードを圧縮して専用のURLとする、URLを覚えている限りはあなたのコードがなくなったりしないプレイグラウンドサービスです。 CodeWichの使い方 入力はTypeScriptベースになっています。 CSSの入力補完も効いています。 テーマの変更や入力内容のlocalStorage補完に関する設定も可能です。 実行例です。 Canvasを使った表現もできます。 CSSを使ったものも。 CodeWichは共有を行う際にURLが生成されますが、 https://codewich.com/#

    CodeWich - TypeScript対応、サーバレスなHTMLプレイグラウンド MOONGIFT
  • Graphdoc - GraphQLスキーマからドキュメントを生成

    Web APIとしてGraphQLを提供するサービスが増えています。従来のREST APIでは限界のあった、データ構造の自由さに対応するにはGraphQLがベストな選択でしょう。しかしREST APIとは異なるために、求められる情報も変わってきます。 そこで使ってみたいのがGraphdocです。GraphQLのスキーマを使ってWeb APIドキュメントを生成します。 Graphdocの使い方 トップページです。 スキーマの定義を確認できます。 ミューテーション。 型について。 enumについて。 オブジェクトについて。 Graphdocを使うことで構造が明確になり、指定する条件が分かりやすくなります。GraphQLの場合はREST APIとは異なり、エンドポイントが一つです。そのため構造さえ分かってしまえば、後は自由にクエリを記述できるでしょう。 GraphdocはTypeScript製の

    Graphdoc - GraphQLスキーマからドキュメントを生成
  • はてなブックマーク検索PWA - オフラインでも使えるはてなブックマーク検索 MOONGIFT

    PWA(Progressive Web App)というキーワードに注目が集まっています。Webアプリケーションがオフラインで実行できるようになり、アプリのようにスマートフォンにインストールできるようになる仕組みです。 そんなPWAを体感できるWebアプリケーションがはてなブックマーク検索PWAです。はてなブックマークの検索ができます。 はてなブックマーク検索PWAの使い方 ユーザIDを指定してブックマークを取り込みます。 インタラクティブに検索できます。 こちらはオフライン(これだけでは分からないと思いますが)。オンライン時と同様に表示、検索できます。 はてなブックマーク検索PWAはブックマークのデータを取り込んでしまうので、オフライン時でも変わらず検索できます。Web画面についてもオフラインになってもそのまま表示できます。PWAを体験するのにぴったりではないでしょうか。 はてなブックマー

    はてなブックマーク検索PWA - オフラインでも使えるはてなブックマーク検索 MOONGIFT
  • text-map-kuromoji - Web上で形態素解析&ビジュアライズ

    形態素解析は日語のテキストを扱う上でとても重要な技術になります。しかし環境をセットアップしたり、解析結果からどう情報をピックアップするかなどを分析する必要があります。 そうした形態素解析を手軽にWeb上で行い、さらに結果の分析が容易にできるのがtext-map-kuromojiです。 text-map-kuromojiの使い方 メイン画面です。左にテキストを入力し、右側に形態素解析の結果が表示されます。 形態素解析は最初は辞書を読み込むので若干時間がかかりますが、その後の実行は高速です。 text-map-kuromojiでは左側のペインで文字を選択すると、それに対応する解析結果(トークン)のある場所に移動してくれます。ハイライトも行ってくれるので分かりやすいでしょう。 text-map-kuromojiはTypeScript製のオープンソース・ソフトウェア(MIT License)です

    text-map-kuromoji - Web上で形態素解析&ビジュアライズ
  • codewich - Web上でTypeScriptを記述して実行

    Googleが社内の標準言語にTypeScriptを決定するなど、TypeScriptに対する人気が高まっています。型が決められ、各種IDEとの親和性も高く、コードを事前にチェックしたり候補を出したりと便利な機能が使えます。 そんなTypeScriptをWeb上で試せるのがcodewichになります。 codewichの使い方 一例です。TypeScriptCSSHTMLを記述すると右側のペインで実行されます。 TypeScriptを記述しなくとも動きます。 Canvasを使った作品が多くなっています。 マウスと連動するデモ。 codewichはJSFiddleなどに代表されるように、HTML/JavaScript/スタイルシートを記述してその場で表示が確認できるプラットフォームです。特にTypeScriptに特化しているのがポイントと言えます。 codewichはTypeScript

    codewich - Web上でTypeScriptを記述して実行
  • ts2c - JavaScript/TypeScriptのコードをCに変換 MOONGIFT

    JavaScriptはWebブラウザで動作する保証がある唯一のプログラミング言語です。さらにnodeによってサーバサイドやデスクトップなどでもJavaScriptでソフトウェアが作れるようになっています。 今回紹介するのはts2c、JavaScriptTypeScriptをCのコードに変換するソフトウェアです。 ts2cの使い方 例です。 さらにfor文を追加してみます。 生成されたコードをgccでコンパイルすると、ちゃんと結果が表示されます。 $ ./a.out Hello world!a Hello world!b Hello world!c もちろんすべてのコードが問題なく動くわけではありませんが、JavaScriptの中でも特に速度が求められる時にはCで実行するという選択肢ができそうで面白いです。ぜひコードを書いて試してみてください。 ts2cはTypeScript製のオープンソ

    ts2c - JavaScript/TypeScriptのコードをCに変換 MOONGIFT
  • 1