進捗ありません

この1週間、調子が悪かったり仕事に追われたりしていて何も勉強できていない。 少しだけReduxのサンプルを写経して動かない箇所を動くように修正した程度。

ES2015で理解が足りていない事

import Hoge from './hoge'; //hogeファイルの中でexport defaultされたものをHogeとなづけてimport
import * as Hoge from './hoge'; //hogeファイルの中でexportされたもの全てをHogeオブジェクトとしてimport
import { Hoge } from './hoge'; //hogeファイルの中でHogeという名でexportされたものをimport

という理解だったのだけれど、Reduxのサンプルで意図する挙動をしなくて困った。 最終的に記述ミスだったのか、勘違いだったのか、動くようになったけど。

いっぺん基礎を網羅的に勉強しないとダメですね。 しかし、ECMAScript2015のドキュメント原文を読むのはなー。。。

気がつけばMarkdown

いつの頃からかドキュメントはMarkdownで書くようになった。

最初はなんじゃこりゃ書きにくい、意味わからんと思っていた。

でも一度慣れてしまうととても書きやすい。

文章を章立てで考えられるし、VisualStudioCodeにプレビュー機能があってわかりやすい。

そしてBearのようなメモアプリや、何よりHugoのようなMarkdownで書いて静的サイトを生成できるツールに世の中溢れているので、一度慣れてしまうともう戻れない。

WordPressを普通のテキストを書くなんて苦行でしかない。

まとめ

Markdown最高！

進捗

直近の目標に対する結果と進捗

• ブログや静的サイトのテーマをつくり込みたい(Pelican,Hexo,Jekyll,WordPress,Hugo,Sphinx)
• Makerel試したい
• Dockerをある程度使えるようになりたい

ブログや静的サイトのテーマをつくり込みたい

Plican,Hexo,Jekyllについては完了。 Jekyllは二度と触りたく無い。

4月にWordPressのテーマ作成他のテンプレートを作りたい。

進捗としてはまぁまぁ。

期限：5月で変わらず

Makerel試したい

試した。

カスタムメトリクスは真面目にきちんと時間を取らないとだめっぽいので諦めた。

とにかく試したので完了とみなす。

ちなみにトライアル期間終わったのでお金払わないとフル機能試せなくなった。

Dockerをある程度使えるようになりたい

久しぶりに触った。

SwarmやKubernetesはハードル高いので今は諦めた。

ひとまず現状のバージョンのDockerに入れ替えた。

完了としたい。

4月の目標

ブログテーマの作成は引き続き行う。

仕事上の別件が忙しくなるので他の課題を設定せず欲張らず地道にやっていきたい。

最近のフロントエンド事情はまるで発展途上国の交通事情ですか

ES6で書いてES5に変換したいだけなのに、なんなんですか？

ES6からES5に変換したいだけなんだ

Babel

Babelを使えば変換できる。。。

Babelを毎回実行するのだるいからWebpackでタスクランナー的に実行する。

考えはいい。それで十分だし、何も難しいことはなさそうだ。

でもいざ環境を揃えようとすると……

以下をインストールする。

• webpack
• webpack-dev-server
• babel-core
• babel-loader
• babel-preset-es2015

webpack.config.jsと.babelrcにも設定を書く。

これですむのならいい。

実行したら文法エラーが出た。

• babel-preset-stage-0

を追加したら解決した。

なんだよそれ！最初からbabel-coreだけで対応しろよ！

他にもbrowserify,babelifyとかいろいろプラグイン的なものがある。

自分の書いたES6のコードを動くようにするのにいったいどれを入れたら動くのか分からない！

BabelとWebpack

webpackの設定及び.babelrcにも何を変換処理に使うのか書かないとちゃんと変換されない。

webpackに書いただけじゃダメで.babelrcにも書かないといけない。という認識だけど、多分理解が足りなくて本当は綺麗な書き方があると信じてる。

まとめ

ES6で書いてES5に変換するの辛い。

早くブラウザが標準でES6対応してほしい。

Reduxについて感化されたこと

Reduxについて不満に思っている部分について考察している記事を見かけた。

自分もReduxを少し触ってみて「？」と思っていたことなどが言語されていた。

理解して納得していること

Reactの場合は上からもらうプロパティはPropsで読み取り専用。

要素ごとにstateという読み書き可能なプロパティを持つ。

ReduxはFluxアーキテクチャの実装。

1つの状態を管理するStoreのみ。

Actionを呼びReducerが状態を更新する。それぞれはプレーンなjavacsriptで書く。

ここまではいい。とても素敵に感じた。

受け入れがたいところ

javascriptといえば、画面上の何かを触ったらイベントを拾って画面を変えたりとか、非同期で外からデータを持ってくるとかですよね。

その非同期処理をReduxではどう書くのか、実はActionは処理のオブジェクトを生成するだけだし、Reducerは更新結果の状態を同期処理で作るだけ。

ビジネスロジック的なものや非同期処理はどこに書くのか？

基本的には無い。なので後付け？でてきたMiddlewareてのを作る。

Reduxの思想では、非同期の処理前、処理中、処理結果(成功・失敗)をそれぞれ状態として更新する。

その処理をMiddlewareに書くのだけれど…書くのだけれど、これがすごく気持ち悪いと感じていた。

いろいろ他の書き方が無いのかとか本来自分はどう書きたいのかということを考えると、乖離が大きく、辛い。

その辺りをReducerの状態を更新する処理のところで非同期処理を呼び出して結果を入れる書き方を考えた方がいらっしゃって、外国のReduxのコミュニティに投稿したら、disられてた。

Reduxの基本設計に不備があって、それをごまかすためのMiddlewareは許されて、Reducerに非同期処理結果を突っ込むのは違うとかって言うの、どうなの？

まとめ

ReduxのMiddlewareがいまいち気に入らないので、非同期処理も考慮されたFluxアーキテクチャのオレオレ実装を作るしか無いのか。。。

JAWS-UG コンテナ支部 の勉強会に行ってきた

行ってきた。。

前佛さんのお話

Dockerは仕様でコンテナが技術っていう話。

開発環境と本番とかステージングの環境が違うっていう問題はコンテナで解決できますね。

Dockerのイメージ・レイヤの概念のおかげで？ベースイメージを共有したり、イメージをコピーするのにも差分レイヤだけコピーするので早いとか。

他のコンテナ技術との大きな違い

今までに同様の技術はあったが、Dockerが大きく違うのは、DockerHubの存在。

自分が作ったイメージはもちろん、他人が作ったものも共有(流用)できる。

docker イメージの Github版。

注意点

ストレージドライバについては要件を考慮して決めましょう的な話。

このあたりを読むと理解が深まるのでしょう。

イメージ、コンテナ、ストレージ・ドライバの理解

ストレージ・ドライバの選択

ECS関連のアップデート

Windows コンテナ も試せる Windows Server 2016 の AMIもでてるよ。とか。

ECRについて

• フルマネージドDockerレジストリサービス
• イメージの容量に対して課金
• コンテナイメージは自動的に暗号化できる設定がある
• もちろんIAM使える
• ECRをCloudTrailで追跡可能
• CredentialHelper使ってね

業務上プライベートなDockerイメージを置く場所を作りたい場合なんかいいですね。

社内ビッグデータ基盤にバッチ用コンテナ環境を構築してみた

既存の触りたくないバッチ環境をそのままに、API Gateway、ECS、SQSなんかを活用してバッチ処理環境を改善した話。

既存のサーバーには何も追加したくない、が、curlは基本的に入っているので処理スタートをcurlから始める。

API Gateway を通じてリクエストを受け取り、ECS環境でバッチ処理、処理結果をSQSで通知みたいな。

ボリュームはできるだけ使わない。ログは全てCloudWatchLogsに流す。

すごい。

NTTとDocker

ECSで複数コンテナ構成な場合、SpotFleetを活用するとコストを抑えられますって話。

ECSを活用する上での勘所

データについて

• なるべくDocker Volumeを使わないで済む設計にする
  • いつでもインスタンスを捨てられるようにする設計
  • 永続DBデータはRDS,DynamoDBに、ファイルはS3に、ログはCloudWatchLogsを活用する
  • awslogs ログドライバ便利です。積極的に使っていきましょう。
• URLパスの設計
  • ALBを活用しましょう
  • 関連サービスのエントリポイントとかは環境変数で渡しましょう。
• セッションの管理
  • インスタンスにセッションを任せてしまうのは複数コンテナでサービスというのと相性悪い
  • ElastiCache,Redis,Memcachedを活用しましょう。

環境構築について

書き洩らした。ECS-optimized AMIを使いましょうというのとSpotFleet活用しようみたいな

Powershellでやったことメモn

Powershellの実行権限について

Get-ExecutionPolicy
Set-ExecutionPolicy <PolicyName> # RemoteSignedとか

よく使いそうなやつ

ファイル操作、実行、インストールなど

Copy-Item <<source>> -Destination <<dest>> -Recurse
Move-Item <<sourse>> -Destination <<dest>>
Remove-Item <<source>> -Recurse
Rename-Item <<sourse>>
Get-Content <<path/to/file>> 

Get-WmiObject Win32_Product

Enter-PSSession <<container_id>> -RunAsAdministrator

docker inspect <<container>> --format="{{.Id}}" | sv container_id

Install-WindowsFeature -Name <<FeatureName | SubFeatureName>>
Install-WindowsFeature Web-Server -IncludeAllSubFeature

Get-NetTCPConnection

Get-WebSiteState -Name <<WebSiteName>>

Start-WebSite -Name <<WebSiteName>>
Stop-WebSite -Name <<WebSiteName>>

Get-WindowsFeature -Name Web-Server
Get-WindowsFeature -Name Web-*

IIS関連

Import-Module IISAdministration 

Reset-IISServerManager -confirm:$false
$sm = Get-IISServerManager
$appHostconfig = $sm.GetApplicationHostConfiguration() 
$section = $appHostconfig.GetSection("system.webServer/handlers") 
$section.OverrideMode="Allow" 
$sm.CommitChanges()

Reset-IISServerManager -confirm:$false
$sm = Get-IISServerManager
$appHostconfig = $sm.GetApplicationHostConfiguration() 
$sectionHttpPlatform = $appHostConfig.RootSectionGroup.SectionGroups["system.webServer"].Sections.Add("httpPlatform") 
$sectionHttpPlatform.OverrideModeDefault = "Allow"
$sm.CommitChanges()

Reset-IISServerManager -confirm:$false
$globalModules = Get-IISConfigSection "system.webServer/globalModules" | Get-IISConfigCollection 
New-IISConfigCollectionElement $globalModules -ConfigAttribute @{"name"="httpPlatformHandler";"image"="%windir%\system32\inetsrv\httpPlatformHandler.dll"} 
 
Reset-IISServerManager -confirm:$false
$modules = Get-IISConfigSection "system.webServer/modules" | Get-IISConfigCollection 
New-IISConfigCollectionElement $modules -ConfigAttribute @{"name"="httpPlatformHandler"}

運用場面でよく使いそうなもの

Get-Process

Get-ChildItem env:

Get-WmiObject Win32_PerfFormattedData_PerfOS_Memory 

Get-ChildItem -Path Registry::HKEY_LOCAL_MACHINE\Software\JavaSoft...

New-Item -Path Registry::HKLM\...

Get-ItemProperty -Path Registry::HKEY_LOCAL_MACHINE\SOFTWARE\Microsoft\Windows\CurrentVersion

New-ItemProperty -Path "HKLM:\SOFTWARE\JavaSoft\Java Runtime Environment" -Name CurrentVersion -PropertyType String -Value 1.8

コマンドラインでインストール

msiexec /i <</path/to/msi>> /qn

Setup.exe /s /qn

勉強の進捗とHexoの改修

いろいろいっぱいいっぱいで諦めたことと、作業したこと。

スプリントの進捗

• Mackerelのプラグイン試すとか諦めて、3月までの課題終了。
• Docker学習、3月までの課題終了。Swarmとか諦めた。

時間に余裕ができたらまた集中して取り組む。

Hexoのレイアウト改修

TOPの画像がサイトタイトルを隠しちゃう感じだったのでCSSを変えるとかしようと考えてた。

行ったこと

• 画像を変更。ブログテーマに幾分合ってそうなものに変えたつもり。
• 画像をちょっと暗めにしたかったので少しCSS変更。

いい感じになった。

やらなかったこと

全体的な直しをしようか迷ったけど、要件を十分果たしていると判断して何もしないことにした。

ファイル名、URLパス、記事タイトルが同じじゃないといけないのがちょっとキモい。

そんな感じ。

Dockerを再インストールした

Dockerが全然触らないうちにどんどん進化していってしまったので、一旦アンインストールして、入れ直した。

環境はmacOS 10.11 えるかぴたん

やったこと

1. docker-machine(boot2docker)の中身を全て削除
   • docker-machine rm defaultとか
2. docker-machineを完全削除するらしいツールを使って削除実行
3. Virtualboxを確認して環境が残っていないか確認
4. .bash_profileに記述していた環境変数設定を削除
5. homeディレクトリ直下の.dockerみたいな隠し領域も削除
6. 公式から改めてdocker for mac をダウンロードしてインストール
7. ついでに改めてKitematicもダウンロードしてアプリケーションディレクトリに配置

ハマったこと

単に自分が愚かなだけなんだけど、最初、docker-machineを削除した後にターミナルを再起動？しなかったため、Docker関係の環境変数が残ったま間の状態で新しく入れたDockerに対してdocker -vとかやってエラーを出してた。

ターミナルを再起動して解決

ここまで

今日はここまで。

今後、先送りしてたswarmモードとやらを試したりしたい。

Mackerelのカスタムメトリクスに挑戦

して撃沈。

何が起きたか

公式のヘルプ を見ながら写経してUbuntu 16.04のサーバー上でカスタムメトリクスを作成して設定したが、うまくいかない。エラーが出る。

YYYY/MM/DD 時分秒 INFO <metrics.plugin> command /path/to/sample-metrics.rb outputted to STDERR: "/path/to/sample-metrics.rb: 10: /home/osawa/sample-metrics.rb: Syntax error: \"}\" unexpected (expecting \"then\")\n"

改行が足りない？

rubyファイルを単独で実行すると動くので謎。

これだからRubyは。

とりあえず、Mackerelは初期設定のままのメトリクスだけでいいや。