@iwasaki のアーカイブ

JavascriptのalertでObjectの中身を表示する方法

2017年3月24日

### Firefox ``` alert(hoge.toSource()); ``` ### Chrome ``` alert(JSON.stringify(hoge)); ``` 参考 https://www.infoscoop.org/blogjp/2012/05/17/javascript%E3%81%AE%E3%83%87%E3%83%90%E3%83%83%E3%82%B0%E3%81%A7object%E3%81
続きを読む

AWS LambdaのNode.js v0.10 runtime サポート

2017年3月24日

AWS Lambdaの Node.js v0.10 runtime サポート期限がもうすぐで最近やたらとメールが来るのですが、自分で把握しているfunctionの数と、AWSからお知らせのある数とが一致しなくてイライラしておりました。 どうやら以下のコマンドで対象となるfunctionをリストアップできるようです。 ``` aws lambda list-functions --query 'Functions[*].[FunctionName, Runti
続きを読む

log4jsを使う方法

2017年3月24日

log4jsを使うには以下のようにします。 ``` var log4js = require('log4js'); log4js.configure({ appenders: [ { type: "console", layout: { type: 'pattern', pattern: "[%d{ISO8601}] [%p] %c - %m" } } ], r
続きを読む

ロリポップでシンボリックリンク対応

2017年3月24日

ロリポップではSSHアクセスができるようになっています。 CMSツールのバージョンアップ対応などを考え、シンボリックリンク対応をしてみます。 今回はMTをシンボリックリンク化してみます。 ## 事前準備 バックアップを取ります。FTP接続してローカルにダウンロードしておくといいかと思います。あわせてMySQLのデータベースも忘れずにバックアップを取得しておきます。ロリポップの場合だとユーザー専用ページからphpmyadminを開いてエクスポートが可能で
続きを読む

node.jsのログにタイムスタンプを出力する

2017年3月23日

やりたいこと console.logをそのまま使いたい console.log('hoge')とすると ``` [2017-03-23 01:44:54.324] hoge ``` みたいに出力したい 以下のようなライブラリを見つけました。 https://github.com/nomiddlename/log4js-node https://github.com/starak/node-console-stamp ht
続きを読む

X-Forwarded-Forヘッダーのルール

2017年3月22日

ELBなどを経由してApacheでリモートIPを取得する場合、そのままだとELBのIPアドレスになってしまうため、X-Forwarded-Forヘッダーの値を使うのが定石かと思います。 多段プロキシの場合にはX-Forwarded-Forヘッダーのルールは以下のようになります。 > リクエストが複数のプロキシを通過する場合、X-Forwarded-For リクエストヘッダー内の clientIPAddress の後に、リクエストがロードバランサーに達するまでにリク
続きを読む

MySQLでトランザクションを開始する

2017年3月16日

``` mysql> BEGIN; mysql> UPDATE eip_t_message_read SET is_read = 'T' WHERE room_id = XXX AND user_id = XXX AND is_read = 'F' AND message_id COMMIT; ``` BEGINでトランザクションが開始します。 COMMITが実行されるまで待ちます。 なおInnoDBの行ロック/テーブルロックにはこのような
続きを読む

Redux FormのWizard FormでSubmit Validationを使う方法

2017年3月16日

今回はRedux FormのWizard FormでSubmit Validationを使う方法です。Material UIも使っていますが、今回はあまり話の本筋ではありません。 現時点においてReduxでFormを扱うにはRedux Formを選択するケースがメジャーなようです。 http://redux-form.com/6.5.0/ なお、Exampleで紹介されているドキュメントと実際のコードが違っている場合がある(ドキュメントの方だと引数が書いてなかっ
続きを読む

firebaseの設計思想

2017年3月15日

firebaseの設計思想とはRDSなどの正規化とは大きく異なるため、柔軟な発想が必要になっていきそうです。 基本的には以下のような考え方になりそうです。 1. insert,put時にがんばる(たくさん登録する) 1. select時には複雑なことをしなくでもデータを取得できるようにしておく 正規化をするとネストしがちですが、それもバットケースのようです。 Firebase公式には以下のように書かれています。 https://fireba
続きを読む

Material UI のCheckBOXをRedux Formで使う

2017年3月15日

redux-formでMaterial UIを使用する例としては http://redux-form.com/6.5.0/examples/material-ui/ に例が載っています。 ただ、redux-formとMaterial UIの相性が悪いといった話もあったりして、ちょっと癖がある感じがあります。 また、薄いラッパーとしては https://github.com/erikras/redux-form-material-ui があり
続きを読む

rechartsのラベルをカスタマイズする方法

2017年3月15日

reactでChartを表示する際にはrechartsを使用するのが王道のようです。(chartjsもありますが、v2.0に対応しているライブラリがまだメジャーになってないなど色々あるようです。) Pieチャートのラベルをカスタマイズしてみます。 http://recharts.org/#/en-US/examples/PieChartWithCustomizedLabel チャートを描画する部分は以下のようになりますが、labelに独自の関数(以下の例だと
続きを読む

CentOSにVisual Studio Codeをインストールする方法

2017年3月14日

rootで以下のコマンドを実行します。 ``` rpm --import https://packages.microsoft.com/keys/microsoft.asc sh -c 'echo -e "[code]\nname=Visual Studio Code\nbaseurl=https://packages.microsoft.com/yumrepos/vscode\nenabled=1\ngpgcheck=1\ngpgkey=https://pac
続きを読む

Firebase Boltを使えるようにする手順

2017年3月13日

## 事前準備 ``` npm install -g firebase-tools firebase login ``` コマンド一覧 https://firebase.google.com/docs/cli/?hl=ja ## ルールを作成してデプロイする ``` npm install -g firebase-bolt firebase-bolt database.rules.bolt firebase deploy
続きを読む

react15の環境にrechartsをインストールする方法

2017年3月10日

``` npm install -g recharts ``` してみたら ``` npm WARN recharts@0.21.2 requires a peer of react@^0.14.0 || ^15.0.0 but none was installed. npm WARN recharts@0.21.2 requires a peer of react-addons-transition-group@^0.14.0 || ^15.0.
続きを読む

Redux Form で複数のチェックボックスを使う

2017年3月8日

Redux Formでチェックボックスを使うには ``` const renderCheckbox = ({ input, label }) => ( ) ``` ``` const MaterialUiForm = props => { const { handleSubmit, pristine, reset, submitting } = props return (
続きを読む

Redux Form v6を使う

2017年3月8日

Redux Formを使う方法です。 Redux Formとは、ReduxでFormを扱う際のバリデートなどフォーム関連の処理をいい感じにしてくれるライブラリです。 これを使う一番のメリットはやはりバリデートのようです。 ## 現在のバージョン http://redux-form.com/6.5.0/examples/ 2017年3月8日 現在の最新バージョンは 6.5.0です。 ## バージョン5とバージョン6の差 バージョン5から
続きを読む

Material UIのcolorsの使い方

2017年3月7日

http://www.material-ui.com/#/customization/colors の使い方です。 すべてのカラーを取得してcolorsとして使えるようにします。 ``` import * as colors from 'material-ui/styles/colors'; ``` 状態によって動的に色を変える場合、関数化しておきます。 ``` getColor() { if (this.prop
続きを読む

eslint-config-airbnbを使ってES6の記法を実現する

2017年3月3日

airbnbのeslintを導入すると強制的にES6の文法で書かざるを得なくなります。これが非常に便利なのですが、その中で新たに知った記法で目立った点を記載しておきます。 Reactのサンプルコードとか実際に書いてみたものの、どうやってES6の記法に読み替えるんだろう、というケースにお使いください。 ## プロパティ省略記法 Actionまわりで書くことが多いもの ES5 ``` export const addItem = createA
続きを読む

npm install時にpackage.jsonにライセンスの表記がないと怒られる

2017年3月2日

``` npm install ``` した際に、package.jsonにライセンスの表記がないと以下のようなエラーが出ることがあります。 ``` npm WARN app@X.X.X No license field. ``` package.jsonに以下のようにライセンスの表記を追記するといいでしょう。 ``` "license": "UNLICENSED", ``` 参考 https://docs.npmj
続きを読む

java8でhttps通信に失敗する2

2017年3月2日

http://hacknote.jp/archives/8039/ では、JVMのオプションに以下を指定することで、ServerNameの設定が変更されてないなどSSL証明書の設定がよろしくないサイトもよしなに通してくれるようになりました。 ``` -Djsse.enableSNIExtension=false ``` 参考 http://ttshiko.hatenablog.jp/entry/20121103/1351927402
続きを読む