React を使うにあたり, というか最近の JS の開発を行う場合 WebPack + Babel の環境を用意して, さらに JS フレームワークを追加し設定を書いて…といった煩雑な手続きが必要です。 React の場合 create-react-app という便利コマンドでサクッと開発環境を作ることができます。ただし, create-react-app でプロジェクトを始めた場合, 余計なファイルを同時に作ってしまい練習用にはお節介がすぎる感があります。 そこで create-react-app で採用されている react-scripts を使って必要なところだけ楽をする。をしてみました。 手順 初期化を適当に実行。 $ npm init npm で必要なパッケージを追加します。 $ npm i -D react-scripts $ npm i react react-dom npm に必要なコマンド定義を追加します。 "scripts": { "start": "react-scripts start", "build": "react-scripts build", "eject": "react-scripts eject", "test": "react-scripts test" }, react-scripts には特定のディレクトリやファイルが必要らしいので最低限作ります。 $ mkdir -p public src $ touch public/index.html $ touch src/index....

自社サービスや受託開発で利用する Docker イメージを見直しています。MySQL 用のイメージや Rails 用イメージを見直したところ, CircleCI 上でテストを実行する際に MySQL に接続できずテストが落ちる現象が発生しました。 テストが落ちた原因 MySQL の ENTRYPOINT の処理を見直した結果, MySQL が起動する前にデータベースへ接続しようとし, 結果接続できず落ちる状態でした。 変更前の ENTRYPOINT では最低限の処理だけ行い, その他の設定処理は起動後に外側から command を使って実行していました。見直しによって ENTRYPOINT 側で対応する処理を増やしたため初期化に時間がかかるようになってしまった模様。 対応 とりあえずの対応として, MySQL の初期化が完了するまでの時間として SLEEP 10 をとりあえず追加しました。(よくない) Dockerize 本来であれば Dockerize を用いるのが良さそうです。 [Configuring Databases - CircleCI](https://circleci.com/docs/2.0/databases/# using-dockerize-to-wait-for-dependencies) [Database Configuration Examples - CircleCI](https://circleci.com/docs/2.0/postgres-config/# example-ruby-project-with-mysql-and-dockerize) 複数のコンテナを組み合わせて利用する場合は dockerize をイメージに含めておくと良さそうです。CircleCI が提供しているイメージにはインストールされているらしい。 [Using Custom-Built Docker Images](https://circleci.com/docs/2.0/custom-images/# required-tools-for-primary-containers) のリストにはなかったので見逃していました。一緒に書いておいて欲しかった。 今回に限っては SLEEP 10 でお茶を濁して, 次回以降の見直し時に対応しようと思います。

長らく hugo-zen というテーマを使ってきましたが, もう少し見た目を華やかにしていこうということでテーマを変更しました。 変更後のテーマは Robust です。 投稿ごとの画像設定が可能で, 尚且つ AMP 対応もしている!! あたりが選定理由です。 テーマを上書きしたところ Hugo のテーマはファイルを上書きする機能をもっています。WordPress でいうところの子テーマみたいなものでしょうか? テーマ変更にあたっていくつか変更が必要だったので調整しました。 検索フォーム追加 LazySearch の JS ファイル読み込み追加 CSS を少し調整 基本的にはベースのままで追加機能分を調整した形です。あらかじめ空のパーシャルが用意されている箇所があって変更も簡単でした。 これから もう少し頑張って更新していく。

昨年頭に書いた 2017年版の高崎市内のシェアオフィス記事 が SEO 的に良い位置におり, 更新されないと都合が悪い人がいそうなので 2018 年版を書いてみます。 あいうえお順, シェアオフィスを公式にうたっている事業者を中心にまとめています。 IPPO URL: https://shimizu-shoji.com/lp/ 所在地: 高崎市問屋町西 高崎問屋町駅から少し歩く距離で国道17号線にも近く, 特に車を使って頻繁に移動される方には嬉しい立地です。お値段的には他のシェアオフィスよりも割高感がありますが, Web サイトを見る限り設備も新しく, 個室, 駐車場, 24 時間いつでも利用できるようです。 9 月に拡張されるようなので気になる方は問い合わせると良さそう。 拡張のお知らせ9月ごろオープン: https://shimizu-shoji.com/news/693/ Somethin' Else URL: http://somethingelse.jp/ 所在地: 高崎市小八木町 2017 年版では「起業家の森」として紹介させていただきましたが, その後管理運営が Somethin' Else さんになりました。 ワンデスク, バーチャルオフィス, レンタル会議室, マンスリー契約, さらにコワーキングスペースとして運営されています。昨年は Go 言語の勉強会 Takasaki.go でもお世話になりました。 立地としては最寄の井野駅からはかなり歩きます。代わりに駐車場が充実しているので車を常用する群馬県民にはぴったりかもしれません。オープンスペースを中心に半個室, 会議室と充実しています。 shine URL: https://shine.issha-grow.com/ 所在地: 高崎市本町 数日前に Web サイトができたばかりです。弊社は現在こちらのシェアオフィスに入居しています。高崎中央銀座の外れ, 飲み屋街が途切れた先にあります。立地のわりに個室なのに賃料は格安で, どういうわけか賃料にいろいろな料金が含まれており助かっています。 24 時間土日に限らず好きな時間に利用させていただいています。コンビニや飲食店が近いので便利です。新たにバーチャルオフィスを始められたとのことです。個室も 1 部屋空いているので気になる方は Web サイトからお問い合わせしてみてください。 SOHO ガーデン高崎 URL: http://www....

長らく開発環境は Vagrant + VirtualBox でした。このところ CircleCI 2.0 への移行 をきっかけに開発環境も docker 化(docker-compose 化) をすすめています。 Vagrant 利用時の問題点 開発環境を維持していくためにプロビジョニングの整備が必要でした。流行り廃りの中で Chef, Itamae, 最終的に Ansible と使用するツールを変えてきました。 プロビジョニング実行時には, 運用ポリシーにもよりますが, 適用前後の状態変化をチェックするコードを用意しなければならない場合がありました。例えば Go のバージョンのみ変更したい場合, インストール済みの Go のバージョンをチェックし新たにインストールしたいバージョンと差異があるか確認, 必要があればインストールを実行といった具合です。 また, ミドルウェアのバージョンアップにあわせて各自のローカル環境でプロビジョニングを実行する必要がありました。それぞれのマシンで実行するため総時間としてはそれなりの時間が必要です。 docker-compose に移行した結果 メリット docker イメージの作成のみ考えればよく, 既存の状態チェックを意識せずに済む イメージにして Docker Hub 等に置けば各ローカル環境でプロビジョニング作業は不要 Vagrant + VirtualBox よりもメモリの消費が少ない CI 環境を含めて考えれば環境構築の手間が浮く プロダクションのサーバ環境まで面倒みれると最高っぽい デメリット docker-compose の操作を覚える必要がある 複数のコンテナを管理する必要があり煩雑 DB やアプリサービスごとに bash で入って状態をチェックする場合がある 通常のサーバ環境を念頭において作業するとわかりづらい 迷ったこと 特定のプロジェクトにおいて, MySQL のユーザ追加等をイメージ側で管理するか否か 汎用性を重視し, $ docker-compose up をラップした Rake タスクでユーザ追加で対応中 実際に開発環境に採用してみて もっとも助かっているのはメモリ使用量が減ったことです。...

自分の会社のサイトは創立以来 Middleman で管理運用しています。これまでは CircleCI 1.0 の機能を利用して AWS S3 にデプロイし CloudFront のキャッシュをクリアする構成になっていました。 CircleCI 1.0 が 2018 年 8 月末日で利用できなくなるため 2.0 に変更する必要がありました。 CircleCI 1.0 End of Life on August 31, 2018 CircleCI 2.0 対応にやったこと CircleCI 2.0 のドキュメントの確認 Middleman がビルドできる Docker イメージ作成 circle.yml を .circleci/config.yml に変更 CircleCI 2.0 を利用するには Docker イメージが必要です。CircleCI が用意しているイメージを利用する方法もあります。 Pre-Built CircleCI Docker Images - CircleCI 今回は Docker の学習も兼ねて自分で Docker イメージを用意することにしました。 Docker イメージの作り方 できたもの: Docker Hub: yuya-matsushima/middleman GitHub yuya-matsushima/docker-middleman 依存イメージ: yuya-matsushima/docker-ruby 今回は Ubuntu 16....

サイト内検索サービス LazySearch の課題のとして使い始めるまでに JS で処理を書く必要があり煩雑という問題があります。サイト登録まで到達した後に, さらに JSON/JSONP で Search API に問い合わせる処理を JS で書かなければなりませんでした。 JS で処理を書く, といっても検索結果のデザインやページネーションまで含めればサクッと書けるものでもありません。 そこで JSライブラリを置けばサイト内検索機能が使える を目標に JS ライブラリ lz.js を開発しています。 リポジトリ: https://github.com/fillin-inc/lazysearch-js 目標仕様 モダンブラウザ + Edge + IE10-11 をサポート JS ライブラリを配置し, form タグの hidden に指定されたパラメータを指定する 検索結果はモーダル表示 PC, タブレット, スマホでそれぞれレスポンシブに対応 開発環境 webpack + Babel css-loader + style-loader を使った CSS ロード html-loader を使った HTML テンプレートの読み込み Pure JS をベースに必要最低限のライブラリで実装 なぜ ES2015 で作ってみてどうだったか 世代的に JS を始めた頃には便利な jQuery がすでにありました。しかし, ES2015 ではより表現しやすい構文が用意され, モダンブラウザではブラウザ間の差異を(そこまで)気にする必要がなかったので苦労はありませんでした。...

この記事を書くにあたり手元の Mac Book Air の年代を調べたら 2013 年で流石に古くて驚きました。 タイトルのとおり Mac Book Air のバッテリー交換をしたので書いておきます。早く買い換えたい。早く 32GB の MacBook Pro が出てほしい。 なぜ交換したか? 電池の寿命です。これまで 1 度も交換せずに使ってきたので仕方ないですね。 本来であれば買い換えを検討したいところなのですが, このタイミングで新しい MacBook Pro を買うのは悔しいので電池を交換してお茶を濁す計画です。お仕事的には Mac Book Air は打ち合わせや簡単な資料作成程度に利用するだけなので問題ありませんでした。 バッテリーの調達 適当にググって Mac Book Air の型番を調べ, amazon でサッと購入しました。 いくつか購入候補はありましたが, レビューを見ると純正でない場合新品同様に長時間モバイル駆動は難しいらしいです。2-3時間とりあえず動いてくれれば問題ないのでそれなりのお値段の商品を選択しました。 純正を買って長時間駆動しないよりは… というわけで次のバッテリーを購入しました。 Amazon | A1495バッテリー Apple アップルMacBook Air 11インチ A1465 対応 2013 2014 | | バッテリー 通販 商品説明にはありませんが, 交換に必要な特殊ドライバー2本が付属しています。なので私のように特殊ドライバーセットのようなものを手配する必要はありません…(書いておいて欲しかった) バッテリーの交換 裏蓋を開けてネジを外して取り付けてネジで止めるだけですね。一応交換前にバックアップは取っておきましょう。 交換したバッテリーの処分 何かと処分に困るリチウムイオンバッテリーですが JBRS のサイトから最寄りの処分可能なお店が探せました。 [リサイクル協力店]検索 |小型充電式電池リサイクルの一般社団法人JBRC 会社が近い高崎駅前のヤマダ電機さんに持ち込んで回収していただきました。なお, 回収BOX はないので店員さんを捕まえて相談しましょう。無償で引き取っていただけて助かりました。

引っ越すことになったので法人登記を含む「代表者住所変更」の一連の手続きを行う必要が発生しました。登記変更が必要だということは把握していましたが, 実際にやってみたら他にも手続きが必要で大変でした。 忘れないうちにまとめておきたいと思います。 何が変更されたか 株式会社の代表(私)の居住する住所が変更になりました。この時点で会社の状況を含むステータスは次のとおりです。 会社 群馬県高崎市に存在 保険証は協会けんぽ 自分 高崎市内から高崎市内への転居 必要な手続き 法務局で法人の代表者住所変更登記 (参考) http://houmukyoku.moj.go.jp/homu/content/001188320.pdf 登録免許税: 10,000円 (会社規模によるので注意) 登記申請から変更反映まで通常1週間弱 税務署に異動届提出 (参考) https://www.nta.go.jp/tetsuzuki/shinsei/annai/hojin/annai/1554_5.htm 書類提出のみ 添付書類に住所変更が反映された登記簿謄本(履歴事項全部証明書を提出した)が必要 年金事務所に書類提出 事業所関係変更届 (参考) http://www.nenkin.go.jp/service/kounen/jigyosho-hiho/jigyosho/20140815.html 被保険者住所変更届 (参考) http://www.nenkin.go.jp/service/kounen/jigyosho-hiho/hihokensha1/20150320.html 「控え」が取得可能なものは同様の書類を2部用意し, 控え分をファイル保管しています。 ネット情報との差異 県税事務所や法人がある市区町村への異動届についても「提出が必要」と書かれていることがありますが, 代表者住所変更については, 都道府県/市区町村で異なるようなので問い合わせるか各所の Q&Aで確認する必要がありました。 場合によっては上記に加えて +2 種類の書類が発生することがあるということですね… 手続きを終えた感想 法人番号各場所はあっても勝手によしなにやってくれなくて不便 せめて法務局で登記変更が終わった段階で税務署, 年金事務所ともに勝手に修正してほしい 法人番号とは一体なんなのか…?...

特定のプロジェクトであったり特定のカテゴリの調査の場合, 対応するディレクトリを用意しておいて日付ファイル名の markdown でメモを取ることが多いです。 例えば ~/path/to/dir/2018-01-10.md のようなファイル名になります。 この時 Markdown の 1 行目, つまり見出しも日付にしています。 # 2018-01-10 都度日付を思い出すのは面倒なので .zshrc に関数を定義して簡単に呼び出されるようにしています。 .zshrc に追加するコード function todaymd() { filename=`date "+%Y%m%d.md"` if [ ! -f $filename ];then date "+# %Y-%m-%d" > $filename fi vi $filename } 使い方 次のコマンドを実行することで markdown ファイルを vim で開きます。 $ todaymd vim で開いた時点で見出し(#) に日付が記述されるようになっています。例えば今日の $ todaymd を実行すると次のように。 # 2018-01-10 地味だけど便利。