Bootstrapはすてき
私はBootstrapを使って管理画面を何個か実装してきました。Bootstrapは小奇麗な画面を作れますし、広く使われていて安心感があります。
一方でBootstrapには疑問も
Bootstrapにはパネル・フォーム・ボタングループ等の便利なコンポーネントが含まれていますが、所詮は管理画面ですから、便利にしても売上につながるわけではありません。
また、<a class="btn btn-primary">
のようにデザインのためのクラスを細かく指定するのも無駄だと感じていました。
Marx
そこで紹介したいのが、Marxです。
![image.png](https://qiita-image-store.s3.amazonaws.com/0/179154/d13f530f-ebb6-15ce-b668-a87d0bbd9d3f.png)以下が、公式ページに載っているテンプレです。
なんとクラス指定は1個もありません。
<main>
、<nav>
、<ul>
などのHTML5標準のタグを使うだけで、そこそこ格好いい画面を作れます。
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="utf-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1">
<title>Marx Template</title>
<!-- Marx CSS -->
<link rel="stylesheet" href="css/marx.min.css">
</head>
<body>
<!-- main is the container -->
<main>
<!-- Navigation -->
<nav>
<ul>
<li><a href="#"><b>First</b></a></li>
<li><a href="#">Second</a></li>
<li><a href="#">Third</a></li>
<li><a href="#">Fourth</a></li>
</ul>
</nav>
<!-- article -->
<article>
<h1>Article</h1>
</article>
<!-- aside -->
<aside>
<h1>Aside</h1>
</aside>
<!-- section -->
<section>
<h1>Section</h1>
</section>
<!-- footer -->
<footer>
<p>© Matthew Blode 2016</p>
</footer>
</main>
</body>
</html>
もちろん、実際の開発ではいくつかクラスを追加していく必要があるでしょう。
そのうちやっぱりBootstrapのコンポーネントが欲しいと思うかもしれません。
しかし、最初はMarxでスモールスタートも良いのではないでしょうか?
後からクラスを追加するのは簡単ですから。