GitHub - gibbok/typescript-book: The Concise TypeScript Book: A Concise Guide to Effective Development in TypeScript. Free and Open Source.
The Concise TypeScript Book provides a comprehensive and succinct overview of TypeScript's capabilities. It offers clear explanations covering all aspects found in the latest version of the language, from its powerful type system to advanced features. Whether you're a beginner or an experienced developer, this book is an invaluable resource to enhance your understanding and proficiency in TypeScri
【React+TypeScript】Netflixのクローンを作るチュートリアル
【注意！】 2024年4月末にこちらの本の内容を大幅リニューアルしました！ https://note.com/terry10/n/nf0674af97617 ※こちらのZennのBookも5/7を目安にリニューアル内容を反映する予定です 多くの人に手に取って欲しいので、リニューアル後は期間限定で無料配布も検討しています。 こちらのツイートで無料配布について告知しています！ ↓ https://x.com/teriteri_code/status/1783358352447414464 --- React+TypeScriptを使ったNetflixの映画一覧を表示するアプリケーションのチュートリアルです。 学べる事 - ReactのFunctionComponent（関数コンポーネント）とTypeScriptの使用 - React Hooksによるstate管理 - TypeScriptで外
【決定版】2022年～2023年で必ず確認するべきGitHubリポジトリ 40選
はじめに 今回の記事では、個人の独断と偏見で2022年～2023年で必ず確認するべきGitHubのリポジトリを紹介する。私のTwitterでこれまで紹介したものもあれば、そうではないものもある。 GitHubはプログラマーにとって、普段の学習・開発を進めるうえでもっとも重要な情報源の１つである。本記事では、分野ごとに確認するべきGitHubリポジトリを紹介する。 なお、今回の記事で紹介するGitHubリポジトリの分野は以下の通り。内容はWeb開発に特化している。 確認必須 Web Python JavaScript TypeScript ちなみに、「確認必須」は分野を問わずすべてのプログラマーに役立つGitHubリポジトリを紹介している。 今回の記事を通して、年末年始の学習・開発に大いに役立ててもらえたら幸いだ。 確認必須 freeCodeCamp 世界最大規模のプログラミングメディア「f
TypeScript入門『サバイバルTypeScript』〜実務で使うなら最低限ここだけはおさえておきたいこと〜
本書『サバイバルTypeScript』は実務でTypeScriptを使う開発者のための入門書です。そして、このページはTypeScriptの特徴を最速で把握できるよう、数百ページからなる本書のコンテンツをつまみ食いした要約です。 » 本書ついて詳しく知る » とにかく今すぐTypeScriptを書いてみたい TypeScriptとはJavaScriptのスーパーセットとなるプログラミング言語。静的型付け言語であり、プログラムの正しさが静的に検査できる。ライブラリやIDEなどの開発環境が充実しており、大きなエコシステムを持っている。Microsoftが2012年に開発し、オープンソースで公開した。» TypeScriptの特徴について詳しく知る » TypeScript誕生の背景について詳しく知る TypeScriptはJavaScriptのスーパーセットスーパーセットとは、元の言語との
ts-array-lengthを支えるテクニック
皆さんこんにちは。筆者は先日、TypeScript向けライブラリのts-array-lengthを公開しました。 この記事ではこのライブラリを宣伝するとともに、ライブラリの実装がどのようになっているのか解説します。 ts-array-lengthの機能 ts-array-lengthは3つの関数を提供しており、これらを使うことでなんと配列の要素数をチェックできます。 例えばhasLengthを使うと、配列の要素がちょうど2個かどうか調べることができます。 if (hasLength(arr, 2)) { // arrは2要素の配列！ const [first, last] = arr; }
node プロジェクトでも deno lint | deno fmt する
なぜ npm ツールチェインで消耗した こういうところでシュッと deno を入れておくことで、あわよくば本番で使う準備をする 経緯 久々に eslint の設定を見直したらやたら長大な感じでメンテがしんどくなった npm/yarn workspace で monorepo 化した際に、様々な eslint のバージョンが混在して peer-deps の管理が困難になった deno に組み込まれてる lint, fmt は deno かどうかはあまり関係なく、単に typescript なら使える 中身は https://dprint.dev/ と https://github.com/denoland/deno_lint deno lint は eslint の recommended 相当のものは実装してある eslint + typescript をメンテするより、 eslint 吹
JSDocで型を定義してTypeScriptの恩恵を受ける
普段から TypeScript で開発されているほうならば、TypeScript の恩恵を十分に堪能されていることと思います。 特に私は VS Code のインテリセンスには頼りっぱなしでこれがなければまともにコーディングができない体になってしまいました。 しかし時には、TypeScript という概念が存在しない退屈な世界で開発を行わなけらばならない状況はあるでしょう。私はもはやキーボードでタイピングすることすらままなりません。 そんな JavaScript しか利用できない状況で代替手段となるのが、JSDoc です。JSDoc のアノテーションによって型を付与することによって最低限の支援を受けることができます。 @Type @Type タグを使用すると、TypeScript で型をつけるときと同じように型を宣言できます。
ep.129『不要な export をまとめて掃除！みんながほしかった CLI ts-prune』 | UIT INSIDE
https://github.com/nadeesha/ts-prune 今回紹介した CLI ツール typescript.referencesCodeLens.enabled ts-prune を導入するきっかけになった VSCode の設定 有効化すると、関数や変数の被 import 数を表示できる https://forest.watch.impress.co.jp/docs/news/1042641.html Refs LINE 新卒採用 2023 https://linecorp.com/ja/career/newgrads/engineering/ キャリア採用はこちらから https://linecorp.com/ja/career/position/475 BGM&SE 魔王魂/騒音のない世界/OtoLogic
いちばんやさしい webpack 入門
webpack is 何? webpack とは、一言で言うと JavaScript 向けのモジュールバンドラーです。 複数の JavaScript モジュールを一つ（またはいくつか）のファイルへバンドル（=bundle: 束にする、包む）してくれます。 複数の JS モジュールを（場合によっては CSS や画像などのアセット類も）一つにまとめる すでに新規開発の終了も伝えられる webpack ですが、「STATE OF JS 2022」ではいまだに利用率 No.1 の地位にあります。 webpack 後継のモジュールバンドラーとしては、すでに Turbopack の開発開始がアナウンスされています。しかし、これがプロダクションレベルに達するまでは webpack がおそらく使い続けられることになるでしょう。 使うメリットは何？ モジュールを 1 つ（もしくは少数）にまとめることでブラウ
Emacsで自動修正を実現する auto-fix.el
AtomからEmacsに引越しする中で、AtomにあってEmacsにはなく、これがないと快適なプログラミングは厳しいというパッケージや機能が幾つかありました。 その中のひとつが、コードの自動修正機能を提供するパッケージです。 エディタでコードを自動修正する # 個人的な感覚ではGo言語とgofmtの登場以降、いわゆるインデントのタブ・スペース論争やコーディングスタイルについては、プロジェクト毎に利用するコードフォーマッタに任せるという流れで決着がついたと思っています。 最近良く書くJavaScriptやTypeScriptでは、ESLint、TSLint、Prettierが主流になったお陰もあり、僕みたいな様々な会社のプロジェクトで開発を行う人間も、インデント、クォート、文末のセミコロンなどの修正はプログラムに任せて、僕は適当に書いて保存するだけで自然に統一がはかられるようになりました。
lsp-modeのLSPサーバーをプロジェクト別に切り替える方法
最近、Denoの開発をはじめたことにより、EmacsでTypeScriptの開発をするときに、lsp-modeで起動するLSPサーバーをプロジェクトによってNode.js（ts-ls）とDeno（deno-ls）で切り替えたいと思いました。 lsp-modeはすでにJavascript/Typescript (deno)をサポートしているので、おそらくできるはです。 公式回答はディレクトリローカル変数を使う # 調べてみたところ、公式ドキュメントのFAQに次の記載がありました。 I have multiple language servers for language FOO and I want to select the server per project, what can I do? You may create dir-local for each of the project
ts-jestが外部ライブラリをimportできない場合の対処方
あるnpmパッケージを追加した後、Webpackのビルドは通っているのにJestでは以下のようなエラーが出るようになった。 ● Test suite failed to run Jest encountered an unexpected token This usually means that you are trying to import a file which Jest cannot parse, e.g. it's not plain JavaScript. By default, if Jest sees a Babel config, it will use that to transform your files, ignoring "node_modules". Here's what you can do: • If you are trying to use EC
「がんばらないTypeScript」のための現実的な設定を考える ─ 4レベルの厳しさを使い分けてTypeScript疲れを克服しよう！｜ハイクラス転職・求人情報サイト AMBI（アンビ）
ハイクラス求人TOPIT記事一覧「がんばらないTypeScript」のための現実的な設定を考える ─ 4レベルの厳しさを使い分けてTypeScript疲れを克服しよう！ 「がんばらないTypeScript」のための現実的な設定を考える ─ 4レベルの厳しさを使い分けてTypeScript疲れを克服しよう！ エンジニアHubでは2019年に「がんばらないTypeScript」を紹介しました。JavaScriptに静的型付けなどを提供するTypeScriptは、今では実プロジェクトに採用されるプログラミング言語になっています。そこで現実的なTypeScriptの設定を、藤吾郎（gfx）さんに解説してもらいました。 2021年の現在、TypeScriptの価値はますます広く認められるところとなり、多くのJavaScriptプロジェクトがTypeScriptで開発されるようになってきました。またT
EmacsにおけるTypescript + React JSXの苦悩と良さげな設定について - Qiita
これはEmacs Advent Calendar 2020 10日目の記事です。 前置き この記事は淡々と問題を解決する記事ではなく、つらつら苦悩が描写されている。 Typescript + React JSX問題は現在進行形で解決案がドシドシ提案されている。これもその１つとなるといいな。 始まり Emacsのコーディング体験は最高だ。だけど、Typescript + React JSXではいまいちだ。 去年まで会社で利用していたwebのフロントエンド開発はこれだ。 React Redux react-router-dom Emacsのメージャーモードはrjsx-modeを使っていた。 ところが、その１年後の2020年8月。 社内で採用しているフロントエンド周りが大きく変わった。 Typescript Next.js そのためEmacsの構成を大きく見直す必要が出てきてしまった。 下のコー
基本の環境構築 — 仕事ですぐに使えるTypeScript ドキュメント
TypeScriptの世界を知る 前書き Node.jsエコシステムを体験しよう TypeScriptの書き方 変数 プリミティブ型 複合型 基本的な構文 基本的な型付け 関数 その他の組み込み型・関数 クラス 非同期処理 例外処理 モジュール console.logによるログ出力 中級のテクニック ジェネリクス 関数型指向のプログラミング クラス上級編 リアクティブ 高度なテクニック 環境ごとのTips（共通環境・ブラウザ以外） ソフトウェア開発の環境を考える 基本の環境構築 作業フォルダの作成 TypeScriptの環境整備 Prettier Visual Studio Codeの設定 ESLint Visual Studio Codeの設定 ESLintの警告と特定の行だけ無効化する テスト プロジェクト内のファイルの参照方法を@/にする ライブラリ開発のための環境設定 CLIツール
VSCodeのデバッグ機能でJavascriptとTypescriptをデバッグする - Qiita
デバッグにはconsole.logを使いがちですが、新しいコードを理解する場合はデバッグ機能の方が便利です。VSCodeでJavascriptとTypescriptをデバッグするのが思った以上に簡単です！ ① デバッグしたいファイルを開けて、デバッグアイコンをクリックし、Debug with Node.jsをクリックします 以上です。設定したブレークポイントがあれば、ちゃんと止まってくれます！ ② たまには、トランスパイルしないと実行できないJSもあるので、もちろんそのままデバッグはできません。この場合は、もう少しだけ複雑になりますが、その方法も下で紹介します。 トランスパイル必要なJSの場合と、Typescriptの場合は、手順が似ているので、一緒に紹介します。 ① デバッグしたいTSファイルを開けて、デバッグアイコンをクリックし、Create a launch.json fileをクリ
GoogleのTypeScript Style Guideについてのお気持ちスタンダード - タオルケット体操
なんか話題になってて、なんかおみこしwasshoiする流れになってたのでお気持ちを書き残したくなった。 先に結論 こういうのを作って公開するのは誉れある組織 ですが 内容的にはfor TypeScriptというよりはfor ES nextといった感じで、特に型周りに関する言及が少なめ eslintのルールが用意されていないので使いたいなら人力運用になる ゆえにGoogle社員以外がわざわざプロジェクトに導入するのはどうなんでしょうか。手間に見合う価値があるんでしょうか。 だからこれをデファクトにしよう！みんなこれ使えよな！みたいな勇み足はちょっと…… これが言いたかっただけです。 スタイルガイド自体に関するオレのKimochi 伝えたい… 率直にいってしまえばスタイルガイドは存在しているという事実そのもの、そしてそれが常にチェックされている機構に価値があって、中身はどうでもいいと極論しても
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く
Docker で React + TypeScript の開発環境（自分用メモ）
GitHub - typescript-language-server/typescript-language-server: TypeScript & JavaScript Language Server
How I set up my emacs for TypeScript + React