概要 原著者の許諾を得て翻訳・公開いたします。 英語記事: When (and when not) to use Redux – LogRocket 原文公開日: 2018/01/20 著者: Christian Nwamba サイト: LogRocket 2018/03/13: 初版公開 2021/06/03: 更新 Reduxが登場するまで、複雑なタスクを組むときのステート管理は相当つらい作業でした。Reduxは、Fluxというアプリケーションデザインパターンにヒントを得て、JavaScriptアプリでステートを管理するために設計されました。ReduxはReactと併用されることが多いのですが、ReduxはjQueryやAngular、Vueといった別のフレームワークとも併用できます。 Reduxのサイズは非常に小さい（依存関係も含めてわずか2KB）にもかかわらず、アプリの各コンポーネ

某所で書いたものを公開用に書き直したもの 前提 フロントエンドでTDDは難しい、というかほぼ不可能である。なぜなら事前に副作用をデータとして表現できるか不明だからだ。たとえばあなたのプロダクトの画面の何処かにボタンを追加するために、その内部表現を事前に思い浮かべることが可能だろうか？ react-redux などのFluxフレームワークは如何に副作用をアクションとして表現することで、テスト・デバッグのための情報を残すか、という視点で発展してきた側面がある。あの冗長なアクション定義は、全てデバッグのために書いていると言っても、過言ではない。それすら「Textは文字がある」といったトートロジーなデータになりがち。 フロントエンドの現実的な単体テストは、他の開発者のために、自分が書いたコードの要求を満たしているか検知する手段として、防衛的にテストアフターしておく。これぐらいしか現実的な手法がない

普段何気なく使用しているUIのアニメーションもその仕組みや効果を理解すると、なるほどと考えされられます。 スマホアプリのUIに使用するアニメーションをGoodな良いものから、Greatな素晴らしいものに変えるUIアニメーションのさまざまなアイデアを紹介します。 Material Motion, IBM Animation Principles, The UX in Motion Manifestoのガイドラインに基づいた、気持ちのいい操作性に優れたアニメーションを楽しむことができます。 Good to great UI animation tips 下記は各ポイントを意訳したものです。 ※当ブログでの翻訳記事は、元サイト様にライセンスを得て翻訳しています。 タブのコンテンツをスライドさせるアニメーション カードをタップして詳細を表示するアニメーション コンテンツを表示するアニメーション コ

「将棋AIで学ぶディープラーニング」という本を出版します。 昨年10月に技術書典3で「ディープラーニングを使った将棋AIの作り方」という技術系同人誌を出したことをきっかけに書籍化のお話をいただきました。 技術書典で出した本は、方策ネットワークを使った将棋AIの作り方でしたが、書籍の方では、将棋AIの作成を通してディープラーニングを学べるというコンセプトで執筆しています。 実際に動かせるコードを作ってみるというのが技術を学ぶために有効な方法だと思います。 私自身、AlphaGoのクローンと、ディープラーニングを使った将棋AIを作ったことでディープラーニングについて理解を深めることができたと思っています。 ディープラーニングを使って学習させた将棋AIを実際に動かしてみることで、ディープラーニングを体験して欲しいという想いで書きました。 内容は、3部構成で、 1部ではコンピュータ将棋の概要につい

藤井聡太六段が、2018年の第45回将棋大賞の記録4部門（勝率一位賞、最多勝利賞、最多対局賞、連勝賞）を独占することが決まりました。 昭和42年度(1967年)からの記録上、4部門の独占は内藤國雄、羽生善治に次ぐ3人目となります。 ◆藤井聡太六段のコメント 一局一局の積み重ねがこのような結果として表れたことを嬉しく思います。 これからもより良い将棋を指すべく精進していきたいです。 ◆佐藤康光会長のコメント この度の記録四部門全制覇、羽生竜王以来17年ぶりの偉業、誠におめでとうございます。対局の内容も申し分なく、1年間戦い抜いた結果として、今後の大きな自信につながるのではないでしょうか。さらなる飛躍を期待いたします。 ◆羽生善治竜王のコメント 四部門1位は1年間安定をした活躍を維持しないと到達が出来ない記録です。 デビューから29連勝の前人未到の大記録が今回の大きな原動力になった印象です。今

前回は、取引所のプライベートAPIを用いて自分の取引残高や出金履歴を見てみました。今回は、パブリックAPIを用いて板情報を取得し、Webブラウザ上に表示してみましょう。WebPackとsuperagentを用いたCORS(クロスオリジン)の問題も解決しているのでそれなりに意味のあるものになっているかと思います。今回はReactというライブラリを採用していますが、エッセンスは共通しているはずです。必要なところだけ吸収して頂くだけでも大丈夫です！ Reactの基礎についてはこちらの講座でサクッと学べます(Reactだけでも十分です)。→「最短で学ぶReactとReduxの基礎から実践まで」 1. ワークスペースの作成 今回は雛形(テンプレート)を用意しましたので、こちら(https://github.com/rascal-3/cryptocurrency-api-test.git)のリポジトリ

1. 仮想通貨取引所の口座を準備 今回は、仮想通貨取引所(仮想通貨交換業者)が公開しているAPIを簡単に試してみたいと思います。 ここで試してみたのは以下の2社です。口座開設は簡単だと思います(無料です)。 (パブリックAPIを用いた板情報の取得の記事(第2回)はこちら → https://racooma.com/medium/2017/09/17/exchanges-api-trial-02/) ・bitFlyer (ビットフライヤー) ・coincheck (コインチェック) 2. 各API ドキュメント 適宜以下のリンクを参考に進めて行きましょう。 ・bitFlyer Lightning API Document (bitFlyer Lightning API Playground) ・coincheck API Document 3. Cloud9で簡単に環境構築 Cloud9とい

Create graphics with a hand-drawn, sketchy, appearance Rough.js is a small (<9kB gzipped) graphics library that lets you draw in a sketchy, hand-drawn-like, style. The library defines primitives to draw lines, curves, arcs, polygons, circles, and ellipses. It also supports drawing SVG paths. Rough.js works with both Canvas and SVG. Install Install from npm: npm install --save roughjs And use it in

Amazon Web Services ブログ ディープラーニングネットワーク (GAN と Siamese) を組み合わせハイクオリティでリアルなイメージを生成 ディープラーニングはトレーニングに使用するデータの量と質に依存するため、企業は優れたイメージデータを得ようと多額の費用を投資をしています。通常、そうした企業はコストの掛かる人間による注釈を使ったり、製品や人物の写真を撮るなど、多大な作業を要しています。けれども、このアプローチはコストが掛かる上に拡張性もありません。コンピュータをトレーニングしてハイクオリティなイメージを生成すれば、コストを大幅に削減しビジネスの成長を促進することができます。 このブログ記事では、Amazon の私の同僚数人がまとめた「Semantically Decomposing the Latent Spaces of Generative Adversar

NTTは、Webシステムを開発するためのアプリケーションフレームワーク「Macchinetta（マキネッタ）フレームワーク」をGitHub上で公開した。 Macchinettaフレームワークは、Java言語向けのオープンソースソフトウェアのアプリケーションフレームワーク「Spring」を中心に、Webシステムの開発において必要となる共通機能の提供と、アプリケーションの基本的な実装手法等をドキュメントとして整備したもの。NTTグループにおいて広く標準的に活用されており、豊富なベストプラクティスに基づいて作成されているという。 OSSの組み合わせによる共通機能の提供においては、様々なユースケースを想定した動作検証を行い、OSSのアプリケーションフレームワークであるSpringを中心にOSSスタック推奨モデルとして定義しているという。 MacchinettaフレームワークのOSSスタック推奨モデ

この記事で紹介する以外にも、さまざまなサービスがあります。どのサービスにするかは、以下のような点を基準に選ぶと良いでしょう。 利用中または将来利用する取引所に対応しているか利用中のウォレットサイトと連携しているかサービスの充実度（損益だけを知りたいのか、確定申告までしてもらいたいのか）CRYPTACT（クリプタクト）｜仮想通貨の確定申告を楽にするツール 参照：Cryptact Cryptact（クリプタクト）は、2017年12月24日に「株式会社クリプタクト」がリリースした、仮想通貨実現損益計算ツールです。仮想通貨の損益を自動で計算することが可能です。 代表がゴールドマンサックスで働いていたという経緯もあり、投資家目線でつくられた機能で、そのすべての機能を「無料」で使うことができます。 使い方や機能についてまず、サイト内での会員登録を行います。「ユーザー名・メールアドレス」のみで簡単に登録

Vue.jsでSPAを作ったものの、検索エンジンのクローラーやSNSのOGP取得といった問題で困ったことはありませんか？ サーバーサイドレンダリングを簡単に構築できるNuxt.jsの活用方法を解説します。 ユニバーサル（Isomorphic）JavaScriptはJavaScriptコミュニティで一般的な用語になりました。ユニバーサルJavaScriptとは、クライアントとサーバーの両方で実行できるJavaScriptコードのことです。 Vue.jsを含むモダンJavaScriptフレームワークの多くは、シングルページアプリケーション（Single Page Application : SPA）の構築を目的に作られています。シングルページアプリケーションはページがリアルタイムで更新されるので、アプリの動きが軽快でユーザーエクスペリエンスが向上します。さまざまな利点がありますが、欠点もありま

1. 使い始める 1.1 バージョン管理に関して 1.2 Git略史 1.3 Gitの基本 1.4 コマンドライン 1.5 Gitのインストール 1.6 最初のGitの構成 1.7 ヘルプを見る 1.8 まとめ 2. Git の基本 2.1 Git リポジトリの取得 2.2 変更内容のリポジトリへの記録 2.3 コミット履歴の閲覧 2.4 作業のやり直し 2.5 リモートでの作業 2.6 タグ 2.7 Git エイリアス 2.8 まとめ 3. Git のブランチ機能 3.1 ブランチとは 3.2 ブランチとマージの基本 3.3 ブランチの管理 3.4 ブランチでの作業の流れ 3.5 リモートブランチ 3.6 リベース 3.7 まとめ 4. Gitサーバー 4.1 プロトコル 4.2 サーバー用の Git の取得 4.3 SSH 公開鍵の作成 4.4 サーバーのセットアップ 4.5 Git

先週Dropbox がついに上場申請した。優良ベンチャーを大量に生み出し続けるアクセラレータ、Y Combinatorの初の上場案件である。 Dropboxと似たようなビジネスということで、いつも比較されてきた会社にBoxがある。どちらもデータストレージとシェアリングがビジネスだが、Dropboxが個人向けなのに対しBoxは企業向け。Boxは2015年に上場したが、Dropboxはこれまで未上場だったので具体的に数字がわからず、噂レベルで「実はすごい」「いやダメだ」みたいなことが両方言われてきた。「Dropboxは無料ユーザー数は多いけれど、課金で苦労しているらしい」など。 私自身2010年以前からDropbox のユーザーで、それまで様々なストレージサービスを使ってはどれも技術的にダメでフラストレーションで一杯だったのだが、Dropboxを使い始めた瞬間にその技術的な完成度に感銘を受け、

2017年6月リリースのES2017で、JavaScriptはようやくまともな非同期処理を手に入れました。 以下はMODERN ASYNCHRONOUS JAVASCRIPT WITH ASYNC AND AWAITの日本語訳です。 MODERN ASYNCHRONOUS JAVASCRIPT WITH ASYNC AND AWAIT JavaScriptで非同期処理を行う近代的な方法とは。 Introduction JavaScriptはコールバック地獄からES2015のPromiseまで瞬く間に進化しました。 そしてES2017では、async/awaitによってより簡潔に非同期処理を書けるようになりました。 非同期関数はPromiseとジェネレータの合わせ技であり、そしてPromiseより高いレベルの抽象化です。 リピートミー。「async/awaitはPromiseで作られている」

この本に書かれていることの中で、自分が一番共感したのはこの言葉だ。 僕は生きて成長していく過程の中で、試行錯誤を重ねつつ、僕自身のやり方をなんとか見つけていきました。トロロープさんはトロロープさんのやり方を見つけ、カフカさんはカフカさんのやり方を見つけました。あなたはあなたのやり方を見つけてください。身体的な面においても精神的な面においても、人それぞれに事情は違っているはずです。人それぞれに、それぞれのセオリーがあるでしょう。 （引用元：「職業としての小説家」村上春樹/新潮社/P207） 続けて「その中で自分のやり方がいくばくかの普遍性があって、誰かの参考になればそれはそれで嬉しい」と続く。 この本は「30年以上小説家としてあり続けるための」村上春樹個人の方法論が書かれた本だ。 本人が書いている通り、村上春樹でない人にとってその方法論がどこまで役に立つのかは分からない。ただ役に立つかどうか

Cassandraのストレージエンジンを入れ替えて高速化した「Rocksandra」、Instagramがオープンソースで公開。Javaのガベージコレクションによる遅延を大幅に解消 Instagramは、NoSQLデータベースのCassandraで発生していたJavaのガベージコレクションに起因する遅延を解消し、高速化した改良版Cassandraをオープンソースで公開したと発表しました。 ストレージエンジンとしてキーバリューストアの「RocksDB」を用いたことから、同社はこの改良版Cassandraを「Rocksandra」と呼んでいます。 JavaのガベージコレクションがCassandraの遅延を発生させている 同社がRocksandraの開発に至った経緯は、エンジニアブログ「Open-sourcing a 10x reduction in Apache Cassandra tail

通っていたサンフランシスコのデザイナー養成所Tradecraftの一番最初の課題で、アプリをピックアップして、見知らぬ人に声をかけてユーザビリティテストをして改善のプロトタイプを作って検証するーというものがあったのですが、そのプロセスをこの度記事にまとめてMediumに投稿しました。 するとGoogleのデザイナーが、なんとFoursquareの創業者のDennisにメンションしているではないですか。 Awesome, just shared with the team!— Dennis Crowley (@dens) 2018年3月9日 チームの人にシェアしてくれたみたいで、Foursquareのエンジニアの人からメッセージが届いたり、その日のうちに人事の人から「今ちょうどシニアプロダクトデザイナーのポジションを募集しているんだけど、興味があったら連絡待ってるよ」みたいなメールが届きまし

私の安否情報のスクショが出回っているらしい。ここまで1か月以上かかった。狭苦しい鍵アカウントから、ようやく私の“本来の肉体”であるところの @Fukuso_Sutaro に戻ってくることができた。ちょうどこの記事が完成したこの日にだ。なんとタイミングの良いことか！　私がインターネットの海の奥底に息を潜めていたのは、私の身の安全を確保するため、そしてこの記事を完成させるためである。 昨日まで、私は“複素数太郎”であることをやめていた。“複素数太郎”はたしかに死んでいたのだ。ごく一部の安否を隠し通せないであろう人々には「現実世界にやばいやつが干渉してきそうなので、もし死亡説など出ても公然と否定するようなことはしないでください」とお願いした。オープンシェアハウスなどの人が多く集まる場所では毎回このアナウンスをしていた。“お願い”の射程範囲の人々は3桁にものぼった。にもかかわらず、少なくとも現実世

こんにちは、VASILYで主にAndroid開発を担当している@Horie1024です。先日potatotips #48で「Alexa、APKを配布して」というタイトルでLTさせて頂きました。 資料は以下になりますが、本投稿では、Alexaスキルの仕組みから最終的にAPKが配布されるまでを出来る限り詳細に解説していきます。 目次 目次 AlexaでAPKを配布する流れ Alexaスキル開発事始め Alexaスキルの仕組み 対話モデル インテントとスロット サンプル発話 インテントスキーマ APKを配布するスキルの作成 Amazon developerへの登録 Alexaメニューの表示 スキルの作成 対話モデルの作成 設定（AWS Lambdaエンドポイントの指定） Serverlessを利用したAWS Lambdaエンドポイントの開発 Serverlessのインストール テンプレートから雛