Blogged Answers: My Experience Modernizing Packages to ESM
Random musings on React, Redux, and more, by Redux maintainer Mark "acemarke" Erikson This is a post in the Blogged Answers series. Details on the painful experiences and hard-earned lessons I've learned migrating the Redux packages to ESM Table of Contents 🔗︎ Introduction Redux Packages Background Packages and Configurations Issue History Early Attempts Migrating to Vitest Initial Alpha Testing
GitHub - formkit/tempo: 📆 Parse, format, manipulate, and internationalize dates and times in JavaScript and TypeScript.
Tempo is a new library in a proud tradition of JavaScript date and time libraries. Inspired by the likes of moment.js, day.js, and date-fns Tempo is built from the ground up to be as small and easy to use as possible. Tempo is best thought of as a collection of utilities for working with Date objects — an important distinction from other libraries that provide custom date primitives. Under the hoo
GitHub - honojs/honox: HonoX - Hono based meta framework
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
こんにちは。 株式会社HRBrainでフロントエンドエンジニアをしているみつです。 とはいえ、技術が足らないなぁとか、 無理やりコーディングしているなぁとか、感じている日々 先日、そんな無理やりコーディングの最中、 「念のためString使って文字列だよってしとこ〜」と軽い気持ちで使っただけなのにね・・・ new String()になんか怒られたのでその共有です 目次 ★先に結論 ★これが、エラー ★これは、エラーじゃない String（MDNより） string（サバイバルTypeScriptより） ★何のエラーだった？ ★さらに言うと・・・ ★まとめ 参考URL ★先に結論 Stringは、オブジェクトだからstring型とは同じものではない。 ★これが、エラー const something = '何かしらの値' const text: string = new String(som
JSer.info #665 - Web ComponentsライブラリであるLit 3.0がリリースされました。 Lit Launch Day: Lit 3.0, Labs graduations, a compiler and more! – Lit Lit 3 upgrade guide – Lit Lit 3では、IE11のサポート終了、最小の実行環境をES2021をサポートしてるブラウザへ変更が行われています。 Lit 2.0で非推奨となったAPIの削除、Stage 3のDecoratorの対応なども行われています。 また、新しいLitテンプレートコンパイラーの公開、Preact Signalsを統合するパッケージも公開されています。 Chrome 118がリリースされました。 New in Chrome 118 - Chrome for Developers Chrome 11
Today we’re excited to announce our Release Candidate of TypeScript 5.4! Between now and the stable release of TypeScript 5.4, we expect no further changes apart from critical bug fixes. To get started using the RC, you can get it through NuGet, or through npm with the following command: npm install -D typescript@rc Here’s a quick list of what’s new in TypeScript 5.4! Preserved Narrowing in Closur
JSer.info #681 - 2024年6月の正式公開に向けたES2024のリリース候補が公開されました。 Release ES2024 Candidate February 2024 · tc39/ecma262 ES2024では、次のような変更が含まれる予定です。 ArrayBuffer.prototype.resize ArrayBuffer.prototype.transfer RegExp v flag Promise.withResolvers Object.groupBy/Map.groupBy Atomics.waitAsync String.prototype.isWellFormed/String.prototype.toWellFormed 毎年2月ごろに仕様へ取り込むProposalが決まり、6月ごろのGA 127th meetingで最終的な承認を得る予定です
こんにちは、Slack の公式 SDK 開発と日本の Developer Relations を担当している瀬良 (@seratch) と申します 先日、いくつかの技術検証も兼ねて、日本ではよく話題に上がる「勤怠/時間管理」を Slack だけでできるサンプルアプリをつくりました。 ソースコードを MIT ライセンスで公開しています。コードは 100% TypeScript で書かれており、Deno で動作するものです。 このアプリは Slack ワークフロービルダーの基盤である「オートメーションプラットフォーム」の機能だけで実装されており、Slack 以外のインフラを一切必要としないことが特徴的です。 この記事では、このアプリの使い勝手などについて詳しく解説します。 そもそも「オートメーションプラットフォーム」って何？ なお、「オートメーションプラットフォーム（以前は次世代プラットフォー
Fuse: TypeScript API Framework
Build and query great APls with TypeScriptAggregate all your data sources and transform them into a great API for your clients with many best practices built-in for you—fully typesafe from data source to client query. What's Fuse? A framework for building great APIs effortlesslyBuild a GraphQL API that aggregates all your microservices, data stores, and third-party APIs with the minimum amount of
ESLintがメジャーバージョンアップしてv9.0.0に ー Flat configがデフォルトに、新たなルール導入、Node.js v19以前のサポート終了
4月6日、JavaScriptのコード品質管理ツールであるESLintは、その最新版バージョン9.0.0をリリースした。このアップデートでは、新機能の導入、バグ修正、そしていくつかの重大な変更が行われた。 4月6日、JavaScriptのコード品質管理ツールであるESLintは、その最新版バージョン9.0.0をリリースした。このアップデートでは、新機能の導入、バグ修正、そしていくつかの重大な変更が行われた。 新しいバージョンをインストールするには、以下のコマンドを実行するだけでよい。 npm i eslint@9.0.0 --save-dev 主な変更点を以下に挙げる。 Node.jsサポートの更新 主要な変更点の一つとして、Node.jsのサポートが更新された。これにより、Node.js v18.18.0未満およびv19のサポートが終了し、Node.js v20.xが現在のLTSリリース
モチベーション ドキュメントに載せるサンプルコードを E2E テストできるようにしたい Vite でマルチページ使いたい index.html と main.ts の組み合わせ Playwright で E2E テストを実行したい 戦略 src/index.html でそれぞれのサンプルに飛べるようにしたい env.local で必要な設定を指定できるようにしたい VITE_ を使う src/spam や src/egg とサンプル毎に細かく index.html と main.ts を用意したい vite 時はいいが、vite build 時に困るので対応する必要がある vite.config.js で rollupOptions の input を設定をする必要がある エントリーポイントを src/ 以下にしたい root で設定する .env のパスは root を変更するとそこに影
const fruits = ['Apple', 'Banana', undefined] const result = fruits.filter(x => x !== undefined) // const result: (string | undefined)[] console.log(result) // ['Apple', 'Banana'] このように、resultという変数にundefinedがない状況でもfilterを使用した場合は型が絞られませんでした。 Javascriptに慣れてきて、TypeScriptに足を踏み入れた頃は本当にここで躓きました、、 それが近い未来、変わるかもしれません。 これからのfilter const fruits = ['Apple', 'Banana', undefined] const result = fruits.filter(x
Open sourcing Ezno's checker and trying out / previewing the JavaScript type checker today · kaleidawave/ezno · Discussion #21
Firstly, to not waste anyone's time, do not bother running this currently on any existing projects. It does not currently support import, loops, async and loads of other JavaScript features. This is an early release to showcase functions, object, events and basic typing. More of those features coming shortly, once the architecture has been initially tried out. I have created a quick start guide fo
突然ですが問題です 文字列の変数を宣言するとき、型注釈にStringとstringのどちらを使いますか？ あまり意識したことない方もいるのではないでしょうか？ 答え stringの方を使いましょう。 その理由について見ていきましょう。 プリミティブ型とラッパーオブジェクト stringはプリミティブ型で、Stringはラッパーオブジェクトです。 プリミティブ型について 文字列、数値、論理値などの基本的な値の型のことです。 プリミティブ型はimmutableという特性を持ちます。つまり、変更することができません。 また、プリミティブ型はメソッドやプロパティを持ちません。 ラッパーオブジェクトについて ラッパーオブジェクトは、プリミティブ型の値をラップしたオブジェクトのことです。 平たく言うと、プリミティブ型を便利に使えるようにしたものです。 便利に使えるようにしたものですので、ラッパーオブジ
using : リソース変数の管理が楽になるキーワード (JavaScript&TypeScript) - Qiita
この記事の内容にある意見は、個人の主観的意見を前提とします。 記事の内容は間違いがあり得ますので、ご了承いただけると幸いです。内容の間違い、認識の違い、違う意見などありましたら、コメント大歓迎です！ 概要 JavaScriptにおいて、変数を初期化できるkeyword var, let, constに加え、usingがまもなく追加される予定です。 usingキーワードで宣言した変数は、リソースタイプ変数として見なされ、変数がscope外になる前に自動でリソース解除作業を行うことができるようになり、従来の明示的にリソース解除コードを書くという面倒な作業がだいぶ楽になることが期待できます。 ECMAScript Proposalは以下となっておりStage3段階となってます。 https://github.com/tc39/proposal-explicit-resource-manageme
はじめに こんにちは、@Sicut_study(Watanabe Jin)です。 つい先日以下の勉強会を開催しました 今回はこの勉強会で実際に行ったことや、メンバーがどのように成長したかをまとめていきます！ Junior Engineers TypeScript 3時間ハッカソンを開催しました🎉 この勉強会はとにかく体験で学ぶをテーマにアイデアを出して、一緒に調べて、0からアプリを作ります✨ 今回は10人3チームに分かれてアプリをわいわい作りました！… pic.twitter.com/wK5V99V4sE — Watanabe Jin (@Sicut_study) February 3, 2024 勉強会の概要 Junior Enginners は若手のエンジニアを中心とした 「体験で学ぶ」 をテーマにした新感覚の勉強会です。 人が成長するのは「体験」した瞬間だと思っています。 「実務経
Today we are excited to announce the availability of TypeScript 5.3 Beta. To get started using the beta, you can get it through NuGet, or through npm with the following command: npm install -D typescript@beta Here’s a quick list of what’s new in TypeScript 5.3! Import Attributes Stable Support resolution-mode in Import Types switch (true) Narrowing Narrowing On Comparisons to Booleans instanceof N
【日本語訳】nitrogql 1.0リリース
この記事は、本日公開された次の記事の日本語訳です。海外で人気の記事を翻訳してみたシリーズと見せかけて、実は自分で英語で書いた記事を自分で日本語に訳して自分が作ったツールの宣伝をする記事です。元記事はこちらです。 本日、nitrogqlの最初の安定版をリリースしました！ nitrogqlはTypeScriptプロジェクトでGraphQLを使うためのツールチェインです。 nitrogqlとは 現在のところ、nitrogqlは主に2つの機能を持ちます。それは、コード生成と静的チェックです。 コード生成 コード生成は、GraphQLコード（スキーマとオペレーションのどちらも）からTypeScriptコードを生成することを指します。これにより、TypeScriptコードからGraphQLオペレーションを型安全に使用できるようになります。また、ボイラープレートコードを書く必要もありません。 これはスキ
Rust製TypeScript LinterであるBiome, Oxc, deno_lintなどは、TypeScriptの型情報を利用するLintルール（型情報Lintルール）[1]を持っていません。本記事では、その背景から、Rust製TypeScript Linterが型情報Lintルールを実現するための手段についてまとめます。 筆者のTSKaigi 2024で利用した下記登壇資料に情報を追加し、文章化したものです。 要約すると、以下になります。 Rust製TypeScript Linterは、安全性をさらに高めてくれるtypescript-eslintの型情報Lintルールが欲しいが、パフォーマンスを犠牲にしたくない。TypeScript Compilerに頼らずに実現するには、Alternative TypeScript Compilerや型推論が必要。型情報Lintルールの実装を型
Fault-tolerant TypeScript code execution made easyDBOS Cloud is a revolutionary serverless software platform rooted in research from MIT and Stanford. Transactional serverless computing in TypeScript DBOS sets a new standard for serverless computing with these unique advantages: Reduce and simplify your code base - fault handling and recovery are automatedGuaranteed once-and-only once executionDep
みなさん、こんにちは。物流・運送会社向けにSaaSを開発するアセンド株式会社で取締役CTOを務めている丹羽（@niwa_takeru）です。 今回は初開催をとうとう１週間後に控えると共に、私が理事を務めているTSKaigi 2024について、開催に至るまでの想いを発信したいと思います。 思えばちょうど１年前のゴールデンウィークに旅先の函館のサウナで、日本に住む１CTOをとして何か社会に還元できることはないかと考えた結果が、TypeScript に関する大規模カンファレンスを開催することでした。 そして１年が経ち、この5月11日に1,000名を超える参加者が集う TSKaigi 2024 を数々の方の尽力と共に初開催を迎えることができました。皆さんへの感謝の思いと共に綴ります。 TypeScriptのカンファレンスの再始動TypeScript に関する大規模なカンファレンスはTSConfJP
JSer.info #661 - Remix v2がリリースされました。 Release v2.0.0 · remix-run/remix Remix v2 | Remix React 17のサポート終了、Node.js 14/16のサポート終了されています。 オプションやデフォルトの動作の変更が含まれますが、 V1からの移行はv2_*フラグを使うことで機能を一つずつ有効化して移行できるようになっています。 Upgrading to v2 | Remix ルーティングのディレクトリ構造のデフォルトがFlat Routesに変更されています。 Flat Routes · remix-run/remix · Discussion #4482 2.0.0ではv2_*フラグの削除、remix.config.jsの設定やコマンドの変更などが含まれています。 Safari 17.0がリリースされました
# Object-Oriented Conference 2024 2024/03/24 16:30〜 Track E（共1-304）ショートセッション（20分） ## 概要 社内共通ルールを値オブジェクトにして社内ライブラリとして運用してみた話 レバテックは現在、フリーランス・派遣・就転職、新卒の各領域を軸に様々なサービス・事業を展開しています。 これらシステムで共通となるルールがいくつか存在しています。 例えば、「メールアドレス」「電話番号」「生年月日」などのValidationであったり、振る舞いに関するルールです。 レバテックではこれらのルールを各システムが保持しており、ルールの分散とルールの不一致により、何件ものシステム障害を起こしていました。 このシステム障害の原因として、ルールの分散とルールの不一致もあるが、共通ルールが存在しておらず、どのルールが正なのかもわからず、システム
Turborepoのチュートリアル
はじめに Turborepoは、高速でスケーラブルなモノレポ（monorepo）ビルドシステムです。自身の知識の棚卸しを目的に記事化しました。 本記事では、以下について解説します。 モノレポとマルチレポの違い Turborepo とは何か、どのような課題を解決しているのか Turborepo を実際に利用するためのチュートリアル Turborepo のチュートリアルは以下の公式チュートリアルをベースに、自身で足りないと思った要素を追加しています。 マルチレポとは モノレポ（monorepo）とマルチレポ（multirepo）は、プロジェクトのコード管理戦略の異なる形態です。 モノレポでは、すべてのプロジェクトやパッケージが 1 つのリポジトリで管理されるのに対し、マルチレポでは各プロジェクトやパッケージが独自のリポジトリで管理されます。 以下の図がマルチレポの構成を表した例です。Repo1
TypeScriptには本書や開発元のMicrosoftが提供しているものを含め、学習や調査に役立つ数多くのリソースが存在しています。 このページでは本書の解説を読んだ後や、読んでいる途中でも利用できるTypeScriptについての情報源を紹介します。さらにこのページの後半では学習や開発において非常に重要となる公式ドキュメントについて構造と読み方などを含めた攻略方法を解説します。
AWSのECSってなんやねん
自己紹介 どもども、フリーランスエンジニアとして働いている井上弥風です。 ずっとバックエンドメインで仕事をしてきたのですが、インフラ側がヨワヨワ過ぎたので勉強を始めました ECSを自分で設定して開発時に利用して～～とかまで全部できる自信がなかったので学習していきます 対戦よろしくお願いします 初めに 記事の内容 この記事は「そもそもDockerって何？」から始まり、そのあとにECSを理解していきます ECSに関する内容だけを学びたい方は上記目次から「実際に使ってみた」まで飛んでいただけると読みやすいかと思います 記事のゴール 記事のゴールは下記です Dockerに対する理解をすること ECSに対する基礎知識を理解すること ECSに関わるサービス(ECRなど)の理解をすること そもそもDockerとは何か ECSの前にDockerってそもそも何者なんっていうのを僕が完全に理解できていなかった
GAS からAdmina API を使って SaaS 利用状況を可視化する Looker Studio を作ってみた
タイトルの通り、Admina API を使ってサービスxアカウントの一覧を取得する GAS のコードを OSS で公開しました。 実際に使う際はこれをベースにご自身の環境に合わせてカスタマイズしてもらえばいいかなと思います。 最終的な成果物のイメージ GAS スプレッドシート Looker Studio これを作ると何が嬉しいの？ 下記のようなケースで利用できますし、スプレッドシートに一度だしているので、スプレッドシートの内容を見てアカウント削除漏れがあったことを Slack でサービスごとの管理者に通知、みたいな拡張をするとよいでしょう。 メールアドレスで検索してサービス一覧を出す 退職ステータスで検索してアカウント削除漏れアカウント一覧を出す Looker Studio（BI ツール）で閲覧できるのがメリット Admina に従業員全員を招待してもいいっちゃいいのですが、BI ツールで
【2023年版】tsconfig.jsonを設定する
前置き 本スクラップでは、Reactプロジェクトにおいて、2023年現在におけるベストなtsconfig.jsonの設定を考えていく。 その際、参考にするのは、以下の3つである。 Next.js Vite サバイバルTypeScript 順に、それぞれ補足していく。 Next.js Next.js公式ドキュメントのcreate-tsconfigのページにある通り、空のtsconfig.jsonを作っておくと、Next.jsは勝手にtsconfigを生成してくれる。 実際に生成してみると、tsconfigが以下のようになった。 (使用バージョンはnext: 13.4.4) { "compilerOptions": { "lib": [ "dom", "dom.iterable", "esnext" ], "allowJs": true, "skipLibCheck": true, "stri
Explicit Resource Management: Exploring JavaScript's and TypeScript's new feature | iliazeus
Explicit Resource Management: Exploring JavaScript's and TypeScript's new feature 2023-11-13 en CC BY-SA 4.0 read in russian One of my favorite new features of JavaScript and TypeScript is explicit resource management. It brings new syntax, using foobar = ..., that enables RAII, reducing boilerplate when managing the lifecycle of various resources. In this article, I will explore this feature as i
TSConfig Guide - Generate a modern TSConfig file from just a few toggles.
Sick of scouring the TypeScript docs to setup your TSConfig?I was too, so I built this tool to get you started with some smart defaults! This TSConfig builder is heavily influenced by Matt Pocock's TSConfig Cheat Sheet. I highly encourage you to check it out for further explanation of these properties.
こんにちは、クラスメソッドからチャールです. このブログで、QRコードを簡単な手順で作成する方法について説明します。 始めましょう！ 1. 始めるには、まず以下のコマンドを使用してコンピュータにディレクトリを作成しましょう、 mkdir qr-code-generator cd qr-code-generator 2. 次に、プロジェクトのためにTypeScriptをインストールします。 npm init -y npm install --save-dev typescript ts-node npx tsc --init 3. QRコードを生成するためにqrcodeライブラリを使用します。次のコマンドでインストールします。 npm install qrcode 4. index.tsという名前のファイルを作成し、お気に入りのコードエディタで開きます。私はVSCodeを使っています。 im
Today we are excited to announce the availability of TypeScript 5.2 Beta. To get started using the beta, you can get it through NuGet, or through npm with the following command: npm install -D typescript@beta Here’s a quick list of what’s new in TypeScript 5.2! using Declarations and Explicit Resource Management Decorator Metadata Named and Anonymous Tuple Elements Easier Method Usage for Unions o
Next.js初めてみたいけど、よくわからない、また、初めてみたけど、App Routerがわからない、SSR、SSG 、ISRって何だよってなって挫折した方多いと思います。 そんな方に向けて送るNext.jsの入門本を書きました。 SSR、SSG、 ISRでブログを作成し、その違いを完全に理解し、Nextjsを使いこなせるようになりましょう。 ✅ Nextjs ✅ TypeScript ✅ Tailwind CSS
typescript-eslint is the tooling that enables standard JavaScript tools such as ESLint and Prettier to support TypeScript code. We've been working on a set of breaking changes and general features that we're excited to get in released! 🎉 We'd previously blogged about v6 in Announcing typescript-eslint v6 Beta. This blog post contains much of the same information as that one, but updated for chang
2024-03-28 Encraft #12 Frontend Quiz Night
Exploring Type-Informed Lint Rules in Rust based TypeScript Linters
Exploring Type-Informed Lint Rules in Rust based TypeScript Linters | Rust製TypeScript Linterにおける型情報Lintルールの模索 This slides are used at TSKaigi 2024 | TSKaigi 2024 にて利用した資料です。(20m) Update requests are welcome anytime. ## References - Rust-Based JavaScript Linters: Fast, But No Typed Linting Right Now https://www.joshuakgoldberg.com/blog/rust-based-javascript-linters-fast-but-no-typed-linting-right-n
JavaScriptおよびTypeScriptアプリケーション用オールインワンツールキットの正式版「Bun 1.0」が公開された。開発チームが2023年9月8日（米国時間）に公式ブログで発表した。 Bun 1.0は、単一の実行ファイルとして提供されており、単一ファイルからフルスタックアプリケーションまで、JavaScriptとTypeScriptの実行、ビルド、テスト、デバッグに使用できる。開発ワークフローをスピードアップしたり、リソースに制約がある環境でサーバレス関数のようなシンプルな本番コードを実行したりする目的での利用が想定されている。 Bunは、JavaScriptのツール群が遅く、複雑になってしまっているという認識から、JavaScriptの長所を全て維持しつつ、この問題を解消することを目指して開発された。 Bunの中核を担うBunランタイムは、サーバサイドJavaScript環
大規模なアプリケーションを開発するためのプログラミング言語として、JavaScriptを拡張した「TypeScript」の人気が高まっている。8個のQ＆Aを通して、TypeScriptのポイントを解説する。 Q3 結局TypeScriptを使うと何がうれしいの？ A3 静的型チェック以外にも様々なメリットがあります。 TypeScriptの最大の利点は静的型チェックですが、それ以外にもいろいろなメリットがあります。 そもそもTypeScriptは大規模なアプリケーションをJavaScriptで開発できるようにするために誕生しました。このため、大規模開発で有効になるような機能がいろいろと提供されています。ここではその中から利点と言える機能や特徴を5つ紹介しましょう。 （1）未使用の引数やローカル変数をチェックする機能がある TypeScriptには、未使用の引数やローカル変数をチェックする機
React開発におけるベストプラクティスである、bulletproof-reactを紹介します。 bulletproof-reactはReactアプリ開発のベストプラクティスとして作られたリポジトリです。 Reactには多くのライブラリがあり便利ですが、その反面多過ぎてどのライブラリを利用するのが良いのか選定に悩む場合があります。また、Reactはディレクトリ構造など自由に作ることができ柔軟性があります。しかし、ある程度決められた構成が無いと、コードに一貫性が無くなったり、複雑で読みにくくなる場合があります。bulletproof-reactでは、パフォーマンスや保守性、拡張性を踏まえてどのようなプロジェクト構成が良いかを提案しています。もちろんあくまで参考程度であり、実際に採用するかは個人の判断になります。 プロジェクト構成 bulletproof-reactで勧められている、React
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く
TypeScriptで開発中、Stringとstringの違いでエラーに遭遇。 - Qiita
2023-10-16のJS: Lit 3、Chrome 118、Zodの作り方
Announcing TypeScript 5.4 RC - TypeScript
2024-02-20のJS: ES2024 RC、typescript-eslint v7、React Compiler
Slack だけで動作する勤怠/時間管理を実装した話 - Qiita
Vite でマルチページを Playwright でテストする
Array.filter ← これで型が絞れるようになるらしい
TypeScriptでStringとstringどっち使うの問題 - Qiita
未経験ばかりのTypeScript 3時間ハッカソンで全員が成長しまくった話 - Qiita
Env
Announcing TypeScript 5.3 Beta - TypeScript
Rust製TypeScript Linterにおける型情報Lintルールの模索
DBOS - Transactional Serverless Platform for TypeScript
TSKaigi 開催に向けて｜Niwa Takeru｜アセンド株式会社CTO
2023-09-22のJS: Remix v2、Safari 17、TypeScriptドキュメンタリー
社内共通ルールを値オブジェクトにして社内ライブラリとして運用してみた話
TypeScriptの学習リソース | TypeScript入門『サバイバルTypeScript』
TypeScriptを使用してQRCodeを作成します | DevelopersIO
Announcing TypeScript 5.2 Beta - TypeScript
【SSR、SSG、ISRでブログを作る】Nextjs14初心者入門
Announcing typescript-eslint v6 | typescript-eslint
TypeScript Quiz (Encraft #12 Frontend Quiz Night)
JavaScript／TypeScriptアプリ用オールインワンツールキット「Bun 1.0」が公開
TypeScriptを使うと何がうれしい？型チェック以外にも多くのメリット
技術選定の参考にbulletproof-reactを見てみる | DevelopersIO