DIY〜Webエンジニア 在宅ワーカーの僕の仕事部屋を晒します。

仕事部屋

仕事を快適にやるには、いい空間が必要です。

以前は、仕事部屋が特になく、リビングやダイニングなどでやってました。しかし、いろんな誘惑で仕事に集中できず、
ボロ家ですが、使ってない部屋があったのでそこを自分で、解体、掃除をし、
壁紙を張り、IKEAで好きな家具や小物、照明を買い、DIYして棚をつけたり、ペンキを塗って理想的な快適な仕事部屋を作りました。

そんな僕の仕事部屋を晒します。

デスク

デスク
このデスクは、IKEAでテーブル台と、足の組み合わせを自分で選ぶものです。
この木の感じの台は、安くなってて、しかもとっても気に入ったので即買いしました。

足は黒の鉄製のもので、高さを調節できるのでいい感じです。

椅子

椅子
この椅子は、以前、食卓で使ってたけどもう使ってないものを持ってきて使ってます。
色々と仕事用のいい椅子があると思いますが、僕の場合、そういう椅子だと腰が痛くなる気がするので、使っていません(高いから買えないだけの僻みw)。
ただ、全然快適だし、上にこの腰の姿勢を正すやつが、かなり調子いいです。

きちんと深めに座れば腰が立つので、腰を痛めることなく座れます。

壁

  • 壁紙クロス
    これは壁紙ですが、微妙に凹凸もあって、質感もリアル、しかも自分で初めて貼りましたが簡単に綺麗に貼れます。これは、ホントいい感じです。
    ちょっと壁紙を部屋の二面に貼っただけで、ボロい部屋がすごくいい部屋に見えるようになりました。ちょっとやるだけで印象がすごく変わります。

この壁紙は、楽天で、「壁紙屋本舗」って調べると出てきます。ホントにすごいいろんな種類があるので、必ずお気に入りが見つかるはずです。

壁2
僕は全面これを貼りませんでした。もともとの壁は白い壁で、穴も空いていたりして、かなりボロでしたが、2面壁紙を張っただけで、もともとのボロい白い壁となんかマッチして味が出てていいかなぁーと思い、あえてそのままにしました。

  • 流木
    海で拾いました。ただです。角の長い流木には豆電球(クリスマスツリーにやるようなやつ)を巻き巻きしました。

  • 壁穴
    ボロいため、大きな穴もあったので、そこには、もともとあったボードを貼ったり、海で拾った長い廃材を貼ったりしたら、更にいい感じになりました。

  • 写真
    この辺の海の写真です。写真のガクも、IKEAで昔買ったものです。

  • ギター
    引っ掛けられるようビスを打ちました。John butler が好きなので、練習してます。

棚
棚ですが、僕の場合、うちに大きな犬がいるので、床に置くタイプだと、隙間や裏に犬の毛がたまるので、床にはなるべくものを起きたくない主義です。

  • 壁に打つために
    壁に棚を打つようのこの三角形の材料をIKEAでたくさん買いました。いろんな種類があります。


  • 棚にしてる木材は、近くのホームスーパーで買い、いい感じの質感にするためにオイルステインを塗りました。

  • 星の飾り物
    イケアかニトリどっちかの子供コーナーに売ってたものです。

  • 松岡修造カレンダー
    CCレモンを買ったらついてきたもので、僕のモチベーションを上げてくれる大事なアイテムです。

  • 書類の収納
    これもIKEAで4つだか5つで、数百円だった気がします。ラベルをつけてきちんと整理整頓してます。

  • 大木のステッカー
    これもIKEAで買いました。パズルのように番号毎に貼っていくので、楽しく貼れます。

タスク管理

タスク管理と観葉植物
タスク管理ツールTorellってみんなよく使ってると思いますが、僕はそれを実際にアナログで壁で管理してます。

  • ボード
    フライングタイガーやIKEAで買った面白い画鋲やカードを使ってます。

ボードは、コルクボードでなく、廃材を集めてボードにしたような材料の端切れが、ホームセンターで一個50円だったので、それを壁にビスでうち、画鋲が刺さりやすいように、透明な分厚い下敷き?みたいなのをIKEAで買い、使ってます。

  • 植物
    仕事運に良いと、僕の奥さんが誕生日プレゼントに10号の大きな観葉植物を買ってくれました。
    シュロチク」ってやつです。育てるのが楽しいです。ちゃんと水やりや枯れたはの処理など、きちんと世話するとどんどん葉っぱが生えてきて嬉しいです。

天釣り照明

照明
照明は、かなり大事な要素だと思ってます。ちょっと照明を変えるだけで、部屋全体の雰囲気が全く変わりますね。僕は、白い光が苦手なので(目が痛くなる)、使わない派です。エンジニアはずっとPCと向かい合ってるので、目が疲れますよね。

  • 電気の傘
    これはイケアで買いました。マリンぽいけど、鉄の感じがすごく気に入りました。5000円くらいとちょっと高かったのですが、電気は大事なので、奮発しました。

  • 電球
    この部屋、電気のスイッチがありません。おまけにIKEAの傘にもほとんどスイッチの紐がついてません。そこで、友達に教えてもらった電球を使ってます。
    これは、別売りのリモコンで操作可能です。
    明るさと、色(日光色〜白熱色)をリモコンで調節できる優れものです。
    楽天で検索すると出てきますので、是非おすすめです。

窓際休憩スペース

窓際
ここは、ちょうどデスクの反対側です。外を眺められるので、ちょっと仕事に詰まったり、うまく捗らないときに、こっち側に座って休憩します。
カウンター・テーブルを自作しました。

  • テーブル
    ホームセンターの材木(SPFかな?)にオイルステインを塗り、つるつるさせたかったので、ニスを塗り光沢を出しました。いい感じです。
    これも床に置いてるのではなく、壁に打ってます。棚と同じくIKEAの三角形の材料を使ってます。

  • 植物
    植物は癒やしですし、部屋の雰囲気作りに欠かしません。色々ありますが、左のモンステラは一旦枯れかけてもう駄目かと思いましたが、この夏ここに置いたらすごいマンモス級になりました。

  • じょうろ
    フライングタイガーで数百円でゲットしました。この部屋から水道まで遠いので、なるべく大きくたくさん水が入るものがよかったので、バッチリでした。

テーブル照明

テーブル照明
右側の照明はテーブルに固定してつけるもので、鉄っぽくて、海外っぽくてすごい好きです。PC側のデスクでも使ってます。IKEAで1500円ちょっとで、激安です。

部屋の扉

部屋の扉
扉は、もともとボロくて壊れてたので、新たに作りました。この部屋に入る前の通路が狭いので、開き戸だと、通りにくさを感じたのでスライド式にしました。
スライドするのにレールと、扉にローラーが必要だったので、ホームセンターで買い、扉自体は、これもSPFの材木でオイルステインを塗り斜めに打ってつなぎ合わせました。
取手もホームセンターにあるものを使ってます。我ながらいい感じの仕上がりになったと思います。

小物たち

  • 吸い殻入れ
    吸い殻入れ
    僕はIQOSを愛用してますが、灰が出ないので、蓋のできる小物入れみたいなのを探してたら、フライングタイガーでちょうどいいのがあったので使ってます。

  • コンセント
    コンセント
    デスクにはたくさんコンセントが必要だと思います。iPhoneの充電、Macの充電、照明、プリンター….などなど、その沢山の線が露出してると汚らしいので、このコンセントボックスを使ってます。IKEAです。

  • スピーカー
    スピーカー
    仕事中の音楽は必須ですので、Bluetoothスピーカーが必須です。これも奥さんに買ってもらいました。全然いい感じです。たぶん海外製。

  • フェラーリ
    フェラーリ
    風水をすべて信じ切っているわけではありません(長財布反対派だし)。でも東側にデスクを向けて、デスクの東側に将来の目標や夢になるものを置くといいっと書いてあったので、なにげに取り入れてます。いつか乗りたいな。笑

まとめ

僕の部屋を晒しました。ホントに少しの手間と工夫で快適な空間になります。快適な空間になると、出かけたときに部屋のことを考え、いろんなものに目を向けるようになったり、何より、綺麗に整理整頓を心がけるようになります。

そうすると仕事がスマートにやれるようになるし、捗るようになるのかなーと思います。


HEXOを使って爆速でブログを立ち上げた話

HEXOを使うに至ったわけ

  • ReactやRails 等を使って一から作成しようかと思ったけどぶっちゃけめんどくさい
  • 今更phpなんてやりたくないのでWordpressは却下
  • Markdownで記事を書きたい
  • 何しろ手っ取り早く立ち上げたい

HEXO とは

Markdown形式で書かれた記事を、静的WEbページとしてGenerateしてくれるフレームワークです。似たようなもので、JekyllやOctopress、Pelicanなどがありますが、HEXOは中国圏の人が作ったようなので、日本語周りでバグが起きづらそうな気がしたのでHEXOを使うことにしました。


目次


構築手順

GithubページにDeplooyしてる記事が多いですが、僕は、すでに他でAWSを使ってるので、S3にDeployし、Cloudfrontから配信することにしました。

前提条件

  • AWSの設定
    • AWSアカウントを持っていること
    • S3にバケットを作成済み
    • Cloudfrontの設定済み
    • ドメインの設定済み
      ※この辺の内容は下記の記事を参考にしてください。
      http://qiita.com/buta/items/06a7e147d865fb862783
  • localにnode環境が整っていること

HEXOのインストール

Globalに入れましょう。

$ npm install hexo-cli -g



プロジェクトフォルダに移動し、

$ hexo init myblog
$ cd myblog
$ npm install



これで必要なパッケージが入るので、localで立ち上げてみます。

$ hexo s
INFO  Start processing
INFO  Hexo is running at http://localhost:4000/. Press Ctrl+C to stop.



ブラウザでアクセス

http://localhost:4000


ブログの設定

_config.ymlファイルで、ブログの設定をする

# Site
title: ブログタイトル
subtitle: サブタイトル(これはどこに反映されるのかよくわからない)
description: ブログの説明
author: 名前
language: 言語(ja)defaultはen
timezone: Asia/Tokyo(ない場合はhexoコマンドを実行したコンピュータのタイムゾーンに従います)

url: ブログのURL
root: /
permalink: :year/:month/:day/:title/
permalink_defaults:    
# permalinkは、記事を作成した時のpath。defaultだとこんな感じになる


タグとカテゴリを設定する

_config.ymlファイル を編集

# Category & Tag
default_category: デフォルトのカテゴリ名
category_map:
  diary: diary
tag_map:
  diary: diary
  web: web
  hexo: hexo

など

テーマを変えてみる

結構いろんなthemeがあります。

僕はapolloにしてみました。

$ git clone https://github.com/joyceim/hexo-theme-apollo.git themes/apollo



_config.yml

theme: apollo


必要なプラグインを入れる

RSS作成と、SEOのためSitemap作成用のプラグインを入れる

$ npm install hexo-generator-feed hexo-generator-sitemap --save

入れるだけで、両方作ってくれるようになります。

プラグイン一覧はこちら


Categoriesページと、Tagsページを作成してnavigationにリンクを追加する

$ hexo new page categories
$ hexo new page tags

※ theme以下にcategoriesページとtagsページのテンプレが存在するので、何かの設定で勝手に両ページをgenerateしてくれるものだと思っていましたが、僕が調べた限り作成されないので(きっと方法があると思う)、上記コマンドで2ページを作成して、markdownでページの内容を書きました。
どなたか知っていたら教えてください。


themes/apollo/_config.yml

menu:
  Home: /
  Categories: /categories
  Tags: /tags
  Archives: /archives
rss: /atom.xml

※ 見た目に関する設定はtheme以下の_config.ymlに設定する


ついでにGoogle analyticsを設定する

themes/apollo/_config.yml

google_analytics: ***********


favicon

favicon: /images/favicon.png

とし、下記にfaviconファイルを置く

themes/apollo/source/images/


記事を作成

$ hexo new 記事名(urlのpath名になる)

すると

/source/_posts/

以下に

記事名.md
記事名/

が作成される。
mdファイルがmarkdown方式の記事ファイルになり、dirのほうに、その記事に必要な素材等を置く


画像の表示

いろんな記事にいろんな記載がありますが、普通に上記dirに画像を置いて、

![alt](/yyyy/mm/dd/記事名/画像ファイル名 "alt")

とすると、きちんと表示されるので、問題ないです。


コメント機能追加

DISQUS」を使います。下記ページからアカウント作成し、自分のスペースを作成します。最終的にshort nameが発行されるので、それを_config.ymlに設定する

disqus_shortname: ここに設定

下記のページが参考になります。


記事やページの作成時のdefaultのテンプレートを編集

/scaffolds/post.md
/scaffolds/page.md

を下記みたいな感じにしておくと、作成されたときに記事が書きやすいかと思います。

title: {{ title }}
date: {{ date }}
category:
- カテゴリ名
tags:
- タグ名
---

# 見出し1
## 見出し2
### 見出し3
#### 見出し4
##### 見出し5
s###### 見出し6

[Google先生](https://www.google.co.jp/)
![キャプチャです](/yyyy/mm/dd/記事タイトル/ファイル名 "キャプチャです")


- リスト1
    - ネスト リスト1_1
        - ネスト リスト1_1_1
            - ネスト リスト1_1_2
    - ネスト リスト1_2
- リスト2
- リスト3

1. 番号付きリスト1
    1. 番号付きリスト1_1
    1. 番号付きリスト1_2
1. 番号付きリスト2
1. 番号付きリスト3

> お世話になります。xxxです。
>> あの新機能バグってるっすね

    # Tab
    class Hoge
        def hoge
            print 'hoge'
        end
    end

normal *italic* normal
normal _italic_ normal

normal **bold** normal
normal __bold__ normal

normal ***bold*** normal
normal ___bold___ normal

***

___

---

*    *    *

~~取り消し線~~

S3 Cloudfrontへのdeploy設定

必要なパッケージを入れる

$ npm install --save hexo-deployer-s3 hexo-deployer-s3-cloudfront

hexo-deployer-s3 のみだと、cloudfrontを使用してる場合、cacheが更新されないので、即座に反映されませんので、hexo-deployer-s3-cloudfrontを使う

_config.ymlを編集

plugin:
  - hexo-deployer-s3-cloudfront

# deployment
## Docs: https://hexo.io/docs/deployment.html
deploy:
  type: s3-cloudfront
  bucket: s3のバケット名
  aws_key: キー
  aws_secret: secretキー
  concurrency: 1
  region: リージョン
  cf_distribution: cloudfrontのid
  headers: {CacheControl: 'max-age=604800, public'}

GenerateしてDeploy

これで最低限の準備が整ったので、Generateして、Deployしてリリースしてみる

$ hexo g

$ hexo d

こんな感じで、プログができました。

あとは、Google webmaster toolに登録して、sitemapを送ったりすれば、OKかと思います。

目次に戻る


ブログを始めます!

キャプチャです

今更だけど、ブログを始めます。

海の近くで「株式会社UKAI」を経営してます。
「非日常」をコンセプトに、飲食・宿泊・アパレル・IT 等の事業を行って行く予定です。

僕は、4年前に伊豆白浜に引っ越し、ゲストハウスを開業しました。
そして、今年(2018年)から、焼肉屋の開業を予定しており、これを期に法人成りをしました。

僕は、もともとweb系エンジニアとして、サラリーマンしてましたが、2014年から都会を離れ、田舎に退き、
(早かれ遅かれいつかは、海の近くに住もうと決めていた)
この4年間は、在宅でエンジニア業を続けてつつ(元々やっていた会社の契約社員として)ゲストハウスの経営運営をし、ダブルワーカーをやってました。

そして、ゲストハウスも起動に乗り、新しいこと、自分のやりたいことや夢に向かって、お世話になっていた会社(在宅エンジニア)を退くことにしました。
そして、会社を設立しました。

これまで個人事業主としてゲストハウス経営のことや、これからやっていく飲食店の開業、会社のことなどを、同じ境遇の方達に少しでもお役にたてたらという思いと、日々のweb周りの仕事のメモなどを残したくて、このブログを始めるに至りました。

また、ただここに引きこもってると、頭が固くなりそうなので、他の宿やお店に行ったり、色々と旅をしたいので、その内容も書いていこうと思います。

お気軽にコメントなどいただけると嬉しく思います。

それでは、
よろしくお願い致します。

2017年9月 作成
2018年10月 更新


僕の経歴
- 東京電機大学 情報環境学部 卒業
- 株式会社 Yahoo japan 入社 2年半 で 退職
- 株式会社 サーフレジェンド 入社 2年 で 退職
- Winoo 株式会社 入社 4年ほどやって、田舎で在宅ワーカーに
- 個人事業主として、白浜ゲストハウス うーちゃん家 開業(2014年4月)
- 株式会社UKAI を設立(2018年1月)、Winoo株式会社退社(2018年3月)
- 特選黒毛和牛牝専門 焼肉u オープン(2018年7月)