React + TypeScript (+ Electron)でアプリを書き始めるときにやってること - QiitaDeleted articles cannot be recovered. Draft of this article would be also deleted. Are you sure you want to delete this article?
JSのグラフライブラリを今選ぶならHighchartsで決まり（2020年版） - Qiita
トレンド（世界）：すべての国/過去12か月/基準としたキーワードを外さずに数値を取得 トレンド（日本）：日本/過去12か月/基準としたキーワードを外さずに数値を取得 #Highcharts 公式サイト：Interactive JavaScript charts for your webpage | Highcharts デモサイト：Demos / Stock Demos / Maps Demos / Gantt Demos GitHub：https://github.com/highcharts/highcharts npm：https://www.npmjs.com/package/highcharts CDN：https://code.highcharts.com/highcharts.js ライセンス：商用利用は有償、非営利向け無料ライセンスあり（詳細後述） 推薦しておきながら入門記
Angular+Cognitoのユーザー認証付きSPAのサンプル - Qiita
はじめに Angularで作るSPAにCognito認証を組み込むサンプルを作りました。 ログイン・ログアウトだけではつまらないので、ログイン時に使えるS3ファイルアップロード機能も追加しています。 awslabsから公開されているaws-cognito-angular2-quickstartというサンプルが大変参考になりました。 作っていく AWS側の準備 S3バケットの作成 Cognito Identity Pool に設定するロールの設定に、アクセス許可をするS3の情報を記載する必要があるので、事前にS3バケットを作成しておきます。 今回は、 angular-cognito-s3-file-uploader という名前のバケットを作成しました。 バケットポリシーと、CORSの設定は以下のとおりです。 { "Version": "2008-10-17", "Id": "PolicyFo
Riot.jsのコンポーネント間データ渡し - Qiita
Reactを触った経験を元にRiotに手を出しています。 コンポーネント指向で開発したくても、AngularやReactはビルドツールが複雑な印象を持たれており、拒否反応がある社内の古参開発者には勧めにくいと感じていました。Riotはscriptタグベースで始められるので、コンポーネント指向入門としては敷居が低くその点が魅力的ですね！Riotで感覚を掴んでもらえれば「今度はReact試してみる？？？」という気運も高まってきそうです。 今日はRiotを使ったコンポーネント間のデータ連携を整理してみたいと思います。 データ渡しのパターン ざっと調べた限りでは以下の4パターンがあるみたいです。 属性渡し tags経由渡し parent渡し Observer渡し 属性渡し 独自タグの属性に値を渡す方式です。
ビットコイン自動裁定取引システムを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) リポジトリをクローン
素朴な Angular 向けの type safe で immutable な Flux Store - Qiita
TL;DR タイトルまんまですが、TypeScript と RxJS だけで、type safe で immutable な Flux パターンが実現できるよ、って話です。Flux Store の実装はコメント入れても 40 行未満です。 PoC 的に作ってみましたが、Angular が適合するユースケースでは、あまり必要な場面はありません。 2018-10-06 この古い記事に「いいね」もらったので、現時点のオススメフレームワークを追記 2017-06-15 末尾にクライアント状態管理が必要になる場面についての考察を追記 動機 flux の考え方はいいけど、type safe で immutable, rxjs ベースの素朴な Store が欲しかった redux の switch 文は何が嬉しいの？ immutable.js も無駄に大きいし... Akita (2018-10-06
Riot.jsで配列を飛ばしつつ回すと、正しいインデックスが取れない - Qiita
Riot.jsを使っていろいろ組んでいたのですが、ちょっと想定外の挙動を食らってしまいました。 each Riotのタグ内では、eachを使って配列を展開することができます（オブジェクトにも使えますが、今回の話題と関係ないので、とりあえずそちらは省略します）。 公式ガイドにも例が上がっていますが、 each={ arr }…arrの中身をオブジェクトとしてタグ内に展開 each={ item in arr }…arrの各要素をitemとして取得できる each={ item, i in arr }…arrの要素はitem、インデックスはiとして取れる というようになっています。ただ、実際には最後のものに落とし穴がありました。 配列を飛ばしてみた Riotのタグ内で直接使える制御構造はeachとifだけですが、「eachで回しつつ、ifで一部だけ取る」ようなことをしたくなることがあります。そ
TypeScript 2.6.1 変更点 - Qiita
訂正1: コメントで指摘があった Contravariant→反変では？ を反映。coとcontra… こんにちはソウゾウ社に転職しました@vvakameです。 今回は結構気持ちよくなる更新が多いです。 TypeScript 2.6.1がアナウンスされました。 What's new in TypeScriptも更新されているようです。 破壊的変更もあるよ！ 変更点まとめ 関数の引数の型についてのチェックを強化 Strict function types (d: Dog) => void 的な関数を (a: Animal) => void 的な変数に突っ込めてたのを弾けるようになった タグ付きテンプレートリテラルがキャッシュされるようになった Cached tagged template objects in modules よりECMAScriptの仕様に準拠した形 関数の第一引数に渡され
HoloLens、Firebase、Node.js、irMagicianを使ってテレビを操作する - Qiita
こちらの記事を参考にさせて頂き、HoloLensを使ってテレビの電源をON/OFF出来るようにしてみました。 処理の流れ 使ったもの HoloLens Raspberry Pi zero w irMagician テレビ 実装イメージ HoloLens x Firebase x Node.js x irMagicianでテレビの電源を操作してみた。 リモコン使ったほうが早いですけどねｗ #HoloLens #HoloLensJP #MR #Firebase #Nodejs pic.twitter.com/gxv5oW4Anb — がおまる@HoloLens研究者 (@gaomar) 2017年10月31日 irMagicianの準備 irMagicianをRaspberry Piで使えるように設定します。 irMagicianの使い方、Node.jsモジュールのインストールについては以下の
Angular2のRouterを触ってみる - Qiita
はじめに 大規模なSPAでは必要不可欠なルーティングの機能をAngular2で試してみます。 Angular2の2.0.0-beta.0を使います。 Router まずは最小限の例を示しましょう。 beta.0で更新された5 MIN QUICKSTARTを参考にディレクトリ構成は以下のようにしています。 my-app ├ node_modules ├ app │ ├ app.component.ts │ ├ page1.component.ts │ ├ page2.component.ts │ └ boot.ts ├ index.html ├ package.json └ tsconfig.json <html> <head> <title>Angular 2 QuickStart</title> <script src="node_modules/angular2/bundles/ang
2017年のJavaScript開発で知っておきたい用語集/リンク集 - Qiita
JavaScriptを本格的に学ばねばならぬときがきたので、よく知らなかった用語を調べた。 基本的に大項目のリンク先は公式ページ。参考記事は詳細に別途リンクを貼る。 HOTなツールを知りたいときは2016 JavaScript Rising Starsを見るとよさそう。 更新履歴 2017/10/31 11:00 : その他ライブラリの項を追加 2017/10/31 12:00 : ECMAScriptの説明を大幅に修正 2017/10/31 23:00 : CSS関連のLoader, 開発に便利なライブラリを追加 基本用語 Node.js ネットワークアプリケーションを作成するためのJavaScript実行環境 非同期型のイベント駆動 nvm (Node Version Manager) Node.jsのバージョン管理システム V8 (Google V8 JavaScript Engin
Vue.jsミニハンズオン（TODOリストにアニメーションをつける） - Qiita
Vue.jsミニハンズオン（TODOリストにアニメーションをつける） AngularでもReactでもriot.jsでも満足できなかったひとに、ぴったりフィットなJSフレームワーク「Vue.js」のざっくりハンズオン第２回目です。 第１回目は「Vue.jsミニハンズオン（TODOリスト作成）」をご覧ください。 このハンズオンではnode.jsのパッケージは使わず、Google ChromeとテキストエディタがあればOKです。 Vue.jsミニハンズオンのシリーズは以下を公開しています。 Vue.jsミニハンズオン（TODOリスト作成） Vue.jsミニハンズオン（TODOリストにアニメーションをつける） Vue.jsミニハンズオン（TODOリストをコンポーネント化する） 今回の目標 目標は第１回目で作ったシンプルなTODOリストにアニメーションをつけることです。 まずはシンプルなアニメーシ
Angular,Angular CLIメモ - Qiita
フロントエンド（HTML/CSS/JavaScript）さっぱりな人にはAngular CLIは救世主である。webpackの設定とか今のところ知らなくても良い。先ずはnpm, Angular, TypeScriptのみを気にするだけで良くなる。 Angular CLIをインストールすると、ngコマンドが使えるようになる。ngコマンドでプロジェクトのひな型作成や、component, service, pipe, etc.もngコマンドで追加していけるので一定の作法に沿って開発することができる。 Angular 公式ドキュメント https://angular.io/docs/ts/latest/ Start Angular 日本語。最初に読みたい。 ng-book 2 英語。有料。Angular 4対応 The Ultimate Angular CLI Reference Guide A
angular.io Guide: Dynamic Component Loader - Qiita
これは、Angular の公式ドキュメントの Dynamic Component Loader の章 を意訳したものです｡ 駆け足で翻訳したので至らない点もありますが、あしからずご了承を｡ バージョン 4.2.6 のドキュメントをベースにしています｡ Dynamic Component Loader コンポーネントテンプレートは常に固定されている訳ではありません。アプリケーションは、実行時に新しいコンポーネントをロードする必要があります｡ このクックブックでは、ComponentFactoryResolver を使用してコンポーネントを動的に追加する方法を説明します。 このクックブックのコードの ライブサンプル/サンプルをダウンロードで、確認できます｡ Dynamic component loading 次の例は、動的広告バナーを作成する方法を示しています。 ヒーローエージェンシーは、いく
Vue.jsってどうやったら綺麗に使えるのよ - Qiita
前置き ・LaravelついでにVue.jsを使うことになった ・公式のドキュメントを流し読み ・とりあえずコンポーネントで分けてみるか ・カオスwwww というわけで、根本的にどうVue.jsを使っていいか分かっていないようなので、 どうすれば「俺はVue.jsを使ってるぜっ！」 と言えるのか試行錯誤してみる。 事の始まり 簡単な検索ページでも作ってみる <div> id<input type="text"> name<input type="text"> </div> <div> <input type="button" value="検索"> </div> <br /> <div> <table border="1"> <tr> <th>id</th> <th>name</th> </tr> <tr> <td>1</td> <td>たかし</td> </tr> </table> </
@ngrx/storeと@ngrx/effectsの使い方 - Qiita
NgRx v9に対応しました NgRxはAngularアプリケーション用の状態管理ライブラリです。 本記事では、簡単なサンプルを通して@ngrx/storeと@ngrx/effectsの使い方を紹介します。 ※ サンプルはNgRx v9系で書かれています この記事の対象者 Angularを利用している方 Angular + RxJSで状態管理をしたい方 NgRxを触ってみたい方 TL;DR NgRxはいいぞ。 https://stackblitz.com/edit/ngrx-todo-v9 NgRxの概要 NgRxはAngular用の状態管理ライブラリです。NgRxを利用するとAngularを利用したアプリケーションでReduxのような状態管理ができます。 NgRxは下図のような構成になっており、Reduxと非常によく似ています。 https://ngrx.io/guide/store よ
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く
React と Riot.js の書き方の比較 - Qiita
TypeScriptでDiff型を表現する - Qiita
Vue.jsのリストレンダリングとhtml5のドラッグ＆ドロップの実装 - Qiita
Cannot find module 'hoge' - Qiita