TSKaigi 2025TSKaigiにリダイレクトしています... 自動的にリダイレクトされない場合はこちらをクリックしてください。
Announcing typescript-eslint v7 | typescript-eslint
typescript-eslint is the tooling that enables standard JavaScript tools such as ESLint and Prettier to support TypeScript code. We've been working on infrastructure improvements that will help ensuring long-term interoperability with other tools in the ecosystem. In particular this major release tightens our dependency requirements to help set us up for ESLint v9 and includes a new package typescr
【SkyWay】みんな俺になる。新時代の匿名会議 - Qiita
こちらは「Qiita Engineer Festa 2023 で開催中の 「 新しくなったSkyWayを使ってみよう！」への投稿記事となります。 はじめは簡単なチャットアプリを作ろうと触り始めましたが すぐできてしまったので、 色々機能を足していたらなんだか不思議なアプリができました。 作ったもの 実装方法やSkyWayの使い勝手の話をする前にどんなものを作ったのか ↓これです↓ 🤔？ ...... ... チャットルームに参加すると全員もれなく ジョイマン高木さん になります。 また声のピッチも上下できるので個人特定を著しく困難にした新時代匿名会議ツールです。 画面遷移図としてはこちら↓ チャンネル名が中二病なのはカッコいいからです (ファンタジー用語メーカー利用) PC版Chrome限定ではあるものの、ユーザーは特に準備することなく※1利用することができるのでお手軽ですね。 (複数デ
【入門】フロントエンドのテスト手法まとめ - Qiita
Deleted articles cannot be recovered. Draft of this article would be also deleted. Are you sure you want to delete this article? はじめに 自分は2021年に新卒でweb系の開発会社にフロントエンジニアとして入社し2022年で2年目になります。 実務ではReact×TypeScriptを利用したフロント周りの開発をメインで行なっていなす。 今回は実務でNext.jsプロジェクトにテストを導入することになり「React-Testing-Library」と「Jest」について改めて学び直したのでその内容を紹介します。 はじめに「React-Testing-Library」と「Jest」の概要を説明しその上で具体的なテストコードを何パターンか書いていきます。 この記事の
SvelteではじめるWeb Components開発 - Qiita
はじめに あまり知られていないかもしれませんが、Svelteを使ってWeb Componentsを開発することができます。 本記事ではSvelteを使ってWeb Componentsを開発するやり方を紹介したいと思います。 Web Componentsとは webcomponents.orgから引用 Web Componentsは、WebプラットフォームAPIのセットで、WebページやWebアプリケーションで使用する、新しいカスタム、再利用可能な、カプセル化されたHTMLタグを作成することを可能にします。カスタムコンポーネントとウィジェットはWeb Componentsの標準に基づいて構築され、モダンブラウザで動作し、HTMLで動作するあらゆるJavaScriptライブラリやフレームワークで使用することができます。 Web Componentsは、既存のWeb標準をベースにしています。We
APIから取得したデータの型定義がほしい！って時はJSONから自動生成します。 - Qiita
型定義ほすぃ〜 ちょっとしたプロジェクトで、サードパーティのAPIを使用する際に型定義が無くて困ることがしばしばありました。OpenAPIに登録されていれば自動生成することもできますが、されていなかった場合には今回紹介する手法が使えるかもしれません。 MakeTypes こいつです。 使い方はかんたん。 まず何らかの方法でJSONをまるっとクリップボードに保存します。 自分は一度ブラウザに表示させてやってます。 firefox developer Edition使ってます。 あとはMakeTypesにいって好きな名前付けて貼ると... 型定義が生成されます。 おそらくここから微調整が必要になりますが、大まかなスタートラインとしては十分かと。少なくともゼロから全部自力で書くよりはマシです。 以上。 「それよりこうした方がよくない？」ってのがあれば是非教えて下さい。
CoffeeScript 辞めました - クラウドワークス エンジニアブログ
CoffeeScript 辞めました はじめに こんにちは、CrowdWorks のジャンヌチームのエンジニア bugfire です。 CrowdWorks は歴史のあるサービスで CoffeeScript が利用されている箇所が大量にあります。 具体的には411ファイルありました。1 いまとなっては CoffeeScript を利用したコードを新たに書くことも少なくなり、改善するときに TypeScript で書き直されることも多くなってきました。しかし、個別に変換すると時間が掛かってしまうため、まとめて機械的に変換することにしました！ 3行まとめ CoffeeScript より TypeScript の方に記述を移していきたい。 利用している Sprockets の CoffeeScript 変換コードを借用して全ファイルを変換しました。 確認は変換前後の出力 JavaScript コ
Amplify Function を TypeScript で開発し、ESLint, Prettier で解析する CI/CD 環境 - Qiita
Amplify Function を TypeScript で開発し、ESLint, Prettier で解析する CI/CD 環境TypeScriptESLintprettieramplifyhusky Amplify 便利ですよね。Amplify Function を TypeScript で実装し Lambda にデプロイする方法を調査しました。 本記事は Amplify Docs の公式サイトの解説を元に TypeScript を ESLint と Prettier で静的コード解析した上で Lambda にデプロイする一連の流れを説明します。 本題ではないものは割愛して公式サイトのリンクを掲載します。 CI/CD 環境の考え方 基本となる考え方は上記記事と同じです。 CI はソースコードの①静的コード解析→②テストを担う CD は③ビルド→④デプロイを担う 環境構築 Amplif
オープンソースをメンテするときに自分が考えていること
@azu さんのブログ記事 Maintainer Month: オープンソースをメンテナンスするコツ を読んで GitHub が Maintainer Month というイベントを主催していることを知りました。 自分は Maintainer Month の Sponsoring の対象でありませんが、自分がオープンソースのプロジェクトをメンテするときに考えていることを書き残しておこうと思います。 オープンソースガイド などにはすごいためになることが書かれていますが、積極的な内容で自分にとっては読むだけで疲れてしまうような内容でもあります。なのでこの記事ではあえて自分が普段考えていることの中でも消極的なことについて書いてみます。 オープンソースのメンテナンスに疲弊している人や、オープンソースに貢献している人、もしくは貢献しようと思っている人に「こんなゆるい気持ちでやってる人もいるんだ」と思っ
【React】ライブラリーを使わないでパララックスを使って、リッチなサイトを作る - Qiita
概要 みなさんは、パララックス（parallax）と聞いたことがあるでしょうか？ 最近のサイトは、要素がふわっとフェードインしたり、要素の移動速度が違ったり、 スクロールに応じて色々なアニメーションが発火します。 このようなアニメーションを実装するのは大変です。 そのため、多くのライブラリーが公開され、簡単に実装できるようになっています。 ただ今回は、そんなライブラリーを使わずにパララックスのアニメーションを作成し、 リッチに見えるサイトを作成しました。 ↓作ったサイトはこちらです。ご覧ください。 ※ Qiita Engeer Festa 2022にご参加もお願いします。 パララックス（parallax）についてとは？ まずパララックス（parallax）にて解説します。 パララックス（parallax）とは？ パララックスとは、視差効果のことで、 Webサイトにおいては、パララックスはス
Daggerを使用してCIパイプラインを作成する - Qiita
最近話題になっている？Daggerを使用して typescriptをトランスパイルしS3へdeployするパイプラインを作成してみました。 Daggerとは Daggerは、CICD向けのポータブルなdevkitです。 DaggerはDocker互換のランタイムでパイプラインが実行されるため、Docker互換のランタイムが動く環境であれば Daggerをそのまま実行し、同一の結果を得ることができます。 Daggerではパイプラインの記述を一般的な yaml などではなくcuelangを使用して記述します。 module/packageや型定義などの強力な構文を使用することができます。 チュートリアルなども用意されています。 メリット 上記のことからDaggerを使用することで 開発環境とCI環境の統一 CIロックインをなくすことができる といったメリットを受けることができます。 Dagge
Cloudflare Workersフレームワーク「Hono」の紹介
「Hono」というCloudflare Workers向けのフレームワークを作っています。 以前もYAPCの発表とZennの記事で紹介したものです。 Hono[炎]っていうイケてる名前のフレームワークを作っている Hono[炎] Ultrafast web framework for Cloudflare Workers. あらためて、さかのぼってみると「Initial Commit」が去年の12月15日でそれから現在405コミット。頑張っています。これは僕個人だけのものではなく、コントビューターの方のかいもあってです。ちなみに、そういうのも考慮して、個人リポジトリでやっていましたが、ある時から「honojs」オーガナイゼーションに切り替えました。 現在のバージョンは「v1.4.5」。 APIで紆余曲折ありつつも、安定してきました。また、使ってくれる人もだんだんと増えています。 今回は「現
歴史から見るTypeScriptにおけるwebpackとBabelの必要性 - Qiita
はじめに 今回はwebpackやBabelについて学習したことを理解を深めるために文章としてアウトプットしていこうと思う。 そもそもなぜwebpackやBabelに関して学習しようと思ったかは、これまでTypeScript、React等を用いて様々なアプリケーションを開発してきたが、webpackやbabelに関する知識が曖昧なまま開発ばかりを行なっていた。なんとなく"とりあえず変換してくれているもの"程度の知識しかなかったので、しっかり理解していこうと思う。 そんな中でwebpackやbabelの必要性を学習していくうちにJavaScriptの歴史を理解した方がわかりやすいと思ったため、JavaScriptの歴史についても触れていこうと思う。 JavaScriptの歴史 JavaScriptの誕生 JavaScriptの1995年にNetscapeの技術者であるブレンダン・アイクが開発し
Pulumi (TypeScript) で操作中の AWS アカウント ID を取得する - Qiita
はじめに AWS のリソースへのアクセス権限 （bucket policy 等） や、ログ出力先の設定などを行うために、アカウント ID を取得する機会があり調査したメモです。 AWS Classic (@pulumi/aws) の場合 AWS Classic (@pulumi/aws) は terraform の AWS Provider を元に作成されています terraform の場合は aws_caller_identity を利用しますが Pulumi でも同様の data source を利用します terraform で AWS アカウント ID を取得する場合は以下記事を参考ください。 AWS Classic (@pulumi/aws) の場合は getCallerIdentity を利用し取得 getCallerIdentity terraform 同様、 アカウント I
1
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く
TypeScript の型のエラーはどんなときに発生するのか？～部分型と変性で学ぶ TypeScript の型システム～ - Qiita
TypeScriptで条件分岐時の可読性の高い変数設定 - Qiita
GitHub - PlasmoHQ/plasmo: 🧩 The Browser Extension Framework
Prettier と plugin だけで Node.js のモジュール import の並び順を整える - Qiita
await-to-js で非同期処理(Promise)の try/catch をなくそう - Qiita
Pulumi (TypeScript) で AWS Native Package を利用する初期設定 - Qiita