新たなJavaScript日付操作ライブラリ「Tempo」登場 ー ネイティブなDateと直接連携、小さく、速く、使いやすく
先日リリースされた「[Tempo](https://tempo.formkit.com/)」が、全く新しいJavaScriptの日付／時刻ライブラリとして非常に注目を集めている。 先日リリースされた「Tempo」が、全く新しいJavaScriptの日付／時刻ライブラリとして非常に注目を集めている。 JavaScriptの日付ライブラリにはmoment.js、day.js、date-fnsなどがあるが、これらと異なるのは、ネイティブのDateオブジェクトを直接対象としていることである。 従来の日付ライブラリは、独自の日付プリミティブを提供することが一般的であったが、TempoではネイティブのJavaScript Dateオブジェクトと直接連携し、Intl.DateTimeFormatを活用することで、タイムゾーンやロケールのファーストクラスサポートを提供するだけでなく、ライブラリのサイズ削減
TypeScript のような構文で OpenAPI のスキーマを定義する TypeSpec
import "@typespec/http"; using TypeSpec.Http; model User { id: string; name: string; birthday?: utcDateTime; address: Address; } model Address { street: string; city: string; state: string; zip: string; } @route("/users") interface Users { list(@query limit: int32, @query skip: int32): User[]; create(@body user: User): User; get(@path id: string): User; } openapi: 3.0.0 info: title: (title) versio
仕事ですぐに使えるTypeScript — 仕事ですぐに使えるTypeScript ドキュメント
注釈 本ドキュメントは、まだ未完成ですが、ウェブフロントエンドの開発を学ぶときに、JavaScriptを経由せずに、最初からTypeScriptで学んでいく社内向けコンテンツとして作成されはじめました。基本の文法部分以外はまだ執筆されていない章もいくつもあります。書かれている章もまだまだ内容が追加される可能性がありますし、環境の変化で内容の変更が入る可能性もあります。 書籍の原稿はGitHub上で管理しております。もしTypoを見つけてくださった方がいらっしゃいましたら、 GitHub上で連絡 をお願いします 1 。reSTファイルだけ修正してもらえれば、HTML/PDFの生成までは不要です。フィードバックなども歓迎しております。 1 https://github.com/future-architect/typescript-guide/pulls
React Native v0.57がTypeScriptに対応したらしいので動かしてみた - Qiita
v0.57でいろいろ変わるという記事を書きましたが、本当にMetro BundlerがTypeScriptを食べてくれるのか半信半疑だったので、実際に試してみました。 結論 ビルドだけならゼロコンフィグに近い感じで行けました。型チェックをする場合はMSのブログでのやり方よりも、もうひと工夫必要です。 サンプルコード v0.57.0-rc.3でプロジェクトを作ってみました。これをベースにお話します。 前提条件：Babel 7のTypeScript対応の仕組み React NativeのTypeScript対応は、Babel 7のTypeScript対応に乗っかった形で実現されています。 ここで重要なのは、 Babelはtscを内部で実行するわけではない ということです。 今回導入された@babel/preset-typescriptは、FlowTypeの babel-plugin-flow-
Electronで漫画ビュワーを作った話 - Qiita
Electron、TypeScript、React を使って、なにか作りたかったので漫画ビュワーアプリを作りました。 開発環境や、使用したライブラリーなどを書いていきたいと思います。 GitHub: ElectronMangaViewer ※この記事のアプリのスクリーンショット内の漫画は、二次利用フリーの"ブラックジャックによろしく"を使用させて頂いてます。 タイトル:ブラックジャックによろしく 著作者名:佐藤秀峰 佐藤漫画製作所 からPDF形式版をダウンロードできます。 開発環境 プログラミング言語にはTypeScript、TypeScriptの静的解析ツールTSLint、モジュールバンドラにwebpack、コードフォーマッターにはPrettierを使用。 TSLintでもコード整形できますが、なぜPrettierを利用するのかと言うと以下のページを参考 Prettier 入門 ～ESL
JavaScriptとTypeScriptを共存させ、段階的に移行する方法
某サービスのフロントエンド開発に携わるようになってからずっと考えていることがある。 TypeScriptに移行して、型に守られたい！ ただ稼働しているサービスをいっきにTypeScriptに移行するのは危険で膨大な工数がかかるため、段階的に移行できないかと考えた。 ということでJavaScriptとTypeScriptを共存させる方法をまとめる。 環境は以下のとおり。 webpack@4.0.1 webpack-cli@2.0.9 webpack v3系の場合は不要 typescript@2.7.2 ts-loader@4.0.0 ※ あとでbabel-loaderについて追記予定です！ → 2018/03/23 追記しました 移行前の状態 極小サンプルを使って紹介する。 // src/main.js import { add } from './module' const result
最新版TypeScript 3.0+Webpack 4の環境構築まとめ(React, Vue.js, Three.jsのサンプル付き) - ICS MEDIA
TypeScriptはMicrosoftが開発するプログラミング言語です。JavaScriptのスーパーセットという位置づけで、静的型付けなど強力な言語機能を備えています。TypeScriptは高度なウェブアプリケーションの開発で使われることが多く、Google社内の標準言語として2017年に採用されるなど、注目が高まっています（参考記事『Google社内の標準言語としてTypeScriptが承認される － Publickey』）。 ▲TypeScriptの公式サイト TypeScriptはコンパイラによってJavaScriptのコードが得られますが、TypeScriptのコンパイラにはECMAScript Modules（ES Modules = importやexport文のこと）をまとめる機能が提供されていません。そのため、ES ModulesのJSファイルをまとめるモジュールバンド
TypeScript超入門(2)：構文を理解する - Qiita
TypeScript超入門：とりあえず動く環境を作るの続きです。とりあえず動く環境は作ったものの、読めない、書けない....。まずは基本の構文を理解しようと本やサイトを見てまとめた記事です。 この記事を書いた環境 tsc v1.6.2でコンパイル・検証しています 参考にしたサイト TypeScript早わかりチートシート【1.5.3対応】 相当わかりやすいのでこの記事よりこちらを参考にしたほうがいいと思います。 TypeScript Handsbook 公式マニュアル。 全部読めば理解できるんだろうけど、英語なのでちょっとツライです。 ES6 exploringjs TypeScriptはES6構文を積極的に取り入れています。 サンプルが多いので参考になります。 型の種類 Boolean
async await の使い方 - Qiita
これからはasync,awaitが読み書きできないと生きていけなそうだったので調べてみました。 ※コード例は一応TypeScriptですが、ほとんどJavaScriptです。 参考: async function - JavaScript | MDN
React Native for WebとExpoを組み合わせてピコピコさせてみたよ - Qiita
なかざんです。ウォーターセルという新潟の会社でアグリノートという農業向けアプリを作っています。 業務で使う構成のPoCとして、Webとモバイルネイティブの両方で動く、React Nativeのサンプルプロジェクトを作ってみたので、そこで得られた知見をご紹介します。 つくったもの 私たちが愛してやまないJetBrains製IDEのアイコンとボタンを並べて、ボタンを押すと製品ページに行けるアプリです。押したときにはピコッと鳴ります。 ソースコードはこちら。 https://github.com/Nkzn/react-native-multi-target-sample ネイティブ版はこんな感じです。 Webアプリ版はこんな感じ。 見てもらったほうが早い 今回は実物を触ってもらいやすい環境が作れたので、実際に触ってみたほうが雰囲気がつかみやすいと思います。 ネイティブ版 ネイティブ版はExpoで
ビットコイン自動裁定取引システムをC#からNode.js+TypeScriptに移行(Mac OS, Linux対応) - Qiita
Node.js+TypeScript環境に移植 以前の投稿で紹介したビットコイン自動裁定取引システムをNode.jsに移行しました。 R2 Bitcoin Arbitrager https://github.com/bitrinjani/r2 移行した理由は以下の2つです。 Windows以外のOSのサポート (Mac OS, Linux) 別の投稿で紹介した可視化Web UIとの統合(未実装) 数千行のC#をTypeScript/JavaScriptへ書き換えることは、言語仕様のみならず、ランタイムの非同期処理の違いなど予想以上に学ぶことが多く、それは別の投稿で紹介したいと思います。 インストール方法 1) Node.js 8.5以降をインストール 2) リポジトリをクローン
型なき世界のためのflowtype入門 - Qiita
http://qiita.com/mizchi/items/3bbb3f466a3b5011b509 で紹介したモダンJSスタックの上に、flowtype を導入して型をボトムアップに追加していくアプローチを紹介します。 なぜflowtypeか、そのゴールは 流行っているライブラリのみを組み合わせて使う場合や、バックエンドとの連携において型が十分に提供される環境なら、正直、flowtypeよりtypescriptでいいと思っています。flowtypeが力を発揮する環境は、既存のJSが大量に存在する環境や、railsなどの動的な型のフレームワーク環境で、静的な定義が抽出できない環境だと思います。 よほど品質が低いライブラリを使わないかぎり、バグはほとんど自分が記述したコードによって発生します。なので、まずは「自分が書いたコードのIFを明確にし、その静的なチェックを行なう」、というのを最初の目
Reduxの概念をRxJSとTypeScriptで理解する(初心者向け) - Qiita
(2016/12/15追記) この記事はDeprecatedです。 Reduxの概念をRxJSとTypeScriptで理解する ver.2 が最新版になります。 GitHubリポジトリはこちら → ovrmrw/understanding-redux-with-rxjs git cloneしたらnpm installしてnum run tsですぐに動かせます。 (注: Reactの話は一切出てきません) Reduxとは Redux公式 アプリケーション全体で状態(state)を一つのJSONツリーの構造で持ち、それをActionがキックされる度に全体更新して配信するという概念。 僕は最初FluxとかReduxとかよくわからなかったけど、色々参考にしながら自分で書いてみたらようやく理解できました。 Middlewareという概念はよくわからなかったし今でもよくわかりません。 ロガーとか便利な
オープンソースなリアルタイムチャットシステム "respass" を3週間で作った - Sketchglass Blog
WebSocketを用いたオープンソースなリアルタイムチャットシステムrespassをリリースしました。 TL; DR 無職2人が3週間で https://respass.sketch-glass.io/ を作りました。 ソースコードはGitHub上で公開されています。 github.com 自己紹介 @minamorl 無職 Pythonエンジニア GitHub @seanchas_t 無職 C++/TypeScriptエンジニア GitHub はじめに この記事は主に技術者に向けて書かれていますが、そうでない方にも読めるような表現を重視しています。難解な用語にはなるべく注釈をいれました。技術的な話よりも「無職2人がいかにして3週間で作り上げたのか？」という開発フローの話に重きをおいたので、非技術者の方にも楽しく読んでいただけると思います。 なぜ作ったか オープンソースなチャット 近年、
素のJavaScript（TypeScript）でMVCモデルのToDoアプリをつくってみた
photo by Sébastien Barré AngularJSやBackbone、KnockoutJSといったMV*フレームワークや、ReactといったVに特化したフレームワーク、jQueryといったライブラリがいっぱいある。 AngularJSを勉強し始めたは良いが、2.0になると全く別モノになってしまうなど、どれを勉強すればよいかわからなくなってしまった。 ということで、まずはフレームワークやライブラリを使わない「素のJavaScript」でMVCモデルを勉強してみようと思った。 つくったToDoアプリの概要は、前回の「TypeScript + AngularJSでToDoアプリをつくってみた」と同じだ。 ※ 以降TypeScriptで記載しているが、JavaScriptのソースが見たい方はGitHubにコンパイル後のソースを置いてあるので、そちらを参照ください。 Model層
AngularJSモダンプラクティス - Qiita
Help us understand the problem. What is going on with this article? こんにちは、@armorik83です。私のAngularJS歴は2年弱で、これまでAngularJSに関する記事はQiitaにたくさん書いてきました。例えば次のような記事です。 AngularJSアンチパターン集 2014.9 ここらでDirective Scopeの@=&をまとめておきたいと思う 2014.9 TypeScriptで書くAngularJSのMVC 2014.2 AngularJS Directiveの処理順を網羅してみた 2014.12 他にもニッチなものやイマイチだったものも含めてけっこうな数となってきました。また、こういった記事の縁で勉強会でも登壇させて頂きました。 モダンAngularJS 2014.12 GDG中国 TypeScr
TypeScriptで始めるNode.js入門 - ICS MEDIA
みなさんは普段Node.jsをどのように使っていますか？ サーバーサイドで動くJavaScriptであるNode.jsは、Socket.IOと連携してリアルタイムなウェブコンテンツを作ったり、webpackやgulpのようなフロントエンドエンジニアのツールとして使われたりとさまざまな場面で活用されています。 Node.jsで大規模な開発をする場合、TypeScriptを採用して開発の生産効率性・保守性を上げるのもオススメです。WebStormやVisual Studio Codeを使えばコード補完が効くためプログラミングの効率が劇的に向上し、TypeScriptの静的型付けによってコンパイル時型チェックが行われるので安全性が増します。Node.jsを使って中・大規模なシステムを構築するときはTypeScriptを検討するといいでしょう。 今回はNode.jsをTypeScriptで記述する
【javascript】やさしいクラスの作り方 - Qiita
勉強がてら。「TypeScript使えばいいじゃん」「ES6」とか言わないで。 hogeクラスをつくるとき 1. 一般的なつくりかた // constructor var hoge = function(arg) { this.x = 5; this.y = 10; this.z = arg; }; // メソッド hoge.prototype = { f1: function() { return true; }, f2: function() { return false; } }; var instance = new hoge(1); // hoge {x: 5, y: 10, z: 1, f1: function, f2: function} var hoge = (function() { var FOOFOO = 777; // クラス内定数 // constructor v
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く
TypeScript 練習問題集
https://qiita.com/kent_ocean/items/3025263c0539000290ff