カノジョできなかったので米炊きます。

## 歯を食いしばって書きます

[カノジョできないエンジニア Advent Calendar 2016](http://qiita.com/advent-calendar/2016/no-girlfriend) 22日目の担当 @shima_x_o です。

---

### ネタの使い回し申し訳ございません

なんらかの言語でカノジョ造ったりチャーハン作る流れを感じる中、[関西フロントエンドUG 年忘れ LT 大会](https://kfug.connpass.com/event/42765/) でもやった「オフィスで炊飯できるかどうか。」という話をカノジョできなかったのでここでもします。

---

## 米と昼食と私

---

### 動機

オフィスでも温かい白米を食いたい。

---

### 背景

- ハイキング行く為に調理道具をけっこう買った
- もったいないから山以外の場所でも使いたい
- マンガ「 [山と食欲と私](http://www.kurage-bunch.com/manga/yamashoku/) 」に影響されて（メスティンで炊飯する回）

---

### 検証

いきなりオフィスでやるのはちょっと気が引けたので家で作りました。

---

#### では、材料です。

- 米: 150g（1合）
- 水: 250ml ぐらい（浸水が面倒なので多めにいれてます）
- マグロの缶詰: 適量（鍋の上において温めます）

---

##### マグロの缶詰

![IMG_9082.JPG](https://qiita-image-store.s3.amazonaws.com/0/20855/9c915cda-9a6f-8167-f95a-8e98434d08cf.jpeg)


---

##### 道具です。燃焼用アルコールで火を付けます。

![IMG_9080.JPG](https://qiita-image-store.s3.amazonaws.com/0/20855/e33804db-d266-16c2-6826-060d66c5e608.jpeg)


---

##### 着火

![IMG_9081.JPG](https://qiita-image-store.s3.amazonaws.com/0/20855/17129c2c-8661-f058-ff26-477f3ac4b280.jpeg)


---

##### 鍋をセット

![IMG_9083.JPG](https://qiita-image-store.s3.amazonaws.com/0/20855/39817d3b-24d2-bc48-ca68-7d56e24dabc7.jpeg)


---

##### マグロの缶詰をセット

![IMG_9084.JPG](https://qiita-image-store.s3.amazonaws.com/0/20855/c39156c1-9585-d7b5-9c65-b05ed4230109.jpeg)


---

##### 吹きこぼれてきたけどこのまま待ちます

![IMG_9085.JPG](https://qiita-image-store.s3.amazonaws.com/0/20855/5c9c9430-8a94-62f6-fe07-3c8bf3271b26.jpeg)


---

##### 燃料のアルコールが切れると勝手に消火します

![IMG_9086.JPG](https://qiita-image-store.s3.amazonaws.com/0/20855/dbfaf3ec-46aa-921c-4a78-82d20d305297.jpeg)


---

##### 適当に蒸らします

![IMG_9087.JPG](https://qiita-image-store.s3.amazonaws.com/0/20855/094b3d2c-3132-e73d-9f88-bed216e1e8c4.jpeg)


---

## 蒸らしてる間に Pug の話をします

このネタを続けると Qiita に投稿しなくてもいいのでは？という気持ちになるので、[Pug](https://pugjs.org/api/getting-started.html) の話をします。

---

ちなみにカノジョできてるエンジニア の13日目にも Pug ネタありました。
 「カノジョのためにpug+stylusで爆速Webデザインをしよう」
わたしはカノジョできてるエンジニアが書いた記事にリンクは張りません。

---

## “Jade” to “Pug”

---

## Pug になって変更点など

変更・追加された箇所、個人観測の範囲で少し書きます。
Jade から Pug に名前が変わった理由などは[どこかに書かれている](http://blog.mismithportfolio.com/web/20160326pugbegin)ので省略します。

---

### 拡張子が変わった（ ゜д゜ ）

.jade から .pug に `rename` しましょう。
Mac なら `mv` ですかね。

```bash
for i in *.jade;
do
  mv $i ${i%.jade}.pug;
done
```

---

### Markdown の Filter が変わった

公式のページでは [jstransformer-markdown-it](https://www.npmjs.com/package/jstransformer-markdown-it) になってた。

marked, supermarked , markdown-js あたりは使えなくなったのかな。調べてないです。

#### Filters &ndash; Pug
<https://pugjs.org/language/filters.html>

---

#### Markdown の Filter が変わった

```index.pug
p
  | ここは HTML

:markdown-it(linkify langPrefix='highlight-')
  # ここは Markdown

include:markdown-it article.md
```

```article.md
# ここは別ファイル
```

---

### テキストのなかに途中で HTML タグが作成できる

見だしなに言ってるのかわからなくなりました。

#### Interpolation &ndash; Pug
<https://pugjs.org/language/interpolation.html#tag-interpolation>

---

#### テキストのなかに途中で HTML タグが作成できる

以下のように書けるようになりました。

```pug
p.
  テキストだよーテキストだよー
  #[strong いきなりstrongタグ] だよ
  #[em いきなりemタグ] だよ
```

```html
<p>
  テキストだよーテキストだよー
  <strong>いきなりstrongタグ</strong> だよ
  <em>いきなりemタグ</em> だよ
</p>
```

---

#### テキストのなかに途中で HTML タグが作成できる

```txt
テキストだよーテキストだよー いきなりstrongタグ だよ いきなりemタグ だよ
```

埋め込んだタグの手前に半スペが自動的に挿入されます。

---

#### テキストのなかに途中で HTML タグが作成できる

以前の仕様でもテキストの中にタグを埋め込むには以下のように書けばよかったのですが、テキスト間の半スペの扱いが面倒でした。

```jade
p
  | 半スペほしい
  strong タグの手前と後ろに半スペほしい
  | 半スペほしい
```

```html
<p>半スペほしい<strong>タグの手前と後ろに半スペほしい</strong>半スペほしい</p>
```

---

#### テキストのなかに途中で HTML タグが作成できる

テキストの前後に半スペを足せば良いのですが、行末に半スペがほしい場合 EditorConfig の設定などで行末に半スペを消去する設定にしている事があるので個人的にはうれしい記述方法だと思いました。
カノジョを作るのは難しいですが、半スペを付与するのは簡単です。

```jade
p
  | 半スペほしい
  strong trim_trailing_whitespace を true にしていると行末の半スペが消える
  | 半スペほしい
```

---

#### Pug 変更点終わり

そろそろ米がムレムレになってきたので Pug 変更点終わります。
Pug については他にも追加された機能や記述方法があると思うので、気になる方は以下をみていただければと思います。

https://pugjs.org/api/getting-started.html

---

##### できた

![IMG_9088.JPG](https://qiita-image-store.s3.amazonaws.com/0/20855/bdf068fb-1e35-6524-30b7-3b5d7ddb70af.jpeg)


---

##### のせた

![IMG_9091.JPG](https://qiita-image-store.s3.amazonaws.com/0/20855/6c6c6019-fcb0-8d08-0cd0-db41475369d6.jpeg)

---

##### 盛った

![IMG_9092.JPG](https://qiita-image-store.s3.amazonaws.com/0/20855/fe2e7680-6105-1e87-52c7-9b715cc14940.jpeg)


---

##### 結果

- まぁうまい。
- でも直火はオフィス内でやるには危ない。
- 米臭がすごいので同僚達の理解が必要。
- 吹きこぼれがすごいので毎日の掃除・洗い物が面倒。
- 缶詰がなにげに 500 円くらいしたのでコスパ良くない。

---

#### 会社で作るのやめとこう

白米、別に好きではないのでオフィスであたたかいお米食うの諦めました。
なにがなんでも炊きたての白米を食いたいなら、無難に 0.5 合〜 1 合炊ける炊飯器が良さそう。

---

### オフィスで暮らす皆さんに豊かな昼食を

なんのひねりもなくホントに米炊きました。
**[#ふみ飯](https://www.instagram.com/explore/tags/%E3%81%B5%E3%81%BF%E9%A3%AF/?hl=ja) みたいなお弁当作ってくれるカノジョほしいです。**

---

#### おわり