静的サイトジェネレーターのRootsを素振りする

素振り Roots

Roots？

Node.js製の静的サイトジェネレーターです。
知り合いに教えていただいたので素振りしてみました。

プロジェクトの新規作成

http://roots.cx/articles/getting-started
を見ながら流れに沿ってやってみる。

$ roots new roots-sandbox
? Your project's name: roots-sandbox
? A brief description of your project: roots sandbox
▸ project created
▸ dependencies installing
.
.
▸ dependencies finished installing
▸ project initialized at /Users/dkimura/sandbox/roots-sandbox
▸ using template: roots-base
✓ done!

プロジェクトの雛形 + 必要なnpmをインストールして完了。

作成されるディレクトリ/ファイル

基本的には、Jade, Stylus, CoffeeScriptの構成になるっぽい。

├── app.coffee - 開発環境用の設定ファイル
├── app.production.coffee - 本番環境用の設定ファイル
├── assets
│   ├── css
│   │   ├── _settings.styl
│   │   └── master.styl
│   ├── img
│   └── js
│       └── main.coffee
├── node_modules
├── package.json
├── readme.md
└── views
    ├── index.jade
    └── layout.jade

用意されているコマンド

とりあえず、基本的なコマンドだけ使ってみる。
これ以外のコマンドは、roots --helpで確認できます。

compile

public ディレクトリに静的ファイルを生成してくれる。

$ roots compile
compiling... done!

watch

http://localhost:1111/でローカルサーバーが起動する。

$ roots watch
compiling... done!

浅く触った/見た感想

  • ドキュメント見やすくて好き。
    • Stylus to SCSSも見る限りは容易…？
    • Extensionも最低限のものは揃ってるっぽい。
  • 脱ボイラープレートできそうな雰囲気はある。
    • gulpfileをメンテナンスし続けるのつらいので…
  • Node.jsで完結できるところが魅力的。

次は、Stylus to SCSSとかやって記事にしてみるかな。 f:id:daikiri1013:20160204005337p:plain 現場からは以上です。

フロントエンドかけこみ寺という名のもくもく会をやった

1/27(水)に弊社のオフィスでフロントエンドかけこみ寺という名のもくもく会を行いました。
この記事は、初めて技術系イベントの運営をした人の、きっかけ〜準備〜当日までの流れを書いています。

流し目で見れば1分足らずで読めます。

はじめに宣伝

フロントエンドかけこみ寺という名のもくもく会コミュニティを作りました。
http://frontend-temple.connpass.com/

技術レベル関係なく、ゆるっとやっていきたいと思っていますので是非お気軽にご参加ください。

きっかけ

murokaco.hatenablog.com

すでに記事が上がっていますがこんな感じ。

むろさん:「フロントエンドもくもく会やりたい！」
私:「弊社、スペースありますよー。」

いつもフザケた会話しかしてないから真剣にやると思っていなかったけど、
私も何かをキッカケに人脈広めつつ知識ほしいっていう願望があったのでやってみようかなと。

とりあえず

連絡関連の効率考えて、Slackのチーム作ってもらった。 少し使い慣れてるからっていう理由と、他サービス(GitHubとか)との連携の話とかが出てくる予想して推した。

「チームへの招待」が面倒っていう意見もあったので、下記を拝借。

outsideris/slack-invite-automation

企画

飲み会の席で運営関連(？)の方たちと会う予定があったので、この時に話を詰めた。

  • 「会の名前、どうしよう？」
  • 「どんな人に来てもらいたい？」
  • 「開催周期どうするよ？」

などなど。

お酒の力を借りて みなさんの力を借りて以下の感じにまとまった。

  • 「技術レベル関係なく、カジュアルに参加できる会にしよう」
  • 「とりあえず隔週水曜日にやりましょう」

実際はガッチリとした決めを作っていないので、
その時に応じて臨機応変にやっていきたいなといった感じです。

設備関連

弊社のオフィス、去年の11月に湯島に移ったばかりなので設備関連がよくわからないところからスタート。 とりあえず、以下の3つくらい確保しとけばいっかみたいなノリでした。

  • 電源
  • Wi-Fi
  • プロジェクター

都度都度の確認をしてしまった感があって、社内の人に少し迷惑をかけた感じありました。(ｽﾐﾏｾﾇ

公開

2日前にConnpassで公開。 http://frontend-temple.connpass.com/event/26003/

説明文で少し詰まった。
特にタイムスケジュールの話は一切してなかったので、「えっ、これ集まってからどうすんだっけ？」と。

公開後は、見守りつつSlackでアナウンスを都度行ってました。

当日

【フロントエンドかけこみ寺＠もくもく会が開催されました！】 1月27日、FFカフェスペースで、フロントエンドかけこみ寺が開催されました！軽い自己紹介のあとは各自もくもく。エンジニアでなくてもなにかもくもくしたくなる、とてもやわらかい雰囲気の...

Posted by 株式会社フィードフォース／feedforce on 2016年1月28日

だいたいこんな感じの人が集まりました。

  • RxJS関連を勉強しに来た
  • jQueryを身につけたい

当日のお昼に、イベント開始時の諸々の説明をどうすっかなと思って、焦ってすごい雑にスライドを作る。
雑に作ったぶん、進行がすごいｇｄｇｄだったのではないかと思います。(テンパッててあまり記憶ないです)

会の最中は準備でやりきった感あったので、すごいポンコツだったと思いますｗ

終わってみて感想

  • 社内の多くの人に救われました。本当にありがとうございます！
  • 思ってたより人が集まってくれて驚いた
  • 開始時間は20時〜からがちょうどいい雰囲気でした
  • 準備不足感否めない

現場からは以上です。