フロント苦手な私にはFrascoが最高のツールだった件
先日のRuby関西で紹介されてた Frascoというツールがとても良さげに感じたので、帰って早速使ってみました。
Frascoとは
Quick starter project for Jekyll including full setup for gulp, Sass, Autoprefixer, Bourbon/Neat/Bitters, Webpack, Imagemin, Browsersync, etc.
だそうです。 要は、JekyllでWebサイトつくるときに、便利なツール類まとめておいたから、さくっと始められるよ。ってことです。
DojoCon JapanのサイトもFrasco使ってるそうです。
GitHub Pages で Jekyll 使ってる人には便利だと思います。ちなみに DojoCon Japan のサイトはこれを使ってます。Frasco: Jekyll Starter Project https://t.co/zXv8c0QiMG
— Kite (@ixkaito) 2016年7月18日
Frascoの使い方
とりあえず、 jekyll
と npm
のインストールは必要です。それぞれ、自分のマシンにインストールしておいてください
それさえあれば、あとはFrasco公式ページに乗っている通り、 Frascoをcloneして、 npm install
, npm start
すればすぐに利用できます
$ git clone [https://github.com/ixkaito/frasco.git:embed] $ cd frasco $ npm install $ npm start
Frascoのいいところ
さくっとプラウザで確認できる
npm start
するだけで、Jekyllがビルドされてブラウザで確認できます。
sassなどの変更も見てくれるので、かなり快適にページ制作ができます。
とても便利で感動しました。
デフォルトでイケてるCSSフレームワークが導入されてる
これは、 Burbonと Burbon Neat がイケてるってことなんですけど、使いやすくて良いです。
sassファイルの変更も検知して、リロードしてくれるので、コーディング -> 確認の流れがスムーズで快適でした。
Frascoのイマイチなポイント
Frascoを軽く触ってみて、改善したいなと思ったポイントを挙げます。 対応できそうなものは、週末にでもPR投げると思います。
- Jekyllのバージョンが開発環境に依存
- プロジェクトのGit管理しづらい
Jekyllのバージョンが開発環境に依存
Frascoでは、gulp を通してjekyllのコマンドやその他のタスクを実行しています。
そのために、ローカルマシンの Jekyll に依存するのは、仕方ないのですが、プロジェクト内に Gemfile
などが用意されているわけではないので、Jekyllのバージョンなどの管理は完全にユーザ依存になっています。
複数人でサイトを管理するときに、(CIサービスなど使わなければ)各自のマシンのJekyllバージョンに依存することになります。
これは、ユーザ側で好きに Gemfile
を用意すればいいだけのことではあるんですが、Frasco側で推奨Jekyllバージョンみたいなのを用意してもいいんじゃないかと思いました。
プロジェクトのGit管理がしづらい
Frascoはサクッと開発できて便利なんですが、今のところFrasco本体のGitリポジトリを clone してその中で、開発を行います。 そのため、制作しているサイトを自分でGit管理するために色々と作業が必要でした。
あとは、必要に応じて READMEやpackage.json を書き換えます。 READMEは全部書き換えるだけでいいですが、package.jsonは内容を見て、部分的に書き換える必要があります。 大体、package.json 内の次の項目を書き換えるといいでしょう。
- name
- version
- description
- repository
- keywords
- author
- bugs
- homepage
- license
これは、Frascoをcloneして使うのではなく、 yo
などで、プロジェクトの雛型を吐き出すようにすればいいんじゃないかと思います。
私自身はyo
でテンプレートを作ったことはないのですが、少し勉強してできればPR投げたいなと思っています。
Frascoで作ってるもの
Frasco個人的にタイムリー!!めっちゃいいので、帰って早速使う!!!
— 口玉(I am Scala Ninja) (@Kuchitama) July 16, 2016
なにがタイムリーだったかって、ちょうどいい加減去年の大都会で宣言した A Tour of Go のScala版作るの真面目に取り組もうとしてたからです。
Jekyll使って作ろうというのは、なんとなく考えてたんですが、フロント開発が苦手で着手が先延ばしに鳴ってましたが、Frascoあれば雛型が出来上がってるので、重い腰がすっと上がりました。 これから、マジメに作ります。