TypeScript入門2025年度リクルート エンジニアコース新人研修の講義資料です
TypeScript の Go 移植に備えて知っておくべきこと
はじめに こんにちは、ダイニーの ogino です。 TypeScript のコンパイラは今まで TypeScript で実装（セルフホスト）されていました。 それが TypeScript 7.0 から、Go による実装に移植され、10 倍高速になります。 本記事は、移植に関して筆者が疑問に感じた点を、GitHub discussion や TypeScript lead architect のインタビュー動画などから調べてまとめたものです。 移行の背景 今回 Go に移植される背景は、大規模な TypeScript コードベースをコンパイルする際のスピードの遅さにあります。 例えば VSCode のコードベース (150 万行) に対して tsc を実行すると、約 80 秒もかかります。 TypeScript のコンパイルは大きく以下の段階に分けられ、その内の check が特に複雑で重
Vscode拡張機能を開発してみた
前置き VScode の拡張機能をつくってみたので、その過程を備忘録的に書いていきます。 拡張機能に必要なツールのインストール方法 どのファイルに処理を書いていくのか デバッグして確認 作ったあとにどうやって VScode にインストールするのか 主にこの 4 つを簡単に書いていきます。 拡張機能を作りたいと思っている方の参考程度になれば幸いです。 作った拡張機能 選択範囲の文字をすべて大文字に変換 選択範囲の文字をすべて小文字に変換 選択範囲の文字の先頭のみを大文字に変換 今回つくったのはこれらの機能をもった拡張機能です。 準備・インストール 事前準備 Node.js が動かせる環境 まず、拡張機能を作るためのツールをインストールします。 以下のコマンドを実行します。
Bun + TypeScript でブックマークレットの開発体験を高める - つまみログ
これを使うと頑張って「単位足りてるかな……」と単位修得状況の表の数字を目で追いかけずとも、一発で単位が足りているか分かり便利です。たぶん月曜日 (2024-03-04) に卒業予定者以外の人の成績発表があると思うので是非使ってみてください！ 本題に入ります。 ブックマークレットというと生の JavaScript を書くイメージがあると思いますが、今回私はこのブックマークレットをファイル分割した TypeScript のプロジェクトとして作りました。しかも linter/formatter も入れています。かなり快適に開発ができたので、やったことを紹介したいと思います。 tl;dr ファイル分割した TypeScript のプロジェクトもバンドルすればブックマークレットに使える Bun.build を使うと TS のプロジェクトを簡単にバンドルできる 開発サーバを立てると、スムーズにブックマ
【図解解説】React19の新機能を使って書籍管理アプリを開発するチュートリアル【Hono/TypeScript/TailwindCSS】 - Qiita
Deleted articles cannot be recovered. Draft of this article would be also deleted. Are you sure you want to delete this article? はじめに ついにReact19が安定版になりました！！！！ React19になったことで「サーバーコンポーネントの正式対応」や「アクションの追加」など大きな変更が入りました。 この変更によってShadcnなど多くのライブラリが対応を頑張っている状況です(おそらく裏では...) 今回はそんなReact19の中でも特に知っておきたい機能を中心に紹介していきます。 ちなみにReact19の機能は実験的に少し前から公開されており、世の中にはすでに多くの記事やYoutube動画があります。 しかしそれらの記事や動画を見て思いました… 自分の能力が
TypeScript で Web 開発をする際の候補メモ
2025/01/04 Git Hooks ツールの Lefthook を追記 2025/01/05 フロントエンドの状態管理に XState を追記 各リンクテキストを対象名がわかりやすい形式に変更 概要 以前のプロジェクトで使っていたり、進行中に差し替えまでは出来ないけど次使うならこれを使おうと思っていたライブラリやツールなどが、いざ新しくプロジェクトを作ろうと初期構築を始めたら色々と失念している事ってよくありませんか？ 最近実際それがあり、個別のページにわかれて技術メモはとってあったりするのですが探しながらは手間なのとブクマしただけのものもあるので、インデックス的に手軽に気になった技術をメモっておく見ながら構築したり技術選定の前段階に使うようなノートを作ったので誰かのお役に立つかもと公開してみます。 気軽に雑にメモるのを前提に作ったものをそのまま公開しているので文体等は統一されてません
lodash-esよりも軽量かつ高速なes-toolkitに移行してみる
es-toolkitとは es-toolkitは配列・数値計算・オブジェクトや文字列操作などの機能を提供するJavaScriptのユーティリティです。公式の紹介文によると、lodashなどの代替品と比較して最大97%のバンドルサイズの削減、実行時パフォーマンスの2～3倍高速化、シンプルかつ堅牢なTypeScriptのサポートを特徴としています。バージョンv1.0.0が2024年5月末と新しいライブラリに関わらず（現在はv1.16.0）、GitHub Starは4.6kと期待のライブラリです。 検証内容/前提条件 今回はlodash（正確にはlodash-es）をあまり利用していないプロジェクトで移行を行い、効果を検証します。具体的には配列の比較にisEqual、ディープコピーにcloneDeep、オブジェクトのマージにmergeの全3関数を利用しているプロジェクトを対象とします。 インスト
TypeScript/Rollup/Vercelでサクッとブックマークレットを作ってみよう - Adwaysエンジニアブログ
こんにちは。エンジニアブログ運営の梅津です。 普段はエージェンシー事業部でリードアプリケーションエンジニアとして働いています。 エンジニアブログ運営としてブログの質を向上させるために、これまでのブログの情報を集めたりもするのですが、これを逐一手作業で行うのは大変です。 ある程度の作業は自動化したい。そういったときはブックマークレットを作ると便利ですよね。 今回はそんなブックマークレットの作り方をまとめてみました。 「ブックマークレット？よく知らないな」「聞いたことあるけど作り方とか気にしたことなかった」という人がいれば是非一緒に試してみてください！ 筆者の開発環境やこのブログで利用する主な技術のバージョンは次のとおりです。 macOS Node.js 18.12.1 TypeScript 5.0.4 Rollup 3.23.0 Vercel CLI 29.4.0 ブックマークレットとは T
ブックマークレットをTypeScriptで書く（rollup編） - Qiita
rollupを用いて、ブックマークレットをTypeScriptで書く環境を構築する手順を示します。 ブックマークレットをTypeScriptで書きたい 私は、日々のウェブブラウジングを快適にするためのブックマークレットを自作しています。 ブックマークレットの魅力は、なんといっても1行でさくっと書けるお手軽さにあります。 しかしながら、ある程度の規模を超えたブックマークレットを素のJavaScriptで、それも1行の中に書いていくのは、なかなかつらいものです。 そこで、ブックマークレットをTypeScriptで書きたいと思いました。 ブックマークレットをTypeScriptで書くには ブックマークレットをTypeScriptで書くには、おおむね次のようなことをおこなう必要があります。 TypeScriptをJavaScriptにトランスパイル ファイルが分かれている場合は1ファイルにバンドル
TypeScriptは型安全じゃないからすばらしい - まめめも
「TypeScriptではじめる型システム」という記事をn月刊ラムダノートに寄稿しました。 新刊を発売しました "『n月刊ラムダノート』Vol.4 No.3（2024）発行のお知らせ https://t.co/PGppk1aRRA— lambdanote (@lambdanote) 2024年10月4日 どんな内容？ TypeScriptの極小サブセットに対する型検査器を書き、それを通して型システムを体感してみよう、という内容です。 詳しく言うと、boolean型とnumber型と関数型しかないTypeScriptサブセット言語がターゲットです。 型検査器の実装言語にもTypeScript（処理系はDeno）を使います。 TypeScriptづくしの一品です。 わかる人向けに言うと、「型システム入門」という本（通称TAPL）の単純型付きラムダ計算に相当する内容をTypeScriptで説明し
Node.js 環境に TypeScriptとnodemonを導入し、ECMAScriptにも対応させる
はじめに Node.js は JavaScript の実行環境として広く使われていますが、TypeScriptの直接実行をサポートしていません。本記事では、TypeScriptをNode.js環境で実行する方法に焦点を当て、さらにECMAScript モジュール (ESM) 、nodemonを利用するための設定についても解説します。 実行環境 "ts-node": "^10.9.1", "@types/node": "^18.7.18", "nodemon": "^2.0.20", TypeScript と Node.js Node.jsはTypeScriptを標準では直接実行できません。そのため、TypeScript コードはJavaScriptにコンパイルされる必要があります。ここで、開発者の助けとなるのが ts-node です。 ts-node の導入 ts-node は、TypeS
export {}; が使われるTypeScript特有の事情
TypeScriptのコードでは、export {}; という記述を見かけることがあります。これはECMAScriptの構文ではあるものの、これが使われる背景にはTypeScript特有の事情があります。この記事では、export {}; がなぜ使われるのか、どのような効果があるのかを解説します。 export {}; とは この構文は、exportというキーワードから分かるように、モジュールに関連する構文です。 一般に、export { ... };という構文は、既存の変数をモジュールからエクスポートするために使われます。例えば、次のようなコードが考えられます。 const foo = 42; const bar = "hello"; const banana = "banana"; export { foo, bar as hello, banana as "🍌", }; 変数をエク
Next.js + TypeScript + Tailwind CSS の開発環境をできるだけ丁寧に構築する【2024年】
はじめに 最近、Next.js、TypeScript、Tailwind CSSを使って技術ブログを立ち上げました。（まだあまり更新は進んでいませんが…） このプロジェクトを通じて構築した開発環境がわりと快適だったので、誰かの参考になるかもしれないと記事を書いてみることにしました。 できる限りわかりやすく詳細な説明を心がけましたが、その結果、記事のボリュームが大きくなってしまいました。長文ですが、興味のある方はぜひ読んでみてください🙏 また、この記事内で紹介した内容をセットアップしたリポジトリを公開しています。 Next.jsのボイラープレートとして活用可能ですので、興味のある方はぜひ覗いてみてください。
【個人開発】最新のNext.js+NextAuth.js+prisma+microCMSでECサイト作ってみた【フルスタックアプリケーション】 - Qiita
はじめに 皆さんこんにちは、mamiなのだ！ 今回はバックエンドは作らずにNextAuth.jsやprisma、microCMSなどを利用してNext.jsでECサイトを作成してみたので、その方法や手順などを公開しつつ、認証周りや大型開発案件でも採用されるstorybookなどについても解説していこうと思うのだ！ フロントを勉強し始めた初学者さんや、フロントがメインではないバックエンドエンジニアの方に向けて、丁寧に解説を挟みながら書いていくので「へ〜フロントってこんな感じのことやってるんだ〜」と思ってくれたら嬉しいのだ！ ちなみにこの記事は丁寧に解説しすぎて死ぬほど長くなってしまったので、気になる部分だけ読んでみても良いのだ！ フロントガチ初心者の方は読んでるだけでも勉強になると思うので、暇な時にのんびり読むことをお勧めするのだ！ 対象読者 フロントを勉強し始めた初学者さん フロントがメイ
Google Apps Script の開発環境構築方法 - Qiita
はじめに Google Apps Scriptを開発するときにclaspを導入してソース管理し始めた後、もっと色々できないかと調べた結果を備忘録として記載します。 GOAL 開発環境として最終的に下記を利用して開発できるようになります。 VSCode: コードエディター clasp: Google Apps Scriptをローカルで開発できるようにするもの TypeScript: プレーンJavaScriptにコンパイルされるJavaScriptの型付きスーパーセット ESLint: JavaScriptコードの問題を見つけて修正することができる Jest: シンプルさを重視した楽しいJavaScriptテストフレームワーク claspのインストール〜プロジェクト作成 https://github.com/google/clasp 上記ページのInstallセクションの記載通りに実行します
TypeScript の流儀
Bonfire Frontend #4 http://yj-meetup.connpass.com/event/136480/
1
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く
ブックマークレットを esbuild で作る - たくさんの自由帳
TypeScript、上達の瞬間
はじめに｜サクッと始めるウェブアプリ開発【Next.js / TypeScript】