8月17日、海外のエンジニア向けメディアInfoQが「es-toolkit, a Modern Lodash Alternative」と題した記事を公開した。 この記事では、JavaScriptのモダンなユーティリティライブラリであるes-toolkitについて詳しく紹介されている。es-toolkitは、Lodashに代わるライブラリとして注目されている。 es-toolkitの特徴 es-toolkitは新たに登場したJavaScriptライブラリであり、LodashやUnderscore.jsの直接的な競合であり、以下のような特徴を持つ。 es-toolkitは、 debounce、delay、chunk、sum、pickなど、日常的に使用するユーティリティ関数を提供する es-toolkitは、最新の JavaScript 環境で2～3倍のパフォーマンスを実現する es-toolk

「Astro DB」登場。LibSQLベース、TypeScript ORM搭載、1GBまで無料。静的サイト生成用データベース 静的サイトジェネレータAstro用のデータベースサービス「Astro DB」が登場しました。 簡単にAstroに組み込むことが可能で、Astroのバックエンドデータベースとして、例えばフォームやコメントのデータの入出力、ユーザー認証などに利用可能です。 Introducing: Astro DB Add a hosted database to any Astro project in seconds. Includes a TypeScript ORM, schema manager, and automatic migrations out-of-the-box. Try it today! Every database comes with a generou

皆さんこんにちは。これは、筆者が最近公開したnitrogqlを宣伝する記事です。nitrogqlの概要や、開発にあたっての裏話などを紹介します。 nitrogqlとは nitrogqlは、TypeScriptコードからGraphQLを使用するためのツールです。有体にいえば、graphql-code-generatorを置き換えることを目指して開発しています。具体的には、.graphqlファイルからTypeScriptの型定義を生成する機能を備えています。 例えば、次のようなクエリがあったとします。 query ($unfinishedOnly: Boolean) { todos(filter: { unfinishedOnly: $unfinishedOnly }) { id body createdAt finishedAt tags { id label color } } } imp

0. はじめに 現代のWebアプリケーションの開発言語として、TypeScriptはファーストチョイスの一つです。特殊なケースを除き、フロントエンドの開発言語にはTypeScriptが選ばれるため、言語を統一するメリットを優先し、バックエンドにもTypeScriptが採用されるケースはよく見られます。 またReactがClass Componentを捨てFunction Componentを採用した事件が象徴するように、現代のプログラミングパラダイムのトレンドとして関数型プログラミングがあります。そもそもJavaScriptの出自は、関数型言語をブラウザに搭載できると聞いてNetscapeへ入社したブレンダンアイク氏が、オブジェクト指向言語であるJavaのような言語を会社から要求され、開発したというものです[1]。そのためか、JavaScriptは未だ関数型言語としては未成熟で、関数型プロ

みなさんこんにちは。今日は、TypeScriptの新しいコンパイラオプション（おそらく4.7で導入）であるmoduleSuffixesについての話題がTwitterで見られました。 moduleSuffixesについて詳しくはこちらをご参照ください。 これについては、「モジュール解決がさらに複雑化する」などいくつかの方向性から否定的な意見が見られました。しかし、筆者が考えてみたところ、正当性のある機能追加だと納得できたので考えをご紹介します。 3行でまとめると これまで通りランタイムの挙動に影響しないから大丈夫だよ pathsが怖くないならmoduleSuffixesも怖くないよ TypeScriptはJavaScript環境に追随するよ moduleSuffixesとは では、moduleSuffixesはどんなコンパイラオプションなのかという解説をまず少しします。これはTypeScri

Re: 僕らを縛る Node.js という呪いについて - あるいはなぜ TypeScript 以外が真っ当な選択肢にならなかったか https://d.potato4d.me/entry/20220405-nodejs/ へのアンサーソング。 プログラミング言語としての JavaScript の話をする。 2010年頃、Python 2 でプログラミングを学習した自分にとっては Node.js + CoffeeScript が Better Python だった。 CoffeeScript は当時の JS(ES3~5) に足りない機能を補ってくれて、Python と同じく空白制御のオフサイドルールなのが気に入った。見た目が少しだけ Ruby っぽいので当時全盛だった Rails の人間に訴求するにも有利だった。 Node.js のモジュールシステムである Commonjs は Pytho

Atomic Design でいう Atoms に相当する、汎用コンポーネントについての小話です。次の様に Props 型定義を用意し、解説している記事をよく見かけます。<input />タグを使わずコンポーネント化している理由は style を施すためかと思いますが、このコンポーネントが受け取れる Props は限定的で、メンテナンスコストが高いためお勧めできません。 type Props = { value: string; onChange?: React.ChangeEventHandler<HTMLInputElement> onBlur?: React.FocusEventHandler<HTMLInputElement> } export const Input = ({ value, onChange, onBlur }: Props) => ( <input value=

「Deno 1.20」では、通信レイヤを最大60％高速化するように最適化すべく、Rust procマクロを活用して既存のRustコードから高度に最適化されたV8バインディングを生成することで、JavascriptとRust間のパフォーマンスを向上している。 DenoのネイティブHTTPサーバがレスポンスボディの自動圧縮をサポートするようになったほか、コードのベンチマークとしてdeno benchサブコマンドとDeno.bench() APIが追加された。また、コードベースの開発に固有のカスタムコマンドを定義および実行するための新たなタスクランナとしてdeno taskサブコマンドが追加されている。 さらに、Denoの設定ファイルにおいてインポートマップファイルを指定できるようになるとともに、HTTPS要求において証明書と秘密鍵を物理ファイルとしてディスクに保存することが非推奨となった。また

You signed in with another tab or window. Reload to refresh your session. You signed out in another tab or window. Reload to refresh your session. You switched accounts on another tab or window. Reload to refresh your session. Dismiss alert

社内用の啓発記事ですが、閉じる理由がないのでここに投げます。 ブラウザにべったりなコードを書いてると、ブラウザや node.js 固有の環境をインラインで記述してしまうことが多々あると思います。 あえてダメダメなブラウザ向けのエントリポイントの例を書きます。 // main.ts let id = localStorage.get('id'); if (!id) { id = `${navigator.userAgent}-${Math.random()}`; localStorage.set('id', id); fetch('/auth', { method: 'POST', credentials: 'include', body: JSON.stringify({ id, at: Date.now(), }), headers: {'Content-Type': 'applicat

Make Ship HappenTurbo is an incremental bundler and build system optimized for JavaScript and TypeScript, written in Rust.

AWS Lambda Powertools TypeScript がbetaリリースされたと古巣のCDOが教えてくれたので触ってみました? AWSの中の人のツイートはこれです。 I am ✨thrilled✨ to announce that the beta release of AWS Lambda Powertools TypeScript is public? It provides a suite of utilities for Node.js Lambda functions to ease the adoption of best practices such as tracing, structured logging, custom metrics ✨https://t.co/6xYpOEY5zM — Sara Gerion (@Sarutule) January 5,

Node.jsのNative ESM対応は夢の機能ですが、夢を詰め込みすぎたせいかCJSからの移行を難しくしているポイントが依然として存在します。そのひとつが拡張子問題で、Node.jsのNative ESMではモジュールの拡張子を明示しなければいけなくなりました。 (これはWebブラウザの挙動に近づけるための判断だと考えられます。) 特にTypeScriptと他のツール (JestやWebpack) と組み合わせて利用している状態でのNative ESM化は実質的に未解決の状態だと言えます。本稿ではこの現状についてできる範囲で状況説明を試みます。 Node.jsの拡張子の扱い Node.jsはCJSとESMの2つのモジュールフォーマットをサポートしていますが、これらは単にパーサーが異なるだけではなく、実質的には「2種類の異なるモジュールシステムがFFIで繋がっている」程度には隔たりがあり

はじめに 私の仕事は、新規サービスをまるっといい感じに開発するのを委託されることがほとんどです。最近はネイティブアプリを作ることよりもブラウザで動くWebサービスを開発することが多いのですが、案件の規模感や要求によって技術選定を少し変えるようにしています。「こういうときはこう」みたいに一概には言えないのですが、普段使う構成を紹介します。誰かの参考になれば幸いです。 2022/02/10 現在での内容です。 前提 開発を委託される場合の運用費をどうするの問題があります。クライアントにクレカ登録をしてもらうか、こちらで支払って毎月請求するかになります。僕は毎月やるのがめんどくさいのでできるだけ前者に倒している関係上、あまりいろいろなSaaSを組み合わせて作ることをなるべく避けています。 規模感によらず使っているもの 私の場合、以下が使えるとめちゃくちゃ効率よく開発できます。 GCP 好きだから

CDK Dayを観ていたところSAM を使った CDK のローカル環境でのテスト方法が紹介されていたのでドキュメントを読みながら実際に使ってみました。 CDK Day ではsam-beta-cdkと呼ばれていましたが、ドキュメントを確認したところ SAM CLI と記述があったのでプライベートプレビュー時からパブリックプレビューになった段階で名称が変更された可能性があります。記事を執筆した段階で日本語ドキュメントはまだ最新ではなかったため英語のドキュメントを参照しながら進めました。 また、AWS SAMを使ったCDKのローカル環境での利用は2022.02.4現在パブリックプレビュー中なので今後後方互換性の無い変更が加えられる可能性があることにご注意ください。 前準備 CDK をローカルでテストするには AWS CDK、パブリックプレビューバージョンの AWS SAM CLI, Docker

それっぽいタイトルを付けましたが特に意味はないです。 workspace を使ったコマンドを最適化して実行する Turborepo についてのお話で Turborepo を軽く触ってみた際にnpx create-turbo@latestで作られる構成がとてもわかりやすく、プロダクトの初期段階からモノレポを採用するのは選択肢の 1 つとしていいのでは、と思い続編を書きました。 前回と同じくサンプルのリポジトリはこちらになります。 https://github.com/nus3/p-turborepo/tree/main/yarn 概要 モノレポを採用することで、同一リポジトリ内で自作した汎用的なライブラリやコンポーネントを複数のアプリケーションで使いまわせる モノレポの規模が大きくなってきた場合には、モノレポ内のパッケージを npm に公開することでアプリケーションとパッケージを非同期に開発

GraphQL Code Generator (a.k.a. graphql-codegen) のプラグインとして graphql-codegen-typescript-validation-schema (Star ください！) を利用すると yup や zod といったフロントエンド validation 用の schema も自動で生成できます。 例えばこのような GraphQL Schema を与えます。ここで記述している constraint directive は confuser/graphql-constraint-directive で提供されているものを想定してます。 input ExampleInput { email: String! @required(msg: "Hello, World!") @constraint(minLength: 50, format:

2022/1/28 Harajuku.ts Meetup #2 にて使用した資料です。 11ページ目はString#join()ではなくArray#join()の誤りでした。お詫びいたします。

TypeScript の型レベルプログラミングのための真面目なスタイルガイドではありません. 型なしラムダ計算で喜ぶような人間が使うための諸刃の剣です. この記事の内容は TypeScript の 2022 年 1 月時点での最新版である 4.5.4 に基づいています. 将来のバージョンでの妥当性は保証しません. 「型〜」「〜型」という用語の「型」はしばしば省略します. 値レベルの話題は一切登場しません. 以前作った型レベル Brainfuck インタプリタはこのスタイルに則っているので参考にどうぞ. いつまでこのネタを引きずるんですか? パラメータに対して制約を付与しない 型定義のパラメータに対して extends を使って制約を付与すると, そのパラメータに与えられる引数を制約を満たすもののみに限定することができます. 例として, 以下の Append には string の部分型のみ

最近、TypeScript + tsoa + express + TypeORM というような技術スタックでバックエンドの Web API 開発しています。 tsoa という軽量な Web フレームワークを使っているんですが、OpenAPI の自動生成をしてくれるので、実装と API 仕様書の齟齬がなく快適に開発ができています。この記事では、TypeScript + tsoa + express + TypeORM を使って簡単な Web API を作成してみたいと思います。 tsoa とは tsoa とは、TypeScript のコードから OpenAPI 定義の自動生成と express、koa、hapi と統合できる Web フレームワークです。TypeScript のデコレータを使ってコントローラークラスに付与して開発します。なんらかの MVC フレームワークを使ったことがある方は