javascriptのスプレッド演算子(...)
javascriptで関数を呼び出すところで、引数に ...
と書いているソースコードを見かけるがこれが何か調べてみた。
ES2015から追加された、スプレッド演算子というらしい。
参考
「…」←これ、ただの省略記号かと思ってました。(Spread operatorのお話)|もっこりJavaScript|ANALOGIC(アナロジック)
TypeScript2からのReactとnon-null assertion
TypeScript2からコンパイルオプションの strictNullChecks
で、nullability をチェックできるようになった。
最近になってこのオプションを有効にしたら意外と修正するところが多かったのでメモ。
TypeScript1系の時は↓の様に書いてました。
import * as React from 'react' import * as ReactDom from 'react-dom' interface IAProps { } interface IAState { hoge?: string; fuga?: number; } class A extends React.Component<IAProps, IAState> { constructor(props: IAProps) { super(props); this.state = { hoge: '', fuga: 0 } } render() { return( <B hoge={this.state.hoge} fuga={this.state.fuga} /> ); } } interface IBProps { hoge: string; fuga: number; } interface IBState { } class B extends React.Component<IBProps, IBState> { constructor(props: IBProps) { super(props); this.state = { } } render() { return( <div> {this.props.hoge} <br /> {this.props.fuga} </div> ); } }
TypeScriptでstate管理するときは、毎回全部のパラメータを更新したいわけではないので
interface IAState { hoge?: string; fuga?: number; }
という感じに?
を付けてオプショナルにしていました。
そうすると、stateで管理しているhoge
fuga
の型が
hoge: string | undefined fuga: number | undefined
と、それぞれ undefined
になる可能性があるということになる。
Component B に値を渡すとき、Component B側では
interface IBProps { hoge: string; fuga: number; }
というようにundefined
は許容されないので、
render() { return( <B hoge={this.state.hoge!} fuga={this.state.fuga!} /> );
と!
を付けて、non-nullであることを明示してあげないといけない。
最終的にソースコードはこうなりました。
import * as React from 'react' import * as ReactDom from 'react-dom' interface IAProps { } interface IAState { hoge?: string; fuga?: number; } class A extends React.Component<IAProps, IAState> { constructor(props: IAProps) { super(props); this.state = { hoge: '', fuga: 0 } } render() { return( <B hoge={this.state.hoge!} fuga={this.state.fuga!} /> ); } } interface IBProps { hoge: string; fuga: number; } interface IBState { } class B extends React.Component<IBProps, IBState> { constructor(props: IBProps) { super(props); this.state = { } } render() { return( <div> {this.props.hoge} <br /> {this.props.fuga} </div> ); } }
参考
go言語をインストールしてvimで保存時にコードフォーマットを走らせるまでの設定
Macの環境でgo言語をインストールして、vimでソースコード保存時に自動でコードフォーマットが走るまでの環境設定です。
普段はIDEを使うので、vimでファイル保存時に go fmt
を実行させる設定に手間取ってしまったのでメモしておきます。
※ vim
のプラグイン追加方法がわからなかっただけです。
go言語のインストール
$ brew install go
ここまでで、go言語を書いてコンパイルして実行まではできるようになります。
go言語は標準で go fmt
でコード整形できるのですが、vimでファイル保存時に go fmt
を実行して欲しいのでその設定方法についてです。
vimで go fmt するまでの設定
1. vim-plugをインストールする
$ curl -fLo ~/.vim/autoload/plug.vim --create-dirs https://raw.githubusercontent.com/junegunn/vim-plug/master/plug.vim
2. ~/.vimrc
でプラグインを読み込むようにする
~/.vimrc
に下記3行を追加
call plug#begin('~/.vim/plugged') Plug 'fatih/vim-go' call plug#end()
3. vim
をリロードして :PlugInstall
を実行
ここまでの設定で vimでファイル保存時に自動で go fmt
が実行されるようになります。
AWS CloudFormationでECSを管理するときにハマったこと
CloudFormationでECSを構築したときにハマったメモです。
CloudFormationのテンプレートを書いて
あたりの設定をして、構築しました。
動作確認ができたので、AWS::ECS::Service
の設定を更新しました。
更新をしてみたところ、更新中のステータスから一向に進みませんでした。
テンプレートを確認すると、↓のようになっていました。
(下のテンプレートは余分な部分は書いてません)
Service: Type: AWS::ECS::Service Properties: DeploymentConfiguration: MaximumPercent: 100 MinimumHealthyPercent: 50
MaximumPercent: 100
ということで、新しいコンテナを追加できないのに追加しようとして動かない状態でした。
この状態だと、CloudFormationのタイムアウトを設定しないとずっと、更新中のステータスになってしまいます。
管理画面から手動でサービスの更新でタスク数を0にしてあげれば解決できました。
nodeのバージョン管理にnaveを使おうと思ったら上手くいかなかったのでメモ
basherからnaveをインストールしたあと、
$ nave use latest
を実行したところ、nodeのインストールに失敗した。
$ nave cache clear
したら直った
環境
AWS EC2 OS Debian Jessie AMI ami-dbc0bcbc
問題が発生した手順
- basherインストール
- naveインストール
- nodeインストール
basherのインストール
basherのInstallation手順に沿ってインストールした github.com
$ git clone https://github.com/basherpm/basher.git ~/.basher $ echo 'export PATH="$HOME/.basher/bin:$PATH"' >> ~/.bash_profile $ echo 'eval "$(basher init -)"' >> ~/.bash_profile $ bash $ basher update
naveインストール
naveのInstallation手順に従ってインストールした github.com
$ basher install isaacs/nave
nodeインストール(問題が起きたところ)
最新版のnodeを使おうと思い下記コマンドを実行した
$ nave use latest
コマンド結果
What version of node? lts, lts/<name>, latest, x.y, or x.y.z >
ここで latest
と入力してもnodeのインストールは実行されませんでした。
下記の通りキャッシュをクリアしたらインストールできました。
$ nave cache clear $ nave use latest
AWS CloudFormationでインフラを構築するときに CAPABILITY_NAMED_IAM というエラーが出た
AWS CodePipeline + CloudFormation でインフラをソースコードで管理しようと思い、cfn-ci-cd-demo
というRepositoryをベースにいろいろ試してみました。
IAM Role を作るときに、
Requires capabilities : [CAPABILITY_NAMED_IAM]
というエラーが出ました。
エラーが出たときの手順
- src配下で、 IAM Role (RoleName指定有り)を作成するテンプレートを作成する
- git push してインフラ構築をする
- 1.で作成したテンプレートの構築時にエラーが出る
という流れで試していたので、1.の該当ファイルだけをCloudFormationのテンプレートに指定して動かしてみたところエラーも無く IAM Role の作成に成功しました。
cfn-ci-cd-demo
では、
- ソースコード取得
- テスト
- ビルド
- 認証許可
- デプロイ
の手順で、デプロイ時に失敗するのでココに原因があるものだと思い、追加したファイルをいろいろ変更して試してみたのですがCodePipelineからのデプロイは成功しませんでした。
解決方法
ビルド時の Capabilities: CAPABILITY_IAM
という設定が原因でした。
この部分です。
- Name: Build Actions: Configuration: Capabilities: CAPABILITY_IAM
IAM や IAM Role に名前を付けたい場合は CAPABILITY_NAMED_IAM
にしないといけないようです。
公式のドキュメントにも書いてあることでした。