メモ。 3 年前にも書いたが、今これを読みながらインストールしたらいろいろ情報が古くなっていたので改めて。 環境 Mac OS X Yosemite 10.10.5 Homebrew 1.3.1 MongoDB 3.4.7 MongoDB の特徴 ↑の記事を参照。 インストール手順 基本的には公式ドキュメント…

経緯 dackdive.hateblo.jp これまで webpack-dev-server の Hot Module Replacement を React/Redux でも有効にするために babel-preset-react-hmre を使っていたが、いつの間にか GitHub のリポジトリがなくなっていて deprecated ぽいので別のプラグインを…

React 16 Beta がリリースされました。 Error Boundary という概念が導入されたそうなので公式ブログをざっくり読んでみます。 はじめに：React 15 までの問題 React 15 まではコンポーネントで発生したエラーをうまくハンドリングしたり、そこからリカバリ…

メモ。 大昔に作った Chrome 拡張に手を加えようと思い立った。 今回は chrome.storage API を使って設定内容をローカルに保存できるようにしたかったんだけど 開発時に保存したデータを確認したり、一旦削除したりするにはどうすればいいのかわからず調べて…

第1回 に続いて第2回も無事に開催することができました。 ※社外からの参加者もお待ちしています（Slack グループ） 教材 実践ドメイン駆動設計作者:ヴォーン・ヴァーノン翔泳社Amazon 書籍に加え、前回見つけた CodeZine の解説記事 今回は書籍の前に目を通…

こちらの記事を読んで。React&Redux でアプリを作る上で基本的だが重要なことが書かれていたので、後で見返すためにメモ。 なお本文は原文記事の完全な翻訳ではなくポイントだけかいつまんで自分の考えも交えたものです。 また、まとめさせていただく上で著…

はじめに 経緯など 【緩募】DDDを勉強したいと言ったら社内外で何人か興味を持ってくださり、集まって書籍を読むだけのもくもく読書会なるものを始めることにしました。一緒に読書に付き合ってくれる方募集中ですので、同じようにDDDに興味のある方はお気軽…

メモ。 CircleCI に SSH でログインするため に従い接続しようとしたところ、Permission denied (publickey) が表示された。 $ ssh -p 64543 ubuntu@13.59.112.96 The authenticity of host '[13.59.112.96]:64543 ([13.59.112.96]:64543)' can't be establi…

2系に上げるかどうかを悩んでいる間に 3.0.0 がリリースされてしまった。 を参考にアップデート内容をメモ。 概要、v2 からのマイグレーション 大きな feature は Scope Hoisting と Magic Comment ぐらい。 v2 からの移行も特別な作業は必要なく、たいてい…

はじめに 1年以上前ですがこんな記事を書きました。 このときは webpack-dev-server をスタンドアロンなサーバーとして使う方法しか知らなかったのですが 既存の Express アプリに組み込んで使うこともできます。 そのためには webpack-dev-middleware およ…

Google 検索や乗換検索サービスとかでよく見るこれ。サジェストと呼ぶのかオートコンプリートと呼ぶのか。 react-autosuggest というライブラリを使って実装してみます。 Codepen にサンプルコードがたくさんあります。 https://codepen.io/collection/DkkYa…

日本だと桁区切り文字は,（カンマ）、小数点は. （ピリオド）だけど世界的に見ると国によって異なる。 世界各国での数字の区切り方 | コリス JavaScript で数値を扱うときには Numeral.js を使っていたんだけど、Numeral でも（Moment.js などと同じく）loca…

はじめに Redux で非同期処理を行うための Middleware である redux-thunk は、わずか 10 数行のこのようなコードです。 https://github.com/gaearon/redux-thunk/blob/v2.2.0/src/index.js function createThunkMiddleware(extraArgument) { return ({ disp…

はじめに Visualforce で Angular や React などの JavaScript ライブラリを使ったアプリケーションを作ろうと思った場合、 Apex で定義したメソッドの実行には JavaScript Remoting を使うのが一般的かと思います。 似たようなことを実現するための手段とし…

gapps を使って Google Apps Script をローカルで開発するための方法については 以前 Qiita に書いた し、それにより ES2015 や TypeScript で書いて手元でビルド、みたいなことはみんなやるようになったんだけど webpack を使った構成が探してもあまり見つ…

行ってきました。 hyperapp について Jorge Bucaran https://github.com/hyperapp/hyperapp SPA を作るための 1kb の軽量ライブラリ Virtual DOM + Redux/Elm 的な State 管理 + Router Fast React や Vue は framework っぽすぎ "dependencies": {} API ド…

最近悩んでいる React/Redux でそれなりの規模のアプリケーションを作るための良い設計について、 日頃ネットで気になる記事を漁っていたんだけど、積読がたまってきた＆Twitter やら Pocket やら Qiita に散らばってしまったのでここらで一旦整理します。 …

Spring'17 から利用可能になった Utility Bar を作ってみたので、その手順を残しておきます。 とりあえず Hello, World! と表示するところまで。 こちらの記事が参考になりました。 一応、公式の Implementation Guide とやらもあるみたいだけど、 https://r…

ちょいメモ。 Flowtype の Utilty Types を使っていて type Exact<T> = T & $Shape<T>; などと書いたら ESLint でエラーになった。 error '$Shape' is not defined no-undef eslint-plugin-flowtype は導入済みで、各バージョンは以下の通り。 $ npm list --depth=</t></t>…

前回に続き、ctrlp.vim についてのメモ。 ctrlp.vim でファイルを検索するとき、そのままだと候補の一覧がウィンドウ下部にmax10件ぐらいしか表示されない。 ここのサイズを変更したい。 設定方法を調べてみたところ、この Issue に書いてあった。 Not enoug…

ちょいメモ。 Vim で Atom や VSCode のような Ctrl + P によるファイル検索ができるようにする ctrlp.vim というプラグイン。 便利なんだけど、node_modules があるプロジェクトで使うと起動が遅かったり node_modules 内のファイルまで検索対象になってし…

ちょいメモ。 課題フィルタで一度に 50 件ずつしか結果が表示できないのを変更したい。 （画像は https://ja.confluence.atlassian.com/jiracoreserver070/searching-for-issues-777015942.html より引用） と思って調べてみたところ、 Expanding Issue Filt…

WEB+DB PRESS Vol.97作者:外村 和仁,小林 徹,古川 陽介,佐藤 歩,yoku0825,是澤 太志,一野瀬 翔吾,加藤 颯史,のざき ひろふみ,うらがみ,水嶋 淳貴,久田 真寛,久保 達彦,伊藤 直也,遠藤 雅伸,ひげぽん,海野 弘成,はまちや2,竹原,倉岡 洋義技術評論社Amazon 特…

はじめに React に限らず、JavaScript を使ってると本番環境用のビルド（以後、production build）として圧縮や難読化を行う必要があります。 webpack にはそのためのプラグインとして UglifyJsPlugin があるのは知っていましたが、 単純にこのプラグインを…

こちらのイベントに行ってきました。 AMA（休憩時間中の質問コーナー）という取り組みが非常に良かったです。 以下、話を聞きながら手元でメモしてた内容。 Web over ServiceWorker by @jxck__ Capability against Native/Low API Installable Performance P…

件名の通りですが少しハマりどころがあったのでメモ。 普通に react-lightning-design-system を使おうとすると SVG アイコン使用時に Unsafe attempt to load URL エラーが表示されます。 Unsafe attempt to load URL https://zakiyama-dev-ed.my.salesforc…

メモ。 webpack 2 正式リリース（バージョンは 2.2）だとか Tree Shaking という機能がいいらしい とかは目にしていたけど 結局 v1 -> v2 とメジャーバージョンが上がって Tree Shaking 以外に何が変わったの？というのがよくわからなかったので調べてみた。…

はじめに タイトルの通り。 gulp タスクに .env のようなファイルで定義した環境変数を渡したくて、 gulp-env と node-env-file を比較した。 結論としては node-env-file の方が使い勝手が良かった。 それぞれの使い方 node-env-file // gulpfile.js var gu…

Vim の Lint チェックに Neomake を使っていて、実行時に Neomake: flow: completed with exit code 64. と表示されてしまったときのメモ。 Flow のバージョンは 0.37.4。 原因と解決策 https://github.com/neomake/neomake/blob/master/doc/neomake.txt#L31…

メモ。 react-lightning-design-system の Datepicker の月や曜日の部分を日本語にしたい。 locale のようなプロパティはないが、内部的に Moment.js を使っているので以下のようにして変更できた。 （2017/01/20追記） 普通に moment.locale('ja'); だけで…