H2O Blog


H2O SPACE たにぐち まこと のブログ

Google Chromeでアクセシビリティチェックができる『ChromeLens』

Webサイトを作った後、意外と忘れがちなのがアクセシビリティのチェック。Webサービスや、ソフトウェアなどもありますが、Google Chromeの開発者ツールで手軽にチェックできるのが『ChromeLens』です。
(さらに…)


Adobe CCのPhotoshop単体版と、フォトグラフィプランの違いはクラウドストレージ

Photoshopのみを利用するスタッフのため、Adobe Creative Cloudを検討していたのですが、「Photoshop単体版」が 2,180円/月なのに対して、Photoshopと Lightroomが使える「フォトグラフィプラン」が 980円/月と、なぜか使えるソフトが増えて値段が安いプランがある。

いったい何が違うのかなと調べてみたところ、「クラウドストレージ」の容量の違いだったようです。
(さらに…)


Visual Studio Code 1.3がリリースされました

筆者もすっかり愛用するようになった、開発者向けエディター『Visual Studio Code(VS Code)』の最新バージョン 1.3がリリースされました。

(さらに…)


kintoneでメールを通知をする設定と落とし穴

kintoneでは、データが追加や変更されたときに「通知」を送ることができます。kintoneにログインしたときに「通知」欄に表示される他、スマホにアプリが入っている場合はプッシュ通知も受け取れます(かなりタイムラグがある感じですが・・)。

しかし、いずれもチェックしにくいのでメールで通知を受け取りたい場合、いくつかの設定をすれば可能になります。
(さらに…)


『実践! コンテンツファーストのWebサイト運用』を献本頂きました

アップルップル様から、2016年7月2日に発売された、a-blog cmsのオフィシャルガイドブック『実践! コンテンツファーストのWebサイト運用 a-blog cmsではじめるCMSプロトタイピング』を献本頂きました。

(さらに…)


kintoneのキーボードショートカット一覧

kintoneは、分かりやすい画面で良いのですが、クリック回数は比較的多く、また Googleサービスなどと違ってキーボードショートカットはないだろうと思い込んでいました。

しかし、実はあったようです。次に一覧表を紹介しましょう。

(さらに…)


WordPressで著者ページのURLを書き換える『Edit Author Slug』

WordPressでブログを執筆すると、標準で著者ページが準備されます。しかしこのページ、標準のURLがあまりセキュリティ上よろしくない設定です。

例えば、ユーザー名を「h2ospace」とすると、著者ページは次のようになります。

http://example.com/author/h2ospace

これを書き換えることができるプラグインが『Edit Author Slug』です。

(さらに…)


kintone上で JavaScriptが開発できる『JSEdit for kintone』

kintoneの JavaScript開発は、ファイルのアップロードかまたは外部のサーバー領域に配置した JavaScriptファイルを読み込ませるしかありません。しかし、『JSEdit for kintone』を利用するとこれが解消できました。

(さらに…)


Kintone APIからデータを取得する

Kintoneのデータベースから、データを取得します。

APIトークンを利用したやり方を試したかったのですが、「ログインしてください」というエラーが表示されてしまい、うまく行かなかったため、ここではユーザー認証を利用した方法を使っています。

$user_id = '';
$password = '';
$sub_domain = '';

// 送信ヘッダーを作る
$opts = array(
    'http' => array(
        'method' => 'GET',
        'header' => 'X-Cybozu-Authorization:' . base64_encode($user_id . ':' . $password) . '\r\n'
    )
);
$context = stream_context_create($opts);

// APIを叩く
$contents = file_get_contents('https://' . $sub_domain . '.cybozu.com/k/v1/records.json?app=5', false, $context);
if (!$contents) {
    die('Error');
}

print_r(json_decode($contents));

records.json の部分を、機能によって使い分ければ、さまざまな用途で利用できます。


Cordovaプロジェクトを Android端末で動作させる手順(Windows 10)

Cordovaのプロジェクトを、Androidの端末で動作確認するまでに、少し試行錯誤したのでメモ。

Visual Studio 2015をセットアップ

Cordovaを動作させるには、依存するものがいくつかあるようですが、Visual Studio 2015をインストールすればまるっとインストールしてくれるようです。

「新しいプロジェクト」を選び、JavaScript→Apache Cordova Apps→Install Tools for Apache Cordova Update 5を選ぶと、インストール作業が始まります。延々かかります。

NodeJSとコマンドラインツールのインストール

続いて、Node.jsを入れて、以下のコマンドでCordova自体もインストール。

npm install -g cordova

プロジェクトの作成

cordova create hello com.example.hello HelloWorld
cd hello
cordova platform add android --save
cordova build

こうして、Cordovaのプロジェクトを作成してビルドします。次に、Android本体の準備です。

Androidをデベロッパーモードに

  • 設定→端末情報の「ビルド番号」欄を7回タップします。
  • 「開発者向けオプション」メニューが増えるので、タップ
  • 「USBデバッグ」にチェックを入れて、USBケーブルで PCと接続

Androidで動作させる

ここまで来たら、以下のコマンドで動作ができました。

cordova run android