You signed in with another tab or window. Reload to refresh your session. You signed out in another tab or window. Reload to refresh your session. You switched accounts on another tab or window. Reload to refresh your session. Dismiss alert
Effect-TS は、開発者が複雑なエラーや非同期処理をより安全に開発できるようにすることを目的とした TypeScript ライブラリです。Effect-TS は、TypeScript の型システムを活用して、本番のアプリケーションにおける実用的な問題を解決することを目指しています。 Effect-TS(正式名称は Effect)は、開発者が複雑なエラーや非同期処理をより安全に開発できるようにすることを目的とした TypeScript ライブラリです。Effect System という概念を取り入れており、Scala や Haskell といった関数型プログラミング言語に影響を受けています。 TypeScript の型システムを活用して、本番のアプリケーションにおける実用的な問題を解決することを目指しています。Effect-TS は、以下のような特徴を備えています。 並行性(concu
はじめに 私の仕事は、新規サービスをまるっといい感じに開発するのを委託されることがほとんどです。最近はネイティブアプリを作ることよりもブラウザで動くWebサービスを開発することが多いのですが、案件の規模感や要求によって技術選定を少し変えるようにしています。「こういうときはこう」みたいに一概には言えないのですが、普段使う構成を紹介します。誰かの参考になれば幸いです。 2022/02/10 現在での内容です。 前提 開発を委託される場合の運用費をどうするの問題があります。クライアントにクレカ登録をしてもらうか、こちらで支払って毎月請求するかになります。僕は毎月やるのがめんどくさいのでできるだけ前者に倒している関係上、あまりいろいろなSaaSを組み合わせて作ることをなるべく避けています。 規模感によらず使っているもの 私の場合、以下が使えるとめちゃくちゃ効率よく開発できます。 GCP 好きだから
こんにちは。ソウゾウのSoftware Engineer(CTO)の@suguruです。連載:メルカリShops 開発の裏側 Vol.2の1日目を担当させていただきます。 去年、2021年に開始した メルカリShopsの技術スタック についての記事を書きましたが、今回はリリースまでに採用した技術スタックが、半年通してどのようにアップデートしてきたかを共有したいと思います。 ローンチ時に採用した技術が、実際の運用でどのように変遷したのかを共有することで、技術スタックを考える際の何らかの参考になれば幸いです。 monorepo メルカリShops ではサービスに必要なコードを1つに集約する monorepo を採用しています。リリース後半年たってコード量はかなり増えてきましたが、monorepo に対する満足度は非常に高く、うまく機能しています。 サービス全体の見通しが良くなることと、すべての
Popular Documentation PagesEveryday TypesAll of the common types in TypeScript Creating Types from TypesTechniques to make more elegant types More on FunctionsHow to provide types to functions in JavaScript More on ObjectsHow to provide a type shape to JavaScript objects NarrowingHow TypeScript infers types based on runtime behavior Variable DeclarationsHow to create and type JavaScript variables
はじめに ANDPADでフロントエンドの開発を担当している小泉です。 前回、約3ヶ月前にVue Composition APIをチームで導入して得られたメリットという記事を書かせて頂きました。 その後、今年の5月頃からまた新たなプロダクトの立ち上げを担当する機会があり、フロントの技術選定についていろいろ検討する中で、Vue.jsでもJSXを使って書けること、かなり導入しやすくなっていることを知りました。 そこで、Nuxt Composition API + TSXという組み合わせを採用してみたところ、かなり使いやすく、Vue と React のいいとこ取りができて最高 なのではないかとさえ思いました。 この記事では、そんなVue + TSX の導入方法と、メリット・デメリット、そして使う際のTipsをいくつか紹介しています。今後のフロントエンドの技術選定や、Vue + JSXでの開発に興味
最近2分間コーディングのすすめ、コードを書く習慣のハードルを下げるに触発されて2分間コーディングをやってみている。まずは昔興味が出ていたReactを自作しようをやってみたのでメモ。 やった様子は https://github.com/shibayu36/building-own-react に置いた。メインファイルは https://github.com/shibayu36/building-own-react/blob/main/src/index.tsx create-react-appしたままだと色々おかしくなったのでejectして手直ししたり、JSXのtranspileを置き換えるためにwebpackの設定を少しいじったりしたところが苦労した。そのあたりについては https://github.com/shibayu36/building-own-react/commits/mai
openapi-generator-cli を利用すると、OpenAPI 定義から TypeScript で利用可能なアセットを生成することができます。しかし最適な成果物を得るためには、OpenAPI 定義自体に少し工夫が必要で、一筋縄にはいかないことがあります。 本稿及びサンプルリポジトリでは、openapi-generator-cli と TypeScript 4.2 の新機能を活用したアプローチを紹介します。 課題点の確認 OpenAPI 定義にあたりresponsesフィールドのschemaに対し、インラインで定義を追加することが多いのではないでしょうか?OpenAPI を定義する GUI 「Stoplight Studio」 などでは、このインラインスキーマ定義が直感的で使いやすく、yaml を直接編集しなくても良いなど、開発に重宝します。 responses: "200": d
// Good: choose between two options as appropriate (see below). import * as ng from '@angular/core'; import {Foo} from './foo'; // Only when needed: default imports. import Button from 'Button'; // Sometimes needed to import libraries for their side effects: import 'jasmine'; import '@polymer/paper-button'; Import paths TypeScript code must use paths to import other TypeScript code. Paths may be r
Editor’s note: This article was updated 27 September 2022 to include information about state patterns and anti-patterns in TypeScript, as well as to make general revisions to the article. Design patterns are solutions to recurring problems in software application development. There are three fundamental types of design patterns, and within each one a number of unique patterns to choose from. In th
export type Param = { action: string; created_at: string; status: "Failure" | "OK"; version: number; } というinterfaceを生成してくれるライブラリです。jsonタグを見ます。 つまるところ、OpenAPIやgRPCを利用すればGoとTypeScriptで共通の型を利用できますが、それをもっと手軽にGoの型からTypeScriptのinterfaceを生成できたら便利そうだな、というのが開発した理由です。 類似のライブラリはあったのですが型解析のために一度コンパイルし、reflectを利用した型解析をしており一時ファイルを生成していました。そのためあまり使い勝手が良くなく、また実行に時間がかかるなどの問題があったため独自で作ることにしました。 Goの静的解析 Goでは静的解析ツールを
* こちらはオプトテクノロジーズ社内勉強会での発表資料になります TypeScript リポジトリの歩き方 TypeScript のコードリーディングのはじめの一歩としてどこから手を付ければ良いのかを知る手助けになればと思いこさえました 目次 コードベースの概観についてドキュメントから知る 実装のエントリポイントから読み進める 動かして試す 自分が実際にコードリーディングしたときの例 コードベースの概観についてドキュメントから知る まず TypeScript の内部アーキテクチャの概観について知っていきましょう TypeScript の wiki が大変参考になります Architectural Overview: コード上のコンポーネントを図示しつつ説明している Layer Overview や全体で利用されているデータ構造を説明する Data Structures といった、実装を理解
Deleted articles cannot be recovered. Draft of this article would be also deleted. Are you sure you want to delete this article? 先日以下ツイートをしたら思いの外良い反応もらえたので、より詳細な紹介記事を書いてみました。 これは必見だわ!! TypeScriptの型についての問題集 想定に従って独自のユーティリティ型を作っていく感じの問題がレベル別に提供されてる Playgroundのリンクから手を動かしながらチャレンジできるので凄くやりやすい (自分はeasyの問題でも分からんのあった。頑張ろ😅)https://t.co/tkEFe7VrBQ — Kawamata Ryo (@KawamataRyo) September 3, 2020 type-challe
本記事はsudachiclone-rs開発の続編であり、Rustのコードをwasmにし、WebWorker内で状態を持ったまま使いつつ、Typescriptで開発する、ということをやる場合にハマりそうなところに悉くハマった気がするので、その備忘録です。 成果物 レポジトリ: Rustで開発したsudachiclone-rsをwasmにコンパイルし、WebWorker内で動くようにしたもののデモ。 デモページ: 上記をhostingしています。pipから辞書を取ってきてブラウザ上のみでわかち書きできるデモ。 使ったツール群 typescript-definition Rustのstructやfunctionからtypescriptのd.tsを生成してくれる優れもの。crates.ioにあるのもを使っていないのは今のRustでは動かないから。(詳しくはissue参照) wasm-bindgen
この記事のソースコード: https://github.com/knjname/2020-09-03_growingtsd TypeScriptプロジェクトのコンパイルが終わらない! こんにちは型に弱いマンです。 CIでTypeScriptプロジェクトのコンパイルが1時間たっても終わらなかったことはありませんか? 私は何度かあります。 TypeScript的に行儀の良い(?)フレームワークを使っている方は、おそらくそういう現象に遭うことは少ないと思います。 行儀の悪い(?)フレームワークをハードに使っている方は、こういうことに遭う確率が高いと思います。 具体的にどういうフレームワークかというと、下記のようにコードで動的に型を紡ぎ出す系のフレームワークですね。 (mobx-state-tree なんかが該当します。) export type ItemDefinitions<D = {}> =
Deleted articles cannot be recovered. Draft of this article would be also deleted. Are you sure you want to delete this article? TypeScript全然わかんない... という状態から、プロジェクトに導入できるまでになんとかなったので、 学習の参考になったものなどをまとめて学習ロードマップを作成いたしました。 私自身もまだまだのレベルですが、これからTypeScriptを勉強したい!という方の道しるべになれば幸いです Level 0: TypeScriptってなんぞや? まず学習する前に、その対象がなんなのか、を見極める作業です。 TypeScriptは altJS の1つです。 JSは元々大規模なコードを組むには不向きな設計になっているので、 altJSという
つい先日 beta リリースされたフロントエンドのツールチェインの Rome について、その思想とコードを読んだ結果の現状について。 Rome Frontend Toolchain この記事は公式ドキュメント以外にもソースを読んで得られた undocumented な部分も含んでいるので、すぐ古くなる。その前提で読むように。 問題の認識とその解決手段 フロントエンドの最適化は実行前のプリプロセスに、エコシステムの開発リソースの多くが当てられている。Node のツールチェインが発達するにつれて、自前の パーサ+AST 定義を持つ実装が増えていった歴史がある。 acorn(estree) babel prettier typescript terser それぞれのツールの生成する AST はそのツールの都合で微妙に/もしくは大幅に定義がずれている。typescript に至っては完全に別物。こ
高性能なテーブルを実装できる、シンプルで軽量のJavaScriptライブラリを紹介します。HTMLテーブル、ページネーション、検索機能、ソート機能、XMLやJSONからインポートなどに対応しています。 React、Angular、Preact、Vueなどの主要なフレームワークのプラグインとして動作するだけでなく、フレームワークなしのバニラJavaScriptでも使用できます。 Grid.js Grid.js -GitHub Grid.jsの特徴 Grid.jsのデモ Grid.jsの使い方 Grid.jsの特徴 Grid.jsは高性能なテーブルを実装できる12Kbの超軽量のJavaScriptです。 シンプルで軽量な実装。 人気が高いすべてのJavaScriptフレームワーク(React、Angular、Vueなど)で使用できます。 フレームワークなし(バニラJavaScript)でも使用
I recently decided to switch the engine of Boardgame Lab from TypeScript to Rust. The application itself is an SPA written in Svelte. I only switched the logic that updates the game state to Rust. Here is a summary of my experience with the transition: Isomorphic ArchitectureOne of the advantages of using JavaScript or TypeScript is that you can run the same code on both client and server. For Boa
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
処理を実行中です
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く