Umi Uyuraのブログ

プログラミング関連の作業ログ

Node.js

WindowsのNode.jsバージョン管理をNodistからfnmに変えてみる

これまでWindowsでNode.jsのバージョン管理はNodistを使っていましたが、改めて環境構築を構築をしていくにあたってMicrosoftのドキュメントを眺めていたところ、Nodist以外にもそういったツールがあることを知りました。 NodeJS をネイティブ Windows 上に…

LINE BOT事始め&倍返しBotを作ってみた

初回分には乗り遅れてしまったのですが、追加募集が始まったようなので応募してみました。 【LINE】「LINE BOT API Trial Account」の追加募集を開始 | LINE Corporation | ニュース 2016/6/9現在、追加募集分枠はまだ終了していないようです。 とりあえずど…

Asana用BitBarプラグインを作ってみた

少し前から、個人プロジェクト用に Asana というプロジェクト管理サービスを試しています。 お仕事では Backlog を使っていて、こちらはタスク管理やWiki、ファイル管理にバージョン管理と、プロジェクト管理に必要な機能を全て備えていると言っても過言では…

ESLintの設定事始め

先日、とりあえずEmacsでESLintを使う環境を作ってみましたが。 umi-uyura.hatenablog.com チェック内容を設定しておかないと意味がないので、基本的なものだけでも設定しておこうと思い、調べてみました。 設定ファイル雛形の生成 そもそも、これまでESLint…

EmacsのESLint環境をセットアップした

以前、EmacsでReact(JSX)コーディングする環境について調べた際に、JSXの構文チェックとして JSXHint を使うようにしました。 umi-uyura.hatenablog.com ところが、こちらの記事によると、どうやらすでにJSXHintはDeprecatedになっていて、ESLintへの移行を…

Appcelerator CLIとNode.js絡みでつまずいたことを書きました

久々にQiitaに投稿しました。 Titanium - Appcelerator CLIで [Error: Module did not self-register.] と出るようになった - Qiita Titanium - Appcelerator CLI Coreのインストールでbufferutilのビルドがエラーになる - Qiita どちらも、Node.jsのバージ…

Meld LauncherをElectronに移植してみた

ちまたではNW.jsよりElectronの方がフィーバー(死語)している感じなので、ちょっと触ってみることにしました。 とりあえずHello World的なものをやろうかと思ったのですが、ざっと眺めた感じ、作り方はわりと似ている印象だったので、ここはひとつ、NW.js…

NW.jsのパッケージング方式の見直し

先日、自分用のReactのプロジェクトテンプレートの構造を見なおしたついでに、 React + NW.jsのテンプレートの方 (umi-uyura/react-on-nwjs-sample) も同じ方針で改良しておくことに。 umi-uyura.hatenablog.com ついでに、以前のテンプレートでは配布形式の…

自分用Reactひな形プロジェクトのプロジェクト構造を見直し

先日、Reactの勉強用に作ったプロジェクトのひな形( umi-uyura/my-react-boilerplate )ですが、プロジェクトの構造を変更することにしました。 umi-uyura.hatenablog.com 気になってきたところ 当初の構造は以下のような感じでした。 . ├── README.md ├── …

React + Material UI + Moment.jsでタイムゾーン変換ツールを作った

海外のWebinarを見たりする際などに 9:00 AM PST って日本時間のいつになるの?というのを調べることがあるので、タイムゾーン変換ツールを作ってみました。 GitHub Pagesで公開しています。 TimezoneConv ソースはこれです。 umi-uyura/timezoneconv 良かっ…

React + BrowserifyプロジェクトでJS/CSS/HTMLを圧縮(Minify)する

ReactとMaterial UIを組み合わせると、それだけでBrowserifyで結合したJavaScriptファイルが1MB超えてしまうので、やっぱり圧縮とかした方が良いのかな―と思い、やり方を調べてみました。 ※2015/08/03更新 Licensifyを開発された @t_wada さんから改良の連絡…

React + Browserify + Babelify環境の自動リロードにBeefyを使ってみた

最近Reactを少し触っていましたが、業務の関係もあって、純粋なWebサイトではなく、主にNW.jsのUI構築用に使っていましたが、せっかくなので、シングルページなWeb制作でも使っていけるようにしようと思って、試しています。 NW.jsのときに作ったBrowserify …

Browserify環境でMoment.jsの国際化を利用しようとしたときのメモ

ちょっとした日時計算をするだけのペライチなWebページを作ろうとしていました。 日時情報を取り扱う処理を実装するので、定番の Moment.js を組み込んでいたのですが。 UI部分は最近取り組んでいるReactを使うことにして、JSXの変換も済ませた形で組み込む…

React + NW.jsにデザインフレームワークとしてMaterial UIを組み合わせてみた

私はデザインセンスがかけらもないので、UI部分については、どうしても素っ気ないものになってしまいます。 最近取り組んでいるReact + NW.jsですが、そのまま作ると素のHTML要素が並ぶことになるので、せめて基本的なコンポーネントくらいは見栄えを良くで…

Browserify + ReactifyにWatchifyを導入してJSXの自動ビルド環境を作った

引き続き、Browserifyを勉強中。 React(JSX)開発にBrowserifyとReactifyを導入 - Umi Uyuraのブログumi-uyura.hatenablog.com react-tools(jsx)でやっていた、.jsxの変更を監視してビルドできるようにするため、 Watchify を導入してみることにしました。 イ…

React(JSX)開発にBrowserifyとReactifyを導入

そろそろ <script> タグではなく、Node.jsらしく require でモジュール読み込みしたくなってきたので、Browserifyを試してみることにしました。 ベースとしたプロジェクト 以前React on NW.jsの取っ掛かりとして作ったサンプル があったので、違いを理解するためにも…

NW.jsで最も簡単なLivereload

React + NW.jsで作っているツールのUIなどをいじり始めて、いろいろと編集するファイルが増えてきたので、そろそろLivereloadできた方が便利だよなーと思ってきました。 いまどき使ってないの?という感じですが、Web制作は専門ではないので…というのと、実…

React + NW.jsのプロジェクトをnode-webkit-builderで配布形式にパッケージングしてみた

先週から作っていた社内向けツールがなんとなく動いたので、Windows環境でも動くかどうかを確認するために、パッケージングすることにしました。 node-webkitのパッケージングは何度かやったことがありましたが、手動でやると若干面倒くさいので、今回は以前…

NW.js上でReactを動かしてみた

昨日NW.jsを触ってみたついでに、ツールの中身はReactを使ってみることにしました。 node-webkit改めNW.jsを触ってみた - Umi Uyuraのブログumi-uyura.hatenablog.com 今回作ろうとしているツールは、お客さんが提供しているAPIを叩いて、結果を自社で持って…

node-webkit改めNW.jsを触ってみた

以前少しnode-webkitを触って、ちょっとした社内ツールなどに使ってみていました。 node-webkitを触ってみた - Umi Uyuraのブログumi-uyura.hatenablog.com それからしばらく経ちますが、Node.jsから派生したio.jsの登場により、node-webkitもNW.jsと名前を…

ti-deploygate-hookをnpmに公開してみた

先日、Titanium CLIでDeployGateへPUSHするための umi-uyura/ti-deploygate-hook というものを作ってみました。 DeployGateへpushするTitanium CLIプラグイン ti-deploygate-hook を作った - Umi Uyuraのブログumi-uyura.hatenablog.com で、せっかくなので…

npmパッケージの変更内容を確認するには?

たまに npm update -g をして、使っているnpmパッケージ群を最新バージョンに更新しているわけなんですが。 使用頻度が高いようなものだったりすると、何が変わったのか詳しく知りたい場合があります。 そこでふと、更新されたnpmパッケージの変更履歴を手軽…

アクセス元のIPアドレスをメールで通知してくれるサイトを作ってみた(Heroku Button対応)

かれこれ2週間前くらいのことですが、会社の先輩のところに某メッセンジャーサービスのアカウント乗っ取り詐欺のメッセージが来ました。 魔法の言葉を返そうとか、アクセス元調べようとか話してたんですが、初めて目にした実際の詐欺メッセージを前にわたわ…

node-webkitを触ってみた

ズルズルときていた年度末案件がようやく収拾ついてきたので、なんとか次に向けての動きがとれるようになってきた今日このごろ。 業務にて、エンジニアではない人向けにちょっとしたツールを作る必要が出てきたので、この機会にとnode-webkitを使ってみるこ…

Herokuでルートドメインの静的サイトを構築

気づいたら、せっかくブログ立ち上げたのに3ヶ月以上放ったらかしでした。 週一くらいでアウトプットしていきたい。 無料で静的Webサイトを公開するには 年度末ということもあって、使っている外部サービスなどを整理していたところ、クラウドのサーバーを借…