移行のメリットはコストを上回るか？ JavaScriptのTypeScript化で気をつけるべき5つのポイント
技術とノウハウを武器に、膨大かつ複雑なデータの「検索」「分析」「可視化」といった課題を解決するフォルシア株式会社が「FORCIA Meetup #2」を開催しました。2回目の今回のテーマは「2020年度にエンジニアが取り組んだこと」。東川翔氏は、マイクロサービスをJavaScriptからTypeScriptに移行したときの気づきについて発表をしました。 JavaScriptからTypeScriptへの移行プロジェクトが始動 東川翔氏（以下、東川）：「JavaScriptからTypeScriptの移行のプロジェクトに関して気を付けた点」について話していきます。 まず自己紹介です。東川と申します。新卒の2年目で新規旅行アプリの開発をしています。興味のある言語はTypeScriptやPostgreSQLです。最近はクライアントアプリケーションの構築にも興味があって、Next.jsに関してアドベン
既存プロダクトに最小構成でTypeScriptを導入する - RAKSUL TechBlog
こんにちは。 印刷のラクスルでフロントエンドを担当している菅野です。 現在、稼動中のとあるプロダクトへのTypeScript導入を進めています。今回は、既存プロダクトへの影響を最小限に留めつつTypeScriptを導入する手順をご紹介します。 TypeScriptとは TypeScript - JavaScript that scales. TypeScriptは、Microsoftが開発したオープンソースのプログラミング言語です。 詳細な説明は省きますが、以下のような特徴があります。 JavaScriptの厳密なスーパーセット(≒上位互換) 省略可能な型システム クラスベースのオブジェクト指向 TypeScript導入にあたって 今回TypeScriptを導入することで、以下のようなメリットがあります。 型システムの恩恵が得られる エディタの入力補完を受けられる コード=ドキュメントとい
Akitainu: unified linting toolkit for node.js projects
Akitainu is a tool for unifying linting workflows of node.js projects. Based on .akitainurc.js, Akitainu can invoke multiple linters and provide results in a unified format. It also supports posting list results as a pull request review comment on GitHub. Akitainu is also suitable in the case where you want to tighten linter settings but cannot afford to fix all existing code for the new settings.
JavaScriptのライブラリを徐々にTypeScriptに移行する
Alminというライブラリは元々JavaScript(+Babel)で書かれていましたが、今年の2月にsrc/下のソースコードはTypeScriptに移行しました。 その時のコミットログは次のPRに残っているため、コミットログを1コづつ見ていけばどのように行われていったが分かると思います。 Convert src/ to TypeScript by saneyuki · Pull Request #68 · almin/almin この時取った方法は大まかに次のような手順でした src/ の TypeScript化 Babel -> JS(js -> js)だったものをTypeScript -> Babel -> JSにビルドスクリプトを変更 TypeScriptはtargetをesnextにすることで単純に型を取り除くだけの変換にする ES2015 -> ES5を実際にやるのは既存のBa
2021年のTypeScript環境構築で絶対入れるべき「better-typescript-lib」の紹介 - Qiita
こんにちは。この記事は筆者が開発した「better-typescript-lib」を宣伝する記事です。これは、導入するだけでTypeScriptプログラムがより型安全になるという素晴らしいライブラリです。あくまで型定義なので、導入してもランタイムの挙動は何も変わらず、バンドルサイズなどへの影響もありません。 better-typescript-libの導入法 ここに記載されているのはv1 (TypeScript 4.0 〜 4.4向け）のインストール方法です。v2 （TypeScript 4.5〜）ではインストール方法が変わり、最初のnpm installのみで良くなります。詳しくは次の記事をご覧ください。
TypeScriptの型を手に馴染ませるためにやっていること - $shibayu36->blog;
最近TypeScriptが好きで勉強していっている。しかしなかなか型定義周りが手に馴染まず、少し複雑な型定義を読んだり、自分でユーティリティ型を定義したりすることが難しかった。 そこで型を手に馴染ませるために色々学習をしてみたので、やっていることをメモしておく。 まずざっとTypeScriptの型概要を学ぶ まずTypeScriptでの型を簡単に学ぶには以下の2つの資料がわかりやすかった。 TypeScriptの型入門 - Qiita TypeScriptの型初級 - Qiita ひたすら型演習をする 資料を読むだけでは全く手に馴染まないと思ったので、その後ひたすら型演習をしている。 まずは TypeScriptの型演習 - Qiita 。これは先程の型初級、型入門の記事を書いた人が演習問題を作っているため同じ流れで学習でき、さらに解説編も充実しているので、手を動かしながら学ぶのに最適であ
公式ドキュメントを読んでもinferが理解できない人のためのinferの説明 - Qiita
最初に、infer について説明されている良サイト（公式ドキュメントを含む）はこちらです。 TypeScript 2.8 Conditional Types | TypeScript Documentation TypeScript 2.8 の Conditional Types について | Qiita TypeScript2.8 Conditional Types 活用事例 | Qiita TypeScriptのinferとは何か これらを読んでもなお理解不能だった私...。 手元でコードを書いてようやく理解できたので備忘録として記事を残します。 サンプルコードは TypeScript 3.5.1 で試しています。 前提となる知識 Generics と Conditional Types を理解していないと infer に苦戦します。ちょっと長いですがお付き合いください。 Generi
TypeScript での DI について - Qiita
本記事は、ぷりぷりあぷりけーしょんずアプリ開発担当による、ぷりぷりあぷりけーしょんず Advent Calendar 2019 の10日目の記事となります。 背景 マイクロサービスの簡単な勉強として、 RESTful API を Node.js で作成しようと開発を始めました。 また、静的型付にしたかったため、流行りの TypeScript を採用。あと、フレームワークでは王道の Express を使用します。 せっかくなので、クリーンアーキテクチャにも挑戦したいなというのもあり、そのアーキテクチャで設計や実装を始めました。 実装を進めていく上で、いちいち constructor で new するのが嫌だったのと、 interface の実態がなんなのかを１つのファイルで完結させたかった（まさに DI Container）というのがあり、なんかいいのがないのか調べたところ、 Inversi
vue-next（Vue.js 3.0 wip）+ TypeScript + webpackでの開発環境を構築する - Qiita
2020年のQ1にVue.js 3.0のリリースが予告されています。 公開に先駆けてVue 3.0の新機能を試したいと思い、TypeScript + Webpackでの開発環境を整えてみたのでまとめます。 （2020/06/04 追記） vue-cli-nextが出ているようです。 https://github.com/vuejs/vue-cli-plugin-vue-next （2020/02/04 追記） この記事で作った環境を使いVue3.0の新機能Suspense, Teleportを試しました。こちらも参考までに。 Vue.js 3.0 の新機能を試す。 〜 Suspense 編〜 Vue.js 3.0 の新機能を試す。 〜 Teleport 編〜 内容 vue-nextのREADME.mdで紹介されている以下リポジトリを参考に、Webpack版のVue.js 3.0の開発環境を
2020/07/28 時点の Vue 2.x + TypeScript について言える確かなこと - potato4d
できる・できないをまとめておく。 なお、 Class Component の記法は Vue 3 の仕様から Drop されたので、そこについて言及する場合はその旨を明確にする。 this の型について 基本的に全て有効化できる。 Vue 2.5 より this の型が正しく使えるようになっている。しかし、いくつかの条件がある tsconfig.json において、 noImplicitThis が true である必要がある 既存プロジェクトからの移行でない限りは strict: true であるはずなので、問題ない 逆に、既存プロジェクトの TS 化については、 noImplicitThis を false として Vue Template 以外の純粋な JavaScript 部分から段階的に移行できる。 computed などについて、戻り値を明示的に指定する必要がある これは Vet
TypeScript用のDIライブラリを公開しました - エムスリーテックブログ
エンジニアリンググループの冨岡です。 TypeScript向けのDIライブラリを公開したので紹介します。 github.com モチベーション Clean Architecture等の設計手法を使ってコードを書いていると、抽象に依存することが多くなってきます。 class CreateUserAccount { constructor(private userAccountRepository: UserAccountRepository) {} } const forProduction = new CreateUserAccount( new PostgreSQLUserAccountRepository( buildPostgreSQLConfig(process.env) ) ) const forTest = new CreateUserAccount(new InMemoryU
TypeScriptでnpmライブラリ開発ことはじめ - Qiita
この記事では、わざわざTypeScriptでnpmライブラリ開発したいという読者を対象としています。 とはいえ今どきはVS Codeさんという素晴らしいエディターのおかげもあって、型が提供されていないnpmライブラリは使いづらい立場にあります。 では早速ですが、TypeScriptで"Hello だれだれ"とコンソールに表示されるnpmライブラリを開発してみましょう。 基本的なnpmライブラリ開発の知識 この記事では「TypeScriptで」npmライブラリ開発することに主眼を置きたいため、基本的なnpmライブラリ開発の知識は「本当にやさしいnpmライブラリ開発入門」くらいは知っている前提で進めます。 package.jsonのあれこれ 私の趣味は人の書いたpackage.jsonを見ることです。（趣味悪いでしょうｗ） ではまずは今回お題にするpackage.jsonを見ていただきましょう
VueJS with typescriptでしばしば遭遇するProperty 'XXX' does not exist on type 'CombinedVueInstanceの解消法 - Qiita
みたいなエラーに遭遇します。 これはわりと有名な問題で検索すると色々な情報がひっかかるんですが、「結局どうすればええんや？」というところがわかりにくかったので整理してみます。 調査自体は趣味の範疇ですが、調査に使ったコードは仕事のものなのでコードサンプルはありません。ごめんよ。 何が起こっているのか？ VueJSで画面(またはコンポーネント)を作る場合、独自にprops, state, methodなどを定義していくわけですが、その際に型推論が効かなくなって「そんなメソッド(プロパティ)知らんがな」と、言われているのがこのエラーです。 同じようにコードを書いていても型推論が効いたり聞かなかったりするのでやっかいです。 ちなみにこのエラーが出ても実行自体には問題ありません。 安直な解決方法 手っ取り早く解決するなら型を無視するのが楽です。
TypeScriptプロジェクトに独自の型定義を配置する方法 - Qiita
概要 TypeScriptの開発において、型定義ファイルが用意されてないnpmライブラリを使うのは厄介なものです。 無理やり require("...") でJSのまま読み込ませてもいいですが、ちゃんとした型定義を使用したくなるときもあります。 作成した型定義ファイルは元のnpmライブラリに取り込んでもらい package.json の types で指定してもらう方法 1 と、 DefinitelyTyped に取り込んでもらい @types/*** パッケージとしてnpm installする方法がありますが、どちらも取り込んでもらうためにはPull Requestを投げたり、ライブラリのメンテナに新しいバージョンとしてリリースしてもらったりで時間がかかってしまいます。 Pull Requestは投げつつ、それが取り込まれてリリースされるまでの間、自分のプロジェクトで作った型定義ファイル
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く
Typescript with Laravel - Laravel News
suin・読者3万人『サバイバルTypeScript』公開中！ on Twitter: "#TypeScript 既存のURLオブジェクトをもとにして別のURLオブジェクトを作る小技 https://t.co/yd9I5DbGXx"
GitHub - supermacro/neverthrow: Type-Safe Errors for JS & TypeScript
GitHub - frouriojs/frourio: Fast and type-safe full stack framework, for TypeScript
GitHub - ics-creative/150810_threejs_mosaic: 「高機能なモーション制作用JSライブラリGSAP/TweenMaxを使ったタイムリマップ表現」の作例です
https://programmagick.com/blogs/node_typeorm/