ITエンジニア/デザイナ向けにオープンソースを毎日紹介

Reactを使うとなんとなくシステムが大事になってしまう雰囲気があります。そのため、大型なWebアプリケーションでないと使うのを控えてしまうでしょう。もっと手軽に小さなツールでも使えると便利なはずです。

そこで使ってみたいのがkatatemaです。Reactを使った静的サイトジェネレータです。

katatemaの使い方

katatemaはnpmでインストールできます。

npm install katatema -g

インストールしたら、pagesというディレクトリを作って、その中に index.js を作成します。例えば内容は次のようにします。

import React from "react";
export default () => <div>Hello</div>

後は katatema serve コマンドを実行すると localhost:3000 でサーバが立ち上がります。

pages/about.js の場合はURLが localhost:3000/about になります。

サイトができあがったら、katatema build で静的なHTMLができあがりますが、内容はあくまでもReactを使ったものです。ES2015とReactを組み合わせたモダンな静的なサイトを作るのに使える小さな便利ツールです。

katatemaはnode/JavaScript製のオープンソース・ソフトウェア(MIT License)です。

r7kamura/katatema: A handy static site generator using React.js

 

MOONGIFTの関連記事

コメント

  • MOONGIFTプレミアム
  • Mobile Touch