サーバーサイド用にWebpackでプリコンパイルする

サーバーサイド用のNode.jsのソースコードをWebpackでプリコンパイル&バンドルした際に少しハマったので備忘録的に残しておきたいと思います。
ぼくの場合は、Node.jsのサーバーでReactのサーバーサイドレンダリングをする時に必要になりました。クライアントのソースコードがES2015だったりJSX使って書いてるのでそれをサーバーサイドで実行するのにWebpackしておく必要があったという感じです。

続きを読む

はじめて公式ディレクトリにWordPressプラグインを登録しました

ACF_Images_Search_And_Insert_—_WordPress_Plugins

はじめて公式ディレクトリにWordPressプラグインを登録しました。ACF Images Search And Insertというプラグインです。あまり大したものではないんですが、Advanced Custom Fields(ACF)の画像フィールドにCC0の商用利用可なフリー素材を検索して差し込んでいけるというものです。

WordPressとACFを使って図鑑のようなコンテンツサイトを作成する場合にはある程度役に立つと思います。

続きを読む

Webpackを使ってみる

Redux界隈だとHot Module Reloading(HMR)が特徴な事もあって、モジュール管理にWebpackが使われる事が多いです(HMRはWebpackの機能)。今までStarter Kitを利用していたので既存の設定で動かすことが多かったのですが、基本的な動作の確認のためにゼロから設定を作ってみたいと思います。

続きを読む

Reactで簡単なアニメーションを実装する

ReactのCSSTransitionGroupを利用して簡単なエフェクトを実装します。CSSTransitionGroupはCSSのアニメーションをReactで手軽に利用できるように作られたものです。

Animation | React

続きを読む

Reduxを動かしながら理解する

巷で話題のReduxを仕事で使えそうです。ただReact/fluxを半年前に趣味のサービス開発でけっこう触っていたのに、Reduxはドキュメントを読んだだけではピンと来ず…。動かさないと分からないので、スターターキットを利用しながら実際に触ってみたいと思います。

react-redux-starter-kit

https://github.com/davezuko/react-redux-starter-kit

スターターキットのくせにスターが2000以上ついてるスゴイやつです。

続きを読む