ブックマーク / qiita.com/shellyln (21)

  • 【脱Redux?】Open SOQLを状態ストアとしてReactでアプリを作ってみる - Qiita

    export interface Account_norels { Id: string; Name: string | null; Address: string | null; } export interface Account extends Account_norels { Contacts: Contact[] | null; } export interface Contact_norels { Id: string; Foo: string | null; AccountId: string | null; } export interface Contact extends Contact_norels { Account: Account; } import { build } from 'open-soql/modules/builder'; import { Acc

    【脱Redux?】Open SOQLを状態ストアとしてReactでアプリを作ってみる - Qiita
  • SQLライクな「グラフ」クエリエンジンOpen SOQLを作ってみた - Qiita

    日(2020-08-17)、Open SOQL 最初の安定版となる v0.1.0 をリリースしました🎉 Open SOQLはSalesforceで使われている独自のクエリ言語「SOQL」(Salesforce Object Query Language) のオープンソース実装版です。 オリジナルのSOQLは長い歴史を持ちますが (詳しい歴史を辿れないのですが、2008年には既に存在していたようです)、オブジェクトのグラフを利用者が必要な項目に絞って取得できる (つまり、オーバークエリしない) という、まるでGraphQLのような特徴を持っています。 (GraphQLの初版は2015年のようです) 文法もSQLに近く学習コストが抑えられており、さらにGroup byによる集計もサポートしています。 Open SOQLはオリジナルのSOQLとは異なり、Salesforceのデータをクエリす

    SQLライクな「グラフ」クエリエンジンOpen SOQLを作ってみた - Qiita
    shellyln
    shellyln 2020/08/17
    書きました
  • あなたのkintone開発にDeveloper Experienceはありますか? - Qiita

    はじめに 最近、kintoneを触っていて不満に思っていたのが、開発のパラダイムが前近代的になりがちであるということでした。 製品自体が小規模な部門内システム(これまでExcelファイルの共有やマクロで行っていたこと)をメインターゲットとしていると思われ、そもそも規模感のある開発を(敢えて?)想定しないためか、デプロイの管理機能を持っていません(サードパーティー製品で可能です)。 また、管理単位がアプリ(データベースの1テーブル)であり、複数アプリが連携するようなものを纏めて管理することができません(纏めて他の環境に新規作成するための「テンプレート」出力機能はありますが、アプリの更新には使えません)。 公式に配布されているCLIツール(customize-uploader、kintone-dts-gen)も単機能かつ単一アプリしか考慮しておらず、組織全体またはシステム全体の開発支援・デプロ

    あなたのkintone開発にDeveloper Experienceはありますか? - Qiita
  • kintoneで相対日付のバリデーションを行う - Qiita

    先日kintoneで宣言的にフィールド値の検証を行うという記事を投稿しました。Tynderというライブラリを使い、型宣言を書くことで、(手続き的ではなく)宣言的に入力値の検証を行いました。 今回はその応用編として、日付や日付時刻型のフィールドを相対日付(例えば、今月、来月、今年、今年度)で検証します。 さらに、フィールドのエラーに合ったカスタムエラーメッセージを表示するようにします。 コード tynder.min.js lib.js (前回記事) app.js (下述) // アプリのレコード型を定義します // interfaceの各フィールドは、kintoneアプリのフィールドコードと一致させてください const definition = ` /** サブテーブル */ interface Table { itemName: string; itemValue: number; }

    kintoneで相対日付のバリデーションを行う - Qiita
  • kintoneで宣言的にフィールド値の検証を行う - Qiita

    先日、 Tynder という、TypeScript/JavaScript用のスキーマ検証ライブラリを公開しました。 Tynder は、TypeScriptのサブセット+独自の拡張文法から成るDSLによって 型の検査 単独の項目の必須・値の長さ・範囲や文字列パターンの検証 複数項目の相関や整合性検証の一部 (Union typeによる) を宣言的に行うことができます。 また、カスタムエラーメッセージを表示することができます。 今回はTynderを使用して、kintoneアプリのフィールド値を宣言的に検証したいと思います。 動機 kintoneは、標準で項目の必須チェック、文字列項目の文字数レンジチェック、数値項目のレンジチェック機能等を備えていますが、やや複雑な条件でのチェックを行うためには、JavaScriptによるカスタマイズを行う必要があります(例えば、条件付き必須、文字列のパターンマ

    kintoneで宣言的にフィールド値の検証を行う - Qiita
  • TypeScriptの型定義からJSON Schemaを生成するオンラインツールを作ってみた - Qiita

    先日、TypeScript + Tynderから始める宣言的検証生活の記事にて スキーマ検証ライブラリTynderを紹介いたしました。 Tynderとは Tynderは、TypeScriptのサブセット+独自の拡張文法から成るDSLによって 型の検査 単独の項目の必須・値の長さ・範囲や文字列パターンの検証 複数項目の相関や整合性検証の一部 (Union typeによる) を宣言的に行うことができます。 今回はTynderのスキーマ変換機能を使用して JSON Schema、GraphQL、Protobuf3 のスキーマを生成するオンラインツールを公開しました。 (GraphQL、Protobuf3については実験的機能です) TypeScript (Tynder DSL) → JSON Schema | GraphQL | Protobuf Converter Convert schema

    TypeScriptの型定義からJSON Schemaを生成するオンラインツールを作ってみた - Qiita
  • TypeScript + Tynderから始める宣言的検証生活 - Qiita

    皆さんは JSON Schema 使ってますか? 現在では、Web APIのペイロード定義・検証、モックサーバー作成、ユーザー入力フォーム検証、設定ファイルのスキーマ定義・検証・IDEでのエラー表示など、多くの場面で、また多くの言語でライブラリが整備され利用されています。 JSON Schemaの強み Internet draftのフォーマットで仕様が公開されている 多くの言語での多くの実装(言語によっては複数)が存在する 1回書けば、フロントエンド、複数のバックエンドすべてで利用できる可能性が高い 代替実装が存在すると競争原理が働く JSON Schemaの嫌いなところ 見辛い 書き辛い 数行の小さなスキーマならばともかく、JSON Schemaって当に苦痛。汎用のデータフォーマットを人が直接記述するレイヤーのDSLにするのは正直辛い。ヒューマンリーダブルだからといって人が読めるとは限

    TypeScript + Tynderから始める宣言的検証生活 - Qiita
    shellyln
    shellyln 2020/02/08
    書きました
  • 怖くないPWA - 既存静的サイトを爆速でPWA化する - Qiita

    先日、以前より公開していたMarkdownエディタのお試し版WebアプリをPWA化しました。 これによって、オフラインで利用できるようになりました。 (実際に、この記事をオフラインのChromebookで下書きしています) MDNE Online (Welcomeテキスト表示なし) Githubリポジトリはこちら 今回は、既存静的サイトを簡単に、そして正しくサイトが更新されるように、PWA化するノウハウをお伝えしたいと思います。 静的コンテンツをPWA化するメリットとデメリット メリット オフライン利用 上述の拙作のエディタやサーバーとの通信がないミニゲーム等では、オフライン状態での利用が可能になります。 また、オンラインヘルプやAPIドキュメント等をPWA化すれば、通信が不安定な場所でも見ることができます。 デスクトップ (またはホーム画面) へのインストール ネイティブアプリケーション

    怖くないPWA - 既存静的サイトを爆速でPWA化する - Qiita
  • CouchDB + PouchDB でPWAを作ろう! - Qiita

    幸いなことに、Create React App等のツールを使えば、Service Workerに対応したアプリのコードを生成してくれます。serviceWorker.registerを呼ぶように変更するだけです。 ... // If you want your app to work offline and load faster, you can change // unregister() to register() below. Note this comes with some pitfalls. // Learn more about service workers: https://bit.ly/CRA-PWA // serviceWorker.unregister(); serviceWorker.register(); 註:public/manifest.jsonも自分のア

    CouchDB + PouchDB でPWAを作ろう! - Qiita
  • JavaScriptのプロトタイプ汚染攻撃対策は難しい - Qiita

    先日、私のプロジェクトで脆弱性関連のissueが投稿されたので対策を行いました。 指摘内容は主に「プロトタイプ汚染攻撃」でした。自分では対策を行っていたつもりだったのですが、様々な穴がありました。 プロトタイプ汚染攻撃可能な脆弱性は成功すると他の機能や脆弱性との組み合わせによって、任意のコード実行を可能にする危険度の高いものですが、XSSやCSRFに比べて、初学者が触れられる纏まった対策方法の情報が少ないと感じたので、ここに記そうと思います。 プロトタイプ汚染攻撃とは 日語の情報としては Node.jsにおけるプロトタイプ汚染攻撃とは何か - ぼちぼち日記 が詳しいですが、まず、前提として、JavaScriptは「プロトタイプベースのオブジェクト指向」を採用しており、原則、すべてのプリミティブ型およびオブジェクトのインスタンスは「プロトタイプ」オブジェクトを参照しています1。 また、プロ

    JavaScriptのプロトタイプ汚染攻撃対策は難しい - Qiita
    shellyln
    shellyln 2019/09/09
    書きました
  • kintoneで長文markdownを編集するために外部エディタと接続する - Qiita

    はじめに 技術系の仕事では、製品のドキュメンテーションからメモ取りに至るまで、markdownの利用範囲が拡がってきています。そのため、そこで使われるサービス・製品ではmarkdownのサポートが進んでいますが、翻って業務系のサービス・製品を見渡すと、markdownの影も形もありません。 markdownで済む文書をWordや方眼紙Excelで作成させられるのは苦行でしかありませんし、修飾が無いと説明できない文章だからと言って添付ファイルを付けたく無いのです。 もちろん、10年来進歩のない、Webアプリのクソ雑魚「リッチテキスト」テキストエリアなど願い下げです。 動機 kintoneに於いても、標準機能としてはmarkdownのサポートはありません。 しかしながら、公式のTipsでもAceエディタの埋め込みかたやmarkdownのレンダリング方法を紹介しており、数行の文章であれば、これら

    kintoneで長文markdownを編集するために外部エディタと接続する - Qiita
    shellyln
    shellyln 2019/06/16
    書きました。
  • 普通のタスク管理にもKanban boardを使おう - Qiita

    はじめに 皆さんはタスク管理、どうしてますか? ソフトウェア開発系の業務であれば、何らかのプロジェクト管理ツール(兼ソースコードリポジトリ?)を使用していると思いますが、管理が必要な開発以外のタスクやTo Doも決して少なくないと思います。 期日だけであれば、Googleカレンダー等に入れてもよいのですが、状態・進捗管理や情報共有が必要なものも多いのが悩ましいところです。 kanban boardを使えば、期日・状態・進捗管理と情報共有が一箇所でできます。 Kanban boardとは 狭義では、日トヨタ生産方式が米国に渡ってソフトウェア開発手法として研究された、いわゆる「Lean software development」系開発で使用されるツールです。 製造業の「Visual signal」(見える化)と「Work In Progress (WIP) Limits; 仕掛り数制限」(

    普通のタスク管理にもKanban boardを使おう - Qiita
    shellyln
    shellyln 2019/06/09
    書きました。
  • kintoneアプリから使えるカスタム帳票アプリを作ってみた - Qiita

    はじめに 皆さん、Low-code platform (ロー・コード・プラットフォーム) って使ってますか? 海外勢では、Salesforce、Zoho、Mendix等が有名ですが、日発で奮闘しているのがサイボウズのkintoneです。 どのプラットフォームもコーディング無し、または、ほんの少しのコーディングで、つまりGUIからの設定のみで、非常に迅速に業務アプリの構築を可能としています。 多くのプラットフォームでは、これで承認ワークフローやレポート・ダッシュボードによる分析、メッセージングツールまで統合されているのですから、簡単に作れるからと言って侮れません。 もちろん、ノー・コードではなくロー・コードですので、必要に応じて(必要でなくても)ゴリゴリコードを書いて開発することもできます。 一般的にスクリプト実行の仕組みと外部からコール可能なWeb APIが用意されていますので、独自ロジ

    kintoneアプリから使えるカスタム帳票アプリを作ってみた - Qiita
  • NodeでES modulesからCommon JSを使う、たったひとつ?の全く冴えないやりかた(2019年版) - Qiita

    NodeでES modulesからCommon JSを使う、たったひとつ?の全く冴えないやりかた(2019年版) 先日ようやく拙作のnpmパッケージ(1)(2)(3)をnodeの --experimental-modules フラグ付きでの直接実行(babelやwebpackによる前処理無し)に対応させたので、その方法をご紹介いたします。 まずは復習 ES Modules (以下、ESM)では、Common JS (以下、CJS)と異なり、他のファイル上の関数や値にアクセスするためには、import / export構文を用います。 CJS

    NodeでES modulesからCommon JSを使う、たったひとつ?の全く冴えないやりかた(2019年版) - Qiita
    shellyln
    shellyln 2019/03/30
    書きました。
  • JavaScriptで同期的にsleepする方法 (通常用途には使わないでください) - Qiita

    setTimeout(() => { // do something after 100ms. }, 100); setTimeout()に渡したコールバック関数は、JavaScriptランタイムのメッセージキューに登録されます。 setTimeout()の呼び出し元は、コールスタックのすべての関数がreturnすることで、ランタイムに処理が戻ります。 ランタイムは、メッセージキューにすぐに実行できる関数があれば実行し、なければ待ちます。 メッセージキューには setTimeout()で登録されたもののように、一定時間後にならなければ実行できないものと、setImmediate()やPromiseで登録されたもののように即座に実行できるものがあります。 メッセージキューが空になると、Node.jsの環境であればプログラムが終了します。 setTimeout()のスリープで何が問題か? se

    JavaScriptで同期的にsleepする方法 (通常用途には使わないでください) - Qiita
    shellyln
    shellyln 2018/11/11
    書きました。(危険)
  • REPLのつくりかた (Node篇) - Qiita

    言語を自作していると、特殊用途でない限り CLI は概ね実装することになりますが、 REPL(Read-Eval-Print Loop; 対話的にコードを実行できる仕組み) は必ずしも要らないため、後回しにしてしまいがちです。 なぜ、後回しにしてしまうかを説明したいと思います。 1. だるい 便利に使えるREPLというのは、メジャーな言語のREPL(Python, JavaScript, Ruby, その他いろいろ)を見ればわかりますが、複数行にわたるコンソールの編集機能を提供していたり、入力のヒストリー機能を持っていたりします。 これらは、単純に標準入出力を読み書きするだけでは実現できません。 端末の行・列のサイズを取ったり、ユーザーのキー入力(矢印キーやバックスペース等)で入力カーソルを動かしたり、文字を消したりする必要があります。 2. だるい 端末の画面描画を行うためには、端末にエ

    REPLのつくりかた (Node篇) - Qiita
    shellyln
    shellyln 2018/11/11
    書きました。
  • RawGit、CDNやめるってよ - Qiita

    10/8から RawGit サイトにサービス終了のお知らせが表示されています。 RawGit has reached the end of its useful life October 8, 2018 RawGit is now in a sunset phase and will soon shut down. It's been a fun five years, but all things must end. GitHub repositories that served content through RawGit within the last month will continue to be served until at least October of 2019. URLs for other repositories are no longer being serv

    RawGit、CDNやめるってよ - Qiita
    shellyln
    shellyln 2018/10/15
    書きました。RawGit、ありがとう
  • TensorFlow.jsのGetting Startedをやってみた

    前回 * Jupyter Notebookのようなもの(あくまで個人の感想です)をメモ帳・ブラウザ・gitで実現する で作成した、Notebookを使って、TensorFlow.jsのGetting Startedを行ってみました。 このサンプルは、一次関数の線形回帰です。 オリジナルは、DevToolsのログに出力していましたが、ビジュアライザーに渡せるように変更しました。 10回の試行では(当たり前ですが)十分に収束しません。概ね300回程度で近い値を返すようになります。 ファイルの拡張子はhtmlで作成しています。 実行結果 コード <!DOCTYPE html><head><meta charset="UTF-8"> <script src="https://cdn.jsdelivr.net/npm/@tensorflow/tfjs@0.13.0"></script> </head

    TensorFlow.jsのGetting Startedをやってみた
  • Jupyter Notebookのようなもの(あくまで個人の感想です)をメモ帳・ブラウザ・gitで実現する

    アプリをインストールせずに、オフラインでMarkdownhtmlに変換してみる 前回、 上記記事を書きましたが、これを発展させて Jupyter Notebook のような、プログラムを実行しながら可視化してノートを書けるものを作りました。 Ménneu Markdown Notebook リポジトリからhtmlとjsファイルをダウンロードしてローカルで実行する形式ですが、デモサイトを以下に用意しています。 すぐに確認したい方はどうぞ。 サイト内のドロップダウンリストから「JS Notebook (Markdown)」を選択して、「👀View」ボタンをクリックしてください。 https://shellyln.github.io/menneu/playground.html ※デモサイトでは、ユーザー入力のJavaScriptは実行されないようになっています。 実行イメージ (中略) 編

    Jupyter Notebookのようなもの(あくまで個人の感想です)をメモ帳・ブラウザ・gitで実現する
    shellyln
    shellyln 2018/10/14
    Markdownをhtmlファイルだけで表示できます。Jupyterのようにノートに埋め込んだコードを実行する拡張もあり。Chart.jsで可視化もできます。
  • Chart.js をサーバーサイドで使う方法 - Qiita

    Chart.js は、JavaScriptで利用できるメジャーなチャート(グラフ)描画ライブラリーの1つですが、HTML DOM、より正確に言えば HTML5 Canvas API に依存しているため、Node.jsの環境では動作できません。 しかし、Canvas以外への依存は殆ど無いので、Canvas APIさえ用意できれば、サーバーサイド・レンダリング (SSR) が可能となります。 今回は私自作のCanvas API互換ライブラリー red-agate-svg-canvas を使用して、Node.js上でSVGにレンダリングしたいと思います。 今回の全ソースは こちら にあります。 追記 (2018/9/18) 今回説明する以外にchartjs-node等のパッケージを用いてもサーバーサイドでChart.jsを使うことができます。 chartjs-nodeのメリットは、jpegやpn

    Chart.js をサーバーサイドで使う方法 - Qiita
    shellyln
    shellyln 2018/10/14
    サーバーサイド、クライアントサイド問わずSVG化できるので良い。