3月に1週間くらいかけて自作したので備忘録として書いておきます。

以下の機能がある定点カメラを作成しました。

音声コマンドで撮影が出来る
スケジュール機能がある
クラウドストレージに保存が出来る

経緯

2016 年までは Raspberry Pi と homebridge を使って自作でスマートホームを構成していましたが。 2018 年以降は既成品も充実してきたので、これまでの Raspberry Pi の用途は無くなってしまいました。

やること

最近は WEB サイトや CLI ツールを作ることが多かったので Raspberry Pi を使ってモノづくりが出来ないかなと考えて、だいぶ前に観た「父親が娘の写真を 18 年間撮ってつなぎ合わせた動画」が勝手な親心ながら良いなと思ったので、Raspberry Pi を使って似たようなことを自動化をしてみることにしました。

自作キーボード沼に最短でハマるまでの手順書

自作キーボード沼に最短でハマるまでの手順書を書き記しておきます。

ここ 1,2 ヶ月で興味を持ち始めて自作キーボードデビューしました！

沼にハマってからは、会社にキーボードの Slack チャンネルを作り、テックブログにも記事を書きました。この短期間でかなり下調べしたつもりですが、誤りがあった場合は優しく指摘してもらえればと思います 🙏

この手順書は自作キーボードに興味があるけど、自分と同じようにパーツや用語いろいろあってわからないという人向けに書いたものです。

概要

まずは以下の手順でパーツを選ぶとスムーズです。

キーボードの基盤（PCB）を選ぼう
キーボードのプレートとケースを選ぼう
キースイッチを選ぼう
キーキャップを選ぼう

我が家のスマートホーム2.0計画

スマートホームはラズパイで自作しなくても安く構築できる時代

3 大 AI アシスタントを全部試してみて

Siri と Google Home と Alexa を実際使ってみて、スマートホーム 1.0 の頃は Homebridge とラズパイの組み合わせで Siri 大活躍だったが、 Google Home と Alexa が家にきてからはスマート家電の種類も増えてラズパイの用途は少し別のことで使うようになった。

個人的には Google Home の mini じゃないやつが優勝だと思う。理由を書く。

海外製品の日本語対応

どちらかというと Alexa が残念で日本語対応されていない場合、 Amazon.com のアカウントで Alexa をアクティベートしないといけない。 Amazon Music など Amazon.co.jp アカウントなので利用できないし不便。

Google Home の場合は日本語対応されてない事がそもそもなかった。

アプリの使い勝手

Google Home アプリは機能面でも UI でも快適。唯一欠点を挙げるとスケジュールのハブ機能が物足りない。だがスマート家電ごとのアプリで設定はできるので不便はしていない。

できること

購入したスマート家電

Nature Remo (学習リモコン、日本製のレガシー家電には必須）
Rumba (掃除ロボ、9 万円のモデルのみ対応)
Xiaomi のスマート家電

これで「おはよう」と言えば天気を読み上げる & ダイニング照明 100% & テレビをつけるし「おやすみ」と言えばテレビ消す & リビング照明 10% & 寝室照明みたいなことをしてくれる。

Xiaomi 家電のコスパが良すぎる

購入して思うのが AI アシスタントと連携できるスマート家電は少ないし、高すぎる。そんな中で Xiaomi の家電は安いし使い勝手もいいのでおすすめしたい。

書斎とベットをXiaomiの電飾でオシャンティにした。スマート家電なので完璧。 pic.twitter.com/Z8SUyFmw4L
— ᴊᴀxx₂₁₀₄ (@jaxx2104) October 6, 2018

これを Amazon.com のインターナショナルシッピングから購入した。

YEELIGHT Smart Wifi LED Light Strip × 2
YEELIGHT Smart LED Bulb × 3

寝室照明を焚き火のような黄色から橙色のゆらぎ照明にしていて、眠りやすい。

あと Rumba を買ったが Xiaomi からも同様の製品が出ていて安い。掃除っぷりも動画でみた感じはいいので、気になる気になる。

Vue.js Tokyo v-meetup #8 に行ってきた

ブログ書く枠で参加させていただいたのでレポート👨‍💻

Connpass Vue.js Tokyo v-meetup #8
ハッシュタグ #vuejs_meetup8

Vue Fes Japan 2018 に向けたお知らせ

@kazu_pon さん

9 月 10 日チケット販売開始
販売開始前に事前にメールで連絡あるので事前登録おすすめ
販売数 360 枚（先着）
ボランティアスタッフ募集中

スピーカーとタイトルが発表 🎉

海外スピーカーと CFP

One More Thing 🎉

Reject Conference 開催決定！
2018/11/10 を予定しているとのこと

2018年の夏休みメモ

夏休みの期間でやったこと、技術的な部分は Qiita にエントリーでも書きたいけど仕事復帰すると忘れてしまいそうなのでこのエントリーは一旦のメモです。（写真は 6 日目に行った蔵前のカフェ）

1 日目: vue で styled-components をやってみる @千葉
2 日目: GCP の App Engine を触る
3 日目: GCP の App Engine で API サーバーと cron をデプロイ @銚子
4 日目: Go を触る @銚子
5 日目: GCP の App Engine で Go をデプロイ
6 日目: Firebase Cloud Functions を触る @蔵前
7 日目: Firebase で SSR をやってみる
8 日目: キーボードを購入する @渋谷
9 日目: ひたすら寝る

文字におこすとやった感ある。だけど一日の大半は遊んでいて実際は大したことやってないです。

iPadで静的サイトジェネレータを更新する

このブログは静的サイトジェネレータを使って書いてます。

マークダウンなので文章自体は書きやすいんですが、WordPress と違って iPad や iPhone から更新する方法はいまひとつな感じでした。通勤時間や寝る前のちょっとの時間を有効活用したかったので、試している方法を書いておきます。

同期設定

複数の端末からアクセスできるように Markdown を置いているフォルダを Dropbox フォルダにシンボリックリンクを貼ります。写真とかも携帯からアップしやすくて便利かもです。

エディタ

iPad 向けエディタは 1Writer、Bear、Byword などなど、たくさんあるんですが個人的には Editorial が一番使いやすい感じがしました。

Editorial http://omz-software.com/editorial/

マークダウンが書けて記号をタイプしやすいようキーボード拡張がついていて Dropbox 連携もできて、さらに後述する Workflow という機能があるのでお勧めです。

インストールした後は Dropbox 連携を済ませておきます。

3ヶ月前に転職しました。

2017/09/03

仕事

転職

よいタイミングかなと思い書き記すことにします。

前職では何をやっていたか

2013 年に Web メディアを運営している会社にインターンシップを経て新卒入社しました。主に自社 Web メディアの開発でしたが病院やら学校サイトの受託開発もやってきました。

4 年間でやったこと（受託を除く）

2013 年 Titanium 製のアプリケーション開発
2014 年新規事業でローカルネタを扱うメディア立ち上げ
2015 年主戦力のニュースメディアのリニューアル
2016 年女性向けメディアのリニューアルと新規事業でクイズを扱うサービス立ち上げ

開発メンバーは少なかったですがエンジニアとしての基礎を学べて、技術面などの新しい取り組みについても割と寛容で、提案すればだいたいやらせてもらえたので自分には合っていました。またタイミングよく各メディアのリニューアルや新規事業の立ち上げに携われたので、この 4 年間は貴重な経験だったなと思います。

転職を考えるきっかけ

たぶんいろんなタイミングが重なって転職しようと思いましたが、主な理由は以下 3 つです。

エンジニアが少ないので技術的な関心が外に向いてしまった。
サイトを掛け持ちし過ぎて情熱が冷めてしまった。
子どもが産まれる 👶

あとは純粋にエンジニアとしての評価がどれくらいあるのか知りたかったので転職しました。

転職には転職ドラフトと Wantedly を使いました。個人的に就活をあまり経験していなかった事もあり、あらためていろんな会社を見ようという事で 10 社くらい受けました。技術課題の提出期限が 3 社かぶった時は、仕事でのリリースとの両立が難しくてヒーヒー言ってました。でも転職活動は総じて楽しかったです。

結果いくつか内定もらった中で、現状に課題感がありながらも、フロントエンドに明るくなりそうな感じがした 1 社に転職を決めました。

どこへ行っても大切だと思うこと

結果としてエンジニアが 3 人の会社から社員とパートナー合わせると 100 人規模の会社に転職しました。以下はこれまでもこれからも大切にしようと思っていることです。

どんなに馬鹿でも毎日勉強し続けること
エンジニアは安売りせず高値で売る事を考えること
ネガティヴさは怒りに変えて糧にすること

同じようなキャリアを進む人は少ないと思うけど、もしエンジニアならどこへ行っても技術的な興味とプロダクトへの活かしどころに常にアンテナを張る必要があるなと感じます。

30 歳になって東京オリンピックを家族 3 人で一緒に見るころには、もう少しイケているエンジニアになっていたいものです。終わり。

本をSiriに読んでもらう

正直なところ本を読むのが苦手です。

なぜか理由はよくわからないけど。学生時代、活字に親しんでこなかったツケがまわってきたんだと思います。

本を読む必要について

それでもエンジニアとして、継続的に本を読まないといけません。本はネットと違って

一貫性がある
伝聞による劣化が少ない

などのメリットがあり、技術の習得やら再確認やらで読む必要があります。

本を効率よく読むために

試行錯誤の結果、本を Siri に読んでもらえばよいんだという結論に至りました。

kindle 本を買う
iPhone の設定から「アクセシビリティ」を開く
視覚サポートから VoiceOver を選択
本を読み上げてもらう

これによって、読み上げ速度を 3 倍速くらいまで上げれば普通の読書と同じくらいのスピードで読めるし、両手を塞がないので通勤や育児中も読書ができます。

より快適な読書ライフを 👩‍💻

Atom から VScode のエディタ移行と拡張機能について

2017/03/19

開発環境

VSCode

いままでコードを書くとき Emacs か Atom で書いてました。

ローカルではもっぱら Atom を使っていたのですが自分の環境だとちょっと立ち上がりが重い。さすがに耐えられなくなって少し前から Visual Studio Code にエディタを移行してみています。

追加した拡張機能などメモしておきます。

拡張機能

Git や Lint 関連の機能は初期状態で動作していて、とても始めやすい設定になっていました。

テーマ

Material-theme
vscode-icons: サイドバーにファイルアイコンが付く

言語

vue
Sass

整形/スニペット系

ESlint: JS 構文チェック
Beautify: 自動整形ツール
Document This: コメント挿入ツール
HTML Snippets: HTML スニペット
ES6 code snippets: JS スニペット
vutur

その他

Setting Sync: エディタ環境同期
Project Manager: プロジェクト管理
REST Client: REST API を実行するツール
Debugger Chrome: Chrome デバッガを実行するツール

いまさらですが2016年を振り返る

かなり遅いけれど最後の正月休みなので区切りのため去年を振り返ってみました。

IoT 関連

今までこれといった趣味がながったのですが、HomeKit や Raspberry Pi を中心としたスマートホーム化をきっかけにハマった 1 年でした。現在は自宅の照明やエアコン、温度計を自動化し快適な生活を過ごしています。アドベントカレンダーでは irMagician の homebridge プラグインを作成しエントリにしました。

正月前に chibi:bit をポチったのと、Kickstarter で Neture Remo に出資したので暑い夏までに届くとよいなと思ってます。

人喰いの大鷲トリコ

2016 年で一番良かったゲーム。トリコに感情移入しすぎてエンディングに向かっていくのが切なくも感じた。

JavaScript で Arrow 関数を使った時の this の代わり

2016/12/11

JavaScript

ES2015

これまでイベント関数でバインドした要素を取得する場合。

$(".button").on("click", function(e) {
  $(this).addClass("clicked")
})

こんなコードを書いてました。

Arrow 関数の場合

e.targetだとクリックした要素を取得するので.buttonの子要素の場合があります。

$(".button").on("click", e => {
  $(e.target).addClass("clicked")
})

e.currentTargetだとバインドした要素を取得します。

$(".button").on("click", e => {
  $(e.currentTarget).addClass("clicked")
})

React.js製の静的サイトジェネレーターGatsbyに移行した

Static Site Generator

これまで WordPress で技術メモを書いていたのですが、静的サイトジェネレータの記事を読んで試してみたいと思いました。有名どころの jekyll, Hugo, Hexo などを一通り使ってみたのですが、 React.js 製の Gatsby がおもしろそうだなと思って WordPress 環境から移行してみました。

gatsby https://github.com/gatsbyjs/gatsby

Gatsby の特徴

React.js ならではのリロードなドでのページ遷移
サイト構築のためのコンポーネント・モデルが使える
ライブで開発できる

Gulp タスクランナーを使ったフロントエンド開発環境

最近のフロントエンドはブラウザやライブラリ互換の問題を解決するため、以前の書いた記事のように ES や SCSS をコンパイルして使うことが増えてきました。ただ環境を用意するのにいろんなツールがあって気軽に ES や SCSS を使う人にはツラい。

という事で自分なりに必要最低限ツールをまとめたパッケージを作成しました。

jaxx2104/gulp-sample https://github.com/jaxx2104/gulp-sample

主な機能

ES と SCSS のライブコンパイル
Node.js による Web サーバとライブリロード
ファイル圧縮とソースマップ・ドキュメント生成
Slack へのアラート

これらの設定はgulpfile.jsに書いてます。

事前にインストール必要なツール

このツールは Node.js 上で動作します。公式から最新版をダウンロードしてください。

Raspberry Pi と irMagician を使って家をスマートホーム化する

暑い季節になってきました。夏の自由研究ということで電子工作と IoT に挑戦したいと思います。

エアコンをリモートコントロールできたら快適だなぁと思ったので、家をスマートホーム化してみました。

HomeKit と Homebridge

まずどうやってスマートホーム化するか。

iOS の Homekit というものを使えば iPhone から Homekit 対応した家電を操作できます。

今後 iOS 10 で Home アプリケーションも出て対応製品も出てくるはず、でも現在日本ではこれを扱った製品はあまり多くありません。

で既存製品でも対応できるよう Homebridge という Node.js のライブラリが公開されています。

nfarina/homebridge https://github.com/nfarina/homebridge

今回はこの Homebridge を使って開発しようと思います。

Bebelを使ってJavaScriptをES2015で書く

ES2015(ES6)について

去年 2015 年 6 月に JavaScript の標準仕様の ES2015 が正式にリリースされ、自分も最近 ES2015 で書くことが多くなってきました。クラス定義やアロー関数、定数など非常に便利です。

詳細は以下の URL が分かりやすいです。

ECMAScript 2015 Features https://babeljs.io/docs/learn-es2015/

Node.jsとnpmインストールとアップデート

Node.js と npm インストール

$ sudo yum install nodejs npm -enablerepo=epel
$ sudo yum install gcc gcc-c++

n のインストール

$ sudo npm install -g n

n を使って Node.js のアップデート

$ n -stable
$ sudo n -stable
$ sudo n -latest
$ sudo n latest

nam のアップデート

$ sudo npm update -g npm
$ sudo npm update -g
$ sudo npm outdated -g

こんな感じでサーバ上に JS を動かすことができる

$ node
> console.log("hello world!")
hello world

FuelPHP で「oops an unexpected error has occurred」の画面が出た場合

環境変数の値を変更するとエラー内容を表示できる。

Apache の場合

httpd.conf

# SetEnv FUEL_ENV PRODUCTION
SetEnv FUEL_ENV DEVELOPMENT

nginx の場合

nginx.conf

# fastcgi_param FUEL_ENV "PRODUCTION";
fastcgi_param FUEL_ENV "DEVELOPMENT";

インストール方法 - インストール - FuelPHP ドキュメント http://fuelphp.jp/docs/1.8/installation/instructions.html

SwiftとSpriteKitでアプリ開発1:プロジェクト作成からシミュレータ実行まで

iOS の新プログラミング言語 Swift をゲームアプリケーションを作りながら触りたいと思います。

フレームワークは SpriteKit を使います。

プロジェクトの作成

まず Xcode を App Store からインストールし立ち上げ、[File] -> [New] -> [Project] -> [Game] と選択します。Language は Swift で、GameTechnology は SpriteKit にします。

next を押すとプロジェクトの保存場所を聞かれます。

Titaniumで初アプリを作った際に参考にしたサイト

アプリケーションを作った際に、参考にしたサイトについて初心者目線ですが紹介したいと思います。

Titanium は以前に少しだけ触ったことがあって、その時は「Resources/app.js」に書く Classic なものでした。

個人的にアプリケーションを作りたい衝動にかられて開発環境も不十分なくせに、 iOS Developer Program に 7,800 円払ってしまったこと。また数年さわっていない間に MVC フレームワーク「Alloy」が出ていておもしろそうだったので Titanium を使って初アプリケーションを作ることにしました。

ドキュメント

公式ドキュメントを読んで開発環境と Alloy の基本構成は理解できました。

Titanium 3.X - Appcelerator Docs http://docs.appcelerator.com/titanium/3.0/#!/guide

Googleタグマネージャーを使ってスクロール計測

2014/12/05

JavaScript

Google Tag Manager

GoogleAnalytics で離脱率や平均セッションを見ていて、ユーザーがページのどこまで目を通しているのか気になりました。

海外の技術ブログや GitHub でも評価のある、「Scroll Depth」というライブラリを使用します。要件として jQuery1.7 以上です。

Scroll Depth http://scrolldepth.parsnip.io/

これとタグマネージャーを連携してスクロール計測を行いたい思います。

tmhOAuthを使ってTwitterに画像付きで投稿する

2014/10/30

PHP

Twitter API

Twitter API を使って画像付きで投稿する場合、ライブラリの tmhOAuth で簡単に認証とリクエスト行うことができます。

themattharris/tmhOAuth https://github.com/themattharris/tmhOAuth

OAuth 認証

Twitter への認証の際に使う、認証鍵は Twitter Developers にて取得します。

Twitter Developers https://dev.twitter.com/

htaccess によるURLパラメータの書き換え

2014/10/23

PHP

URL パラメータの書き換えることってそんなになにけど、プログラムのアップデートやら改修やらで仕様変更などで旧仕様のパラメータを新仕様へと書き換える必要があったので備忘録としてメモります。

URL パラメータの変更例

以下を例にしてみます。

変更前

/test/index.php?page=1&mode=entry

変更後

/test/index.php?type=entry&page=1

mod_rewrite を使って書き換える

.htaccess を以下のように設定する。

RewriteBase /test/
RewriteCond %{REQUEST_URI} index.php
RewriteCond %{QUERY_STRING} ^page=(\d\d?)\&mode=(entry|comment).*?$
RewriteRule index.php index.php?type=%2&page=%1 [L,R=301]

これで OK です。

ページ番号が 2 桁まで、モードが記事 or コメントとなっている部分、サンプルなので要件に合わせてよく考えて設定してください。

最近よる冷えてきたのでつらいもん食べたい。

PHPで特殊文字をデコードする

2014/10/21

PHP

Twitter などでは絵文字が使えます。

Twitter の埋め込んだサイトの HTML ソースを利用する際など、 HTML エンティティを含んだ文字列をこちらでデコードしたい場合。以下のようにします。

$text = html_entity_decode($text);
$text = mb_decode_numericentity($text, array (0x0, 0xffff, 0, 0xffff), 'UTF-8');

CentOS7にLAMP環境とWordPress構築[さくらVPS]

さくら VPS を CentOS7 へアップデートしました。いろいろ変更点あったので備忘録としてメモしました。

CentOS7 アップデート

OS のインストールとネットワーク周りはさくらの管理画面から。「OS 再インストール」->「カスタム OS インストール」

正規表現で特定の文字を含まない方法

2014/08/02

正規表現

正規表現を使って以下の対象 URL をマッチさせる。

対象文字列

http://jaxx2104.tumblr.com/post/76844550315

スラッシュを含まない文字列にマッチ

パターン文字列

;/[^¥/]\*/

windows版 emacsで日本語ディレクトリ内のファイルがおかしくなった時の対処方法

Window マシンに Emacs を入れた際に、日本語ディレクトリ内のファイルを開くと中身が空の状態になってしまいます。

原因は文字コードのせい

init.el もしくは.Emacs に以下の一文を追加してください。

(setq default-file-name-coding-system 'japanese-shift-jis)

これで問題なくファイルが開けるはずです。

MySQL server has gone away エラーが出たときの対処方法

2014/05/11

PHP

MySQL

PHP から MySQL に接続していて以下のエラーが出た、原因がつかめなくて詰まったが。解決したのでメモ。

Warning: mysql_query(): MySQL server has gone away
Warning: mysql_query(): Error reading result set's header

アプリ開発時にiOS7のUI・アイコンなどで参考になったサイト

仕事終わりと休日を使ってアプリケーションを作り始めました、個人制作だと細かいところに時間をかけられない場合があります。そんな時、参考になったサイトをまとめてみました。

ペーパープロトタイピング
AI ベクタ
色
UI のサイズ
ボタン・アイコン

ペーパープロトタイピング

印刷するとペーパープロトタイピングのテンプレートになる。紙に書くと要素の大きさとか位置とかが検討しやすい。

Free Printable iPhone 5, iPhone 5s, and iPhone 5c Templates https://dribbble.com/shots/728257-Free-Printable-iPhone-5-Templates?list=popular

AI ベクタ

iOS 7 の各パーツがセットになった AI ベクタ

iOS 7 iPhone AI Download https://dribbble.com/shots/1152667-iOS-7-iPhone-AI-Download

色

iOS 7 で使われている色をチートシートにしているサイト

なんか Android っぽい色使いになった時とか参考にするとよいかも。

iOS 7 colors http://ios7colors.com/

UI のサイズ

iOS 7 とそれ以前の UI サイズ比較したチートシートにしているサイト

デバッガで要素のサイズを 1 つずつ取得するより、一覧で見れるのでよいです。

The iOS Design Cheat Sheet 7 http://ivomynttinen.com/blog/the-ios-7-design-cheat-sheet/

ボタン・アイコン

iOS 7 に合いそうな白黒で多様なボタンを公開しているサイト

アプリケーションのイメージとマッチする場合は導入してみてはどうでしょうか。

iconmonstr http://iconmonstr.com/

WordPressでBootstrapのPaginationを実装する

こんにちは、今日から三連休ということで、ワークスペースを利用してブログ書きます。

では WordPress で Bootstrap の Pagination を実装方法について、

メモしていきたいと思います。

bootstarap の Pagenation http://getbootstrap.com/components/#pagination

iOS Safari用 Evernoteのブックマークレットの作成

iPad や iPhone でも Web のクリップを手軽にしたいので、ブックマークレットを用意した、快適な Evernote Life を。

使い方

Safari に適当なサイトのブックマークを追加
そのブックマークの名前欄を「Evernote に追加」とかにする。
さらに URL 欄は以下をコピー&ペーストして保存する。

javascript:%28function%28%29 %7b%0d%0a%09EN_CLIP_HOST %3d %27http%3a%2f%2fwww%2eevernote%2ecom%27%3b%0d%0a%09try %7b%0d%0a%09%09var x %3d document%2ecreateElement%28%27SCRIPT%27%29%3b%0d%0a%09%09x%2etype %3d %27text%2fjavascript%27%3b%0d%0a%09%09x%2esrc %3d EN_CLIP_HOST %2b %27%2fpublic%2fbookmarkClipper%2ejs%3f%27 %2b %28new Date%28%29%2egetTime%28%29 %2f 100000%29%3b%0d%0a%09%09document%2egetElementsByTagName%28%27head%27%29%5b0%5d%2eappendChild%28x%29%3b%0d%0a%09%7d catch%28e%29 %7b%0d%0a%09%09location%2ehref %3d EN_CLIP_HOST %2b %27%2fclip%2eaction%3furl%3d%27 %2b encodeURIComponent%28location%2ehref%29 %2b %27%26title%3d%27 %2b encodeURIComponent%28document%2etitle%29%3b%0d%0a%09%7d%0d%0a%7d%29%28%29%3b

あとは Evernote に保存したいサイトで登録したブックマークレットを押すと…。

アプリケーションとかページ遷移せずに保存できる。

jQueryを使って指定した要素へのスクロールアニメーション

2014/02/10

JavaScript

ご飯が炊けるまで時間があるので、ちょっとだけメモします。

指定した要素にスクロールするボタンを jQuery で書きます。

HTML

<span style="line-height: 1.5em;">
  <div id="page-scroll-button">スクロール！</div>
</span>

書き方はどうあれ、こんなボタンがあったとしましょう。

jQuery

こんな感じ。

ほんとにチラシの裏にでも書けっていう内容ですみません。

ごはん炊けました。晩御飯ですよ〜(^^)

Zabbix と AWS SES による死活監視とアラートメールの送信方法

Zabbix のメールスクリプトを設置

参考 : http://www.zabbix.jp/node/1441

# cd /usr/local/src/
# git clone git://github.com/zabbix-jp/plugins.git
# mv plugins zabbix-jp-plugins
# cp -a /usr/local/src/zabbix-jp-plugins/notification/sendmessage-smtp-php /etc/zabbix/alertscripts/
# chmod 755 /etc/zabbix/alertscripts/sendmessage-smtp-php/sendmessage_smtp_php.sh

AWS での死活監視とアラートメールの送信方法

2014/01/24

AWS

Twitter API

AWS での死活監視とアラートメールの送信方法がいくつかあり、

そのメリット、デメリットについて調べものをしたのでメモ。

AWS Clowd Watch (AWS 備え付けの監視ツール) を使う

監視からアラートメールまで AWS Console の設定で済む

ログが 2 週間しか残らないため非推奨とのこと。

[CloudWatch]グラフの確認方法と確認できるグラフ一覧(EC2/ELB/RDS) http://dev.classmethod.jp/cloud/aws/cloudwatch-can-be-seen-graph/

Amazon EC2 編～ EC2 インスタンスを監視するには～ http://recipe.kc-cloud.jp/archives/258

CentOS 6.4 に emacs 24.3 をインストールする

事前にインストールしておくべきもの。

$ sudo yum -y install gcc make ncurses-devel`

Emacs 24.3 をインストールする。

Emacs をダウンロードします。50MB くらいありました。

2014.01.13 時点での最新バージョンは 24.3 です。

最新バージョンの確認は公式で確認してください。

$ wget http://ftp.jaist.ac.jp/pub/GNU/emacs/emacs-24.3.tar.gz

解凍します。

iOS , Androidアプリ内WebView での User Agent について

WebView での User Agent ってどうなるんだろう？

WebView で構成されたハイブリッドアプリケーションを開発しようと思った。

既存の Web サイトでも User Agent でアプリケーションか Web かを判断できれば、

CSS でスタイルの切り分けとかができてよいんじゃないかと思った。

iOS

iOS 7 Safari の User Agent

Mozilla/5.0 (iPhone; CPU iPhone OS 7_0 like Mac OS X) AppleWebKit/537.51.1 (KHTML, like Gecko) Version/7.0 Mobile/11A465 Safari/9537.53

iOS 7 WebView の User Agent

Mozilla/5.0 (iPhone; CPU iPhone OS 7_0 like Mac OS X) AppleWebKit/537.51.1 (KHTML, like Gecko) Version/7.0 Mobile/11A465

Evernote Market でMacBookAirのケース買った

Evernote がネットでセレクトショップ始めたようですので、おしゃれだった MacBook ケースを買ってみました。

お値段は商品 ¥4410 + 送料 ¥600 でした。商品は注文してから 2, 3 日で届きました。

Titanium 3.2 から statusbarの文字色を白くする方法が変更になった

ナビゲーションや背景を暗くした時に statusbar の文字色を白にしたかったんだけど、書き方が変わっていたのでメモ。

Titanium 3.2

tiapp.xml

<ios>
    <plist>
        <dict>
            <key>UIStatusBarStyle</key>
            <string>UIStatusBarStyleLightContent</string>
        </dict>
    </plist>
</ios>

Titanium 3.2 で Genymotion を使って遅いAndroid エミュレータから解放される

Android エミュレータ = 重い

立ち上がりまでが重いですよね。

開発していてログとか取るのも一苦労です。

Titanium + Genymotion

最近は仮想マシンとして Android エミュレータを立ち上げる Genymotion を使うのが主流みたいで、 Titanium も使えないかなと思ったら、バージョン 3.2 から対応したみたいです。

さっそく有効にしてみたいと思う。

CentOSにLAMP環境構築からWordPressインストールまでの手順

LAMP 環境構築を数ヵ月ぶりにやったらいろいろと変更している部分があったので更新。

WordPress のインストールは実際の作業ではやっていないので少し省いてます。

CentOS バージョン確認

サーバに CentOS をインストールしたらバージョンを確認します。

$ rpm -qa | grep centos-release

yum アップデート

$ yum -y update

開発ツール一式

必要最小限の構成の場合は一つ一つ入れますが今回は一気にインストールします。CentOS6 の場合「開発ツール」の後ろ全角スペースが必要でした注意してください。

ハイゼンバグって何だろうと思ってWikipedia見たら面白かった

2013/12/04

メモ

ハイゼンバグって何だろう

勉強していて調べたら Wikipedia に載っていた。

そして個人的におもしろかったのでメモさせてください。

特異なバグ - Wikipedia http://ja.wikipedia.org/wiki/特異なバグ

AWS SDK for PHP2 を使って S3 に画像をアップしてみた

AWS 登録してみたのでさっそく触ってみました。

登録には携帯番号やクレジットカードが必要でした。

AWS の操作は以下４つの方法がある。

AWS Management Console
AWS SDK
AWS CLI
AWS Query API

AWS Management Console

AWS の Web 管理画面上で手動にて操作を行う。

Google Cloud Console から Google Cloud Messaging を有効にする

Google Cloud Messaging

Twitter API

Google APIs Console じゃなくなった。

Google APIs Console から Google Cloud Console に変わって、見た目もずいぶん変わってしまいました。

プロジェクト単位の管理画面

Create Project を押すと本人確認を求められます。

自分は電話認証にしました、非通知でかかってきた電話に出て、言われた通りに認証番号を入力します。

Macbook Air 買ったので環境構築します

今週末 Macbook Air 13 インチの梅買いました。メモリ４GB でも Xcode サクサクです。

経緯

今まで NVIDIA 搭載していて 3D CAD なんかもバリバリ動いてた ThinkPad の T420si を使っていました。勉強会で持ち運んだりアプリケーション作ったりっていう使い方になってきたのでオークションに出品して、それを元に買いました。

Ti.Filesystemを使ってiOSとAndroidでローカル保存

2013/11/22

JavaScript

Android

applicationDataDirectory

externalStorageDirectory

iOS

Ti.Filesystem

Titanium

ローカル保存できる場所は各プラットフォームごとで違いがあってややこしいけど、下のように書くのが差分も少ないかなと…。

function doSaveFile(data) {
  var cachefileName = "test.txt"
  var cacheFilePath = Ti.Filesystem.applicationDataDirectory + "cache/"
  var directory = Ti.Filesystem.getFile(cacheFilePath)
  //ディレクトリが存在しない場合
  if (!directory.exists()) {
    directory.createDirectory()
  }
  var cacheFile = Ti.Filesystem.getFile(cacheFilePath + cachefileName)
  var cacheFileData = OS_IOS ? cacheFile.read() : cacheFile.read().text
  if (cacheFileData) {
    //append
    cacheFile.write("add : " + cacheFileData + data)
  } else {
    //new
    cacheFile.write("new : " + data)
  }
}

applicationDataDirectoryでなくexternalStorageDirectoryにすると、外部ストレージに保存されます。ほかのアプリケーションで使ったりできるようなファイルを生成する場合はお勧めです。

ファイルに追記する場合はキャッシュ File.append すればよいと思ったけど、Android はそもそも append が使えないのでこんな感じになってます。

TitaniumでデバイスのOSバージョンの取得

アプリケーションを iOS 7 のデザインへ対応するとき新しいナビゲーション部分に回りこんでしまうため、iOS 7 のみで分岐が必要になってきます。

正直この分岐は納得いかない。

MacのターミナルのプロンプトをLinuxっぽく変える

初期状態だとこんな感じ

iMac:~ jaxx2104$

変更

このサイトでどんな表示になるのかを確認しながら変更できる。

Bash $PS1 Generator http://www.kirsle.net/wizards/ps1.html

出力結果を.bash_profile に書けばよいだけ

emacs .bash_profile

自分はこう書いてます。

export PS1="[\u@\h \W]\\$ "

反映

sourse .bash_profile

するとこんな感じになる。

[jaxx2104@iMac ~] $

おしまい。

馬喰町のアガタ竹澤ビルとPalette bldgに行ってきた

辛酸なめ子のギャラリー探訪記「アガタ竹澤ビル」 http://www.artgene.net/labo/theme/cat243/post_45.php

Titaniumで作ったAndroidアプリ起動時に"application restart is required"が出る

application restart is required

今日は Titanium で Google Play に公開したアプリケーションについて。

Google Play の「開く」かアプリケーションのショートカットから起動すると “application restart is required” と表示されるエラーに悩まされた。

環境

起動時にこんなエラーが出る

WordCamp Tokyo 2013 に行ってステッカーたくさんもらった。

去年に続き、今年も参加してきました。楽しかったぞ！

12：30 会場に到着

電車に揺られうとうとしながら着きました。会場は大田区産業プラザ PIO です。

Titaniumもくもく会にてTシャツを頂きました

2013/09/13

JavaScript

Titanium

Titanium もくもく会初参加しました。

emacsのinit.elが読み込めないときの対処方法

開発環境を移行したとき Emacs の設定ファイルの init.el が読み込めなくって、ちょっと困ったけどあっさり解決したので備忘録メモ。

.Emacs と .Emacs.el が存在する場合は前者が優先的に読み込まれるので.Emacs を削除すればよい。

~/.emacs  <- こちらが優先的に読み込まれる
~/.emacs.d/init.el

これで読めました。

またほかの方法としては

.Emacs には ~/.Emacs.d/init.el を読ませるだけで設定は init.el に書くっていうのもある。

(load (expand-file-name (concat (getenv "HOME") "/.emacs.d/init")))

こっちのほうが運用しやすいのかも。

iPhotoを使って旅行のフォトブックを作ってみた

iPhoto を使ってフォトブックが簡単に作れるみたいですので、ためしてみる。

ではさっそく作っていきます！

フォトブックの種類とサイズ。テーマを選んで写真を配置していく。

WordPress3.6で「jquery-1.10.2.min.map not found」のエラーが出る

2013/08/25

JavaScript

WordPress

Chrome のデバッグツールを開いてみると、「jquery-1.10.2.min.map not found」のエラーが大量に出てました。

調べてみると WordPress のバージョン 3.6 を使っていて、プラグインのどれかで jQuery のエラーが出ているとのこと。

WordPress 3.6 and jQuery.BlockUI Version problem http://wordpress.org/support/topic/wordpress-36-and-jqueryblockui-version-problem-solution

自分はプラグイン側が対応するまでいったん停止することにしました。

Macでllコマンドを使えるようにする

Linux でよく使うんですが、Mac は初期状態だと使えない。

なので.bahs_profile にエイリアスを設定します。

emacs .bash_profile

alias ll='ls -l'

PHPで文字コードをUTF-8にする

PHP 部分で文字化けが起きた場合

この一行を追加する。

header('Content-Type: text/html; charset=UTF-8');

WordPressのウィジェットプラグインを自作する

右カラムのつぶやきを 1 件表示するプラグインを作った時のメモ

このままだと[外観]->[ウィジェット]の欄に「Get Twitter」が追加され、サイト上に「サンプルです」と表示されるので、この部分を置き換える。

/wp/wp-contents/plugin/test/test.php

<?php
/*
Plugin Name: Get Twitter
Plugin URI: http://jaxx2104.info
Description: Twitterを表示するプラグイン
Author: jaxx2104
Version: 0.1
Author URI: http://www.jaxx2104.info
 */

class GetTwitter_Widget extends WP_Widget {
  //1.[外観]->[ウィジェット] での表示
  public function __construct() {
    parent::__construct(
      'getTwitter_widget', // Base ID
      'Get Twitter', // Name
      array( 'description' => __('TwitterAPIを使って、つぶやきを表示するプラグイン', 'text_domain'), ) //desc
    );
  }

  //2.サイト上での表示
  public function widget($args, $instance) {
    extract($args);
    $title = apply_filters('widget_title', $instance['title']);
    echo $before_widget;
    if (!empty($title))
    echo $before_title . $title . $after_title;
    echo 'サンプルです'; //ウィジェット本体
    echo $after_widget;
  }

  //3.フォーム(4)の情報をサイト(2)へ渡す
  public function update( $new_instance, $old_instance ) {
    $instance = $old_instance;
    $instance['title'] = strip_tags($new_instance['title']);
    return $instance;
  }

  //4.[外観]->[ウィジェット] でのフォーム
  public function form( $instance ) {
    if ( $instance ) {
      $title = esc_attr($instance['title']);
    }
    else {
      $title = __('New title', 'text_domain');
    }
    echo sprintf('<p><label for="%s">%s</label><input class="widefat" id="%s" name="%s" type="text" value="%s" /></p>',$this->get_field_id('title'),_e('Title:'),$this->get_field_id('title'),$this->get_field_name('title'),$title);
  }
}

add_action('widgets_init',
           create_function('', 'register_widget("GetTwitter_widget");')
           );

?>

プラグイン作るの楽しいぞ！

夏の奈良は大人の旅でした。

昨日、高速バスに乗って奈良につきました。やはり盆地だけあって暑いけど、よい一日目でした。

燈花会の写真

夏季休暇を使って旅行に行きます。

飛び出し坊や

今日から夏季休暇です。旅行に行ってきます。

2 泊 3 日で行きはバスで帰りは、新幹線です。

デジタルカメラとノート PC 持っていくので、たくさん写真撮って時間あればブログ更新しよっと。

PHPで改行コードを（LF）に統一する方法

最近アイスコーヒーばっかり飲んでいる。

PHP で改行コードを LF（\n）に統一するには、

$str = preg_replace("/\r\n|\r/","\n",$str);

としてあげるだけ。

コーラとバグが好き

jaxx2104 on Profile

Dialogflow + Raspberry Pi でスマートな定点カメラを自作する

自作キーボード沼に最短でハマるまでの手順書

概要

我が家のスマートホーム2.0計画

3 大 AI アシスタントを全部試してみて

Xiaomi 家電のコスパが良すぎる

Vue.js Tokyo v-meetup #8 に行ってきた

Vue Fes Japan 2018 に向けたお知らせ

2018年の夏休みメモ

iPadで静的サイトジェネレータを更新する

同期設定

エディタ

3ヶ月前に転職しました。

前職では何をやっていたか

転職を考えるきっかけ

どこへ行っても大切だと思うこと

本をSiriに読んでもらう

本を読む必要について

本を効率よく読むために

Atom から VScode のエディタ移行と拡張機能について

拡張機能

テーマ

言語

整形/スニペット系

その他

いまさらですが2016年を振り返る

IoT 関連

人喰いの大鷲トリコ

JavaScript で Arrow 関数を使った時の this の代わり

Arrow 関数の場合

React.js製の静的サイトジェネレーターGatsbyに移行した

Gatsby の特徴

Gulp タスクランナーを使ったフロントエンド開発環境

主な機能

事前にインストール必要なツール

Raspberry Pi と irMagician を使って家をスマートホーム化する

HomeKit と Homebridge

Bebelを使ってJavaScriptをES2015で書く

ES2015(ES6)について

Node.jsとnpmインストールとアップデート

FuelPHP で「oops an unexpected error has occurred」の画面が出た場合

Apache の場合

nginx の場合

SwiftとSpriteKitでアプリ開発1:プロジェクト作成からシミュレータ実行まで

プロジェクトの作成

Titaniumで初アプリを作った際に参考にしたサイト

ドキュメント

Googleタグマネージャーを使ってスクロール計測

tmhOAuthを使ってTwitterに画像付きで投稿する

OAuth 認証

htaccess によるURLパラメータの書き換え

URL パラメータの変更例

mod_rewrite を使って書き換える

PHPで特殊文字をデコードする

CentOS7にLAMP環境とWordPress構築[さくらVPS]

CentOS7 アップデート

正規表現で特定の文字を含まない方法

対象文字列

スラッシュを含まない文字列にマッチ

windows版 emacsで日本語ディレクトリ内のファイルがおかしくなった時の対処方法

原因は文字コードのせい

MySQL server has gone away エラーが出たときの対処方法

アプリ開発時にiOS7のUI・アイコンなどで参考になったサイト

ペーパープロトタイピング

AI ベクタ

色

UI のサイズ

ボタン・アイコン

WordPressでBootstrapのPaginationを実装する

iOS Safari用 Evernoteのブックマークレットの作成

使い方

jQueryを使って指定した要素へのスクロールアニメーション

HTML

jQuery

Zabbix と AWS SES による死活監視とアラートメールの送信方法

Zabbix のメールスクリプトを設置

AWS での死活監視とアラートメールの送信方法

AWS Clowd Watch (AWS 備え付けの監視ツール) を使う

CentOS 6.4 に emacs 24.3 をインストールする

事前にインストールしておくべきもの。

Titanium 3.2 で Genymotion を使って遅いAndroid エミュレータから解放される