Conditional Types in TypeScript
January 9, 2019TypeScript 2.8 introduced conditional types, a powerful and exciting addition to the type system. Conditional types let us express non-uniform type mappings, that is, type transformations that differ depending on a condition. #Introduction to Conditional Types A conditional type describes a type relationship test and selects one of two possible types, depending on the outcome of tha
Improved Redux type safety with TypeScript 2.8
Disclaimer: This post was created 35000 feet above the ground in the sky, during my return flight from awesome Japan and yes that guy in the title picture is me, ridding the best powder on the planet in Japan :D ( sorry I just had to do this, you can hate me later ok? / later === after reading this post ) Some time ago I wrote about how to effectively leverage TypeScript to write type-safe action
Ultimate React Component Patterns with Typescript 2.8
This blogpost was inspired by React Component Patterns post live Demo If you know me, you already know that I don’t write javascript without types, so yeah I’m really into Typescript, since version 0.9. Beside typed JS I really love React, and when React + Typescript are combined, I just feel like in heaven :D. Full type safety within whole app and VDOM templates it’s just marvelous and joy to wor
Typescript + React、Firebase Hosting & Functions、Github GraphQL APIを使って自分のポートフォリオサイトを作った。
構成は下記の様にした。 Typescript 2.6 & React 16.0Firebase Hosting & Cloud Function、RealtimeDatabaseGithub API v4 (GraphQL with Apollo Client)Typescript & React今JavaScriptを利用するとしたらTypescript or Flowtypeになると思う。 Flowtypeは会社で使っている & 自作のOSSで利用した事があった。 http://teitei-tk.hatenablog.com/entry/2017/06/19/192432
Type-level TypeScript - ryota-ka's blog
この記事は以下のページに移転しました． blog.ryota-ka.me この記事は CAMPHOR- Advent Calendar 2017 の21日目の記事です． @ryota-ka です．普段は HERP という会社でリードエンジニアとして働いています．一昨日19日にサービスのティザーサイトを公開したばかりなので見てください． herp.cloud さて，12月といえば，万人受けしなさそうなネタでブログを書いては「はてブが付かねえ」と文句を言う季節ですが，今年もそういう方針で，TypeScript での型レベル計算について書きます．型レベルでの自然数などが定義できると，リストに型レベルで長さを付けることができて，空リストの先頭の要素を取ろうとしてランタイムで落ちる，という悲劇が生じる可能性をコンパイル時に排除できてとても嬉しいですね． なお，使用している TypeScript のバ
Redux & Typescript typed Actions with less keystrokes
a.k.a how to leverage discriminant unions and not get controlled by type system I’ll be honest with you, I don’t write JavaScript without types, ever, so yeah I’m heavy Typescript user and time to time I play with Flow to see how the project evolves ( IMHO still the best option for typed JS is Typescript as of today, because various reasons…, but Flow is really on par nowadays and getting better e
私的TypeScriptとの関わり方ガイドライン - 角待ちは対空
初めて書く時困りそうなトピックごとに TypeScript との関わり方を示していく。導入や書き始めのハードルを下げるのが目的なので意識高いことは言わない。 https://github.com/remojansen/logo.ts 対象読者 ゴール 基本姿勢 何故そんなこといい加減な感じなのか 型の書き方 type annotation シグニチャ 型が合わない時 Structural typing any したい キャスト色々 キャストせざるを得ない時 import できない error TS2307:Cannot find module 'hoge'. error TS1192: Module '"hoge"' has no default export. や error TS2305: Module '"hoge"' has no exported member '_'. など 頑
TypeScript✕ReactJSで型安全なComponentを手に入れる
React.Proptypesに感じている不満React組み込みのProptypesによる型検査は、実行時検証であり、アプリケーションを起動して、実際にコンポーネントを描画してみるまでエラーに気づけない。 また、React独自の機能であるので、他の下層DOMライブラリでも同様の型検査をできるわけではない。 さらに、Proptypesはコンポーネントに定義するので、型定義がViewに紐付いてしまう(ドメイン知識がViewに紐付いてしまう) 型定義の多くはドメイン知識に紐付いており、ViewではなくModel(State)レイヤーで定義したい。 そこで本稿ではTypeScriptの静的解析の支援を受けて、型安全なコンポーネントを定義することでこの問題を解決する方法について説明したい。 ※なお、ReactにはFacebook謹製のFlowTypeがあるが、あくまでアプリケーションの主体はMode
TypeScript の型定義ファイルと仲良くなろう - Hatena Developer Blog
この記事は2016年に書かれた古い記事です。当時はまだTypeScript2.0も出ていないころで今とは状況がかなり異なっています。参考にする場合注意してください。 はじめに TypeScriptの型システム Declaration space Open-ended ここまでの確認 型定義ファイルを読み書きできるようになるために declare キーワード 既存のオブジェクトの型定義を拡張する グローバルなオブジェクトに対する宣言 module Export Assignments Relative or Non-relative module imports ES2015形式 実際の定義ファイル 既存の定義ファイルを拡張する declare global { } について Typings について おわりに インターン募集中 はじめに こんにちはアプリケーションエンジニアの id:t_k
The Future of Declaration Files - TypeScript
Declaration files (.d.ts files) are a fundamental part of using existing JavaScript libraries in TypeScript, but getting them has always been a place where we’ve known there was room for improvement. As we get closer to TypeScript 2.0, we’re very excited to show off a sneak peak of our plan to simplify things. Getting type declarations in TypeScript 2.0 will require no tools apart from npm. As an
flowtypeの実現する実行時例外のない世界 - Please Drive Faster
今日こんなスライドを見かけた。 djcordhose.github.io これはtypescriptとflowtypeの違いがよく分かるすごく良いスライド。 このスライドの5ページ目に以下の1文がある。 FLOW SOUNDNESS, NO RUNTIME EXCEPTIONS AS GOAL スライドに刺激を受けたのと、最近flowtypeを触っていたのもあって、これが何を指しているか書きたくなった。 実行環境 flow: 0.26.0 typescript: 1.18.10 Flowtypeのきほん 以下のjavasciptのプログラムをflowにかけてみる。 function foo(x) { return x * 10; } foo('Hello, world!'); $ flow flow.js:5 5: foo('Hello, world!'); ^^^^^^^^^^^^^^^
TypeScriptでのフロントエンド開発環境作成総まとめ - $shibayu36->blog;
これまで自分のブログで、TypeScriptを使ったフロントエンド開発環境についてブログをいくつか書いてきた。ひとまずこの辺りで、TypeScriptでフロントエンドを開発するための最低限の環境を構築できるようになったので、総まとめとしてブログエントリを書いておく。 今回のサンプルコードは https://github.com/shibayu36/typescript-project-sample/tree/4653cd002eef3ee1946a2ca1da344e0076b2844f に置いたので参考に。 これまでの記事 EmacsでTypeScript環境を整える - $shibayu36->blog; JSをbrowserifyでビルドし、ライセンスコメントを適切に残す - $shibayu36->blog; gulp + browserify + tsifyを利用してTypeSc
JSをbrowserifyでビルドし、ライセンスコメントを適切に残す - $shibayu36->blog;
最近JSを利用するときは、依存モジュールはnpmを利用し、ES6やTypeScriptの仕様を開発には使った上で、ブラウザ用にコンパイルして配信するようになってきている。また同時にネットワークの負荷を下げるためにminifyを行う場合もある。 minifyはライセンスが絡むと少し難しい。例えばコメントを全て削除してしまうとライセンスコメントまで消えてしまう。この問題にはみんながそれぞれの手法で対処しているみたい。1年ほど前の記事でクライアントサイドJavaScriptのライセンス管理 | エンジニアブログ | GREE Engineering というものがあり、いろんなJSのコンパイルのためのライブラリが独自でライセンスの形式を決めていて、それにマッチしないものは消えてしまう、みたいな辛いことが起きてそうだった。 そこで今回は自分の勉強も兼ねて、npmのモジュールを含めてブラウザ用にコンパ
1
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く
https://www.wolksoftware.com/blog/working-with-react-and-typescript