そんな生活を続けている中ふと「幸せとか豊かさって何なんだろう？」みたいなピュアピュアな感情が芽生えてしまい、人多いし家狭いし高いしなんで都内に住み続けているのか意味がわからなくなり、引っ越し意欲が高まりました。都内で高い家賃出して狭い家に住んでいる意味が自分たちには全くないねと妻と話し合いを重ねました。

つくば市に引っ越した

11月に茨城県のつくば市に引っ越しました。秋葉原の2LDKマンションから戸建て4LDK庭&駐車場付きへ。

引越し先は東京以外のすべてから候補をフィルタリングしていき、いろいろな条件を加味して茨城にしました。検討初期の段階では福岡が最有力でしたが、自分たちが本当にしたい暮らし方、コロナの現状、猫の移動方法など考えに考えて今じゃないなとなりました。一生に一度は住んでみたい場所なので、いつの日か越す日が来るかもと思っています。

つくばは東京と比べてとにかくいろいろゆとりがあるなという感じで、伸び伸びと楽しく暮らせています。

詳しくは別エントリーで書きたいと思います。家のインテリアとかもいろいろこだわるようになったのでそのへんも合わせて。

車を買った

引っ越しに合わせてお車を買いました。徒歩圏内にスーパーやらドラッグストアはありますが、車があるとないで選択肢が段違いな感じです。

お納車しました🥰 pic.twitter.com/XEkpCthYua
— じまぐ (@nakajmg) December 5, 2020

茨城県、キャンプ場がとにかく多い（全国1位とかなんとか）のでキャンプやっていこうぜとなりSUVにしました。がっしりした作りで乗ってて安心感がすごいですね。

まだ助手席にしか乗れないので、2021年内に免許を取ろうと思います。

来年に向けて

越してからというもの生活リズムが激変して22時くらいには寝て6時前に起きるみたいな生活をしています。こっちは夜が早い？ような感じがして早く寝ようという気になります。周りが真っ暗なせいかもですが。

朝型にシフトしたのもあって業後に副業を頑張ったりする気力と時間がないので、生活に合わせて色々と変化していきたいと思います。家賃の固定費が12万くらい減ってそこまで頑張る必要がなくなったので、ちゃんと生活する1年にしてもいいかもなぁとか思ったり思わなかったり。

それでは良いお年を！

2020-10-09

Install vue-devtools for Vue3 on electron

written on Fri Oct 09 2020 16:30:39 GMT+0900 (日本標準時)

vue-devtools for vue3 is still beta so you need to install beta version.

install vue-devtools beta version

via Chrome Web Store

chrome.google.com

install extension

on main

import { session } from "electron";
import path from 'path'
import os from 'os'

app.on("ready", async () => {
  try {
      await session.defaultSession.loadExtension(
       //The extension version depends on the version you installed
        path.join(os.homedir(), '/Library/Application Support/Google/Chrome/Default/Extensions/ljjemllljcmogpfapbkkighbhhppjdbg/6.0.0.2_0')
      )
    } catch (e) {
      console.error("Vue Devtools failed to install:", e.toString());
  }
})

The version depends on the version you installed

2020-06-25

LINE Messaging API webhookの署名検証 on Lambda

const crypto = require('crypto');
const channelSecret = 'xxxxxxx' // envとかから取る

exports.handler = async(event) => {
    const body = Buffer.from(event.body, 'base64').toString()
    const signature = crypto.createHmac('SHA256', channelSecret).update(body).digest('base64');
    const isSignatureMatched = signature === event.headers['X-Line-Signature'];
    console.log('signature matched:', isSignatureMatched); // LINEからのリクエストならtrueになる
}

2020-04-14

React + Typescriptプロジェクトでplugin-styled-componentsを使うときの設定

styled-components使ってる
env !== "production" のときにクラス名にファイル名が入るようにしたい
- デバッグのため
babel-plugin-styled-componentsがある
TypeScriptだとこのプラグインは効かない
- ts-loaderでトランスパイルしてるから
storybookでも使いたい

という感じで、ts-loaderを使ってるのでTypeScriptプロジェクトの場合は typescript-plugin-styled-components を使う必要がある。babelでやってる場合は babel-plugin-styled-components で大丈夫なはず。

設定

webpack.config.js で ts-loaderのoptionを設定する。

const path = require("path");
const createStyledComponentsTransformer = require("typescript-plugin-styled-components")
  .default;
const styledComponentsTransformer = createStyledComponentsTransformer({
  displayName: process.env.NODE_ENV !== "production",
  getDisplayName(filename, bindingName) {
    // コンポーネントのパスがクラス名に入るように
    return path.relative(__dirname, filename);
  }
});

module.exports = {
  // 省略
  module: {
    rules: [
      {
        test: /\.tsx?$/,
        loader: "ts-loader",
        options: {
          onlyCompileBundledFiles: true,
          getCustomTransformers: () => ({
            before: [styledComponentsTransformer]
          })
        }
      }
    ]
  },
  // 省略
};

storybookで使う

"@storybook/preset-typescript" を使ってる前提

.storybook/main.js を

const path = require('path');
const createStyledComponentsTransformer = require("typescript-plugin-styled-components")
  .default;
const styledComponentsTransformer = createStyledComponentsTransformer({
  getDisplayName(filename, bindingName) {
    // コンポーネントのパスがクラス名に入るように
    return path.relative(path.resolve(__dirname, "../") ,filename)
  }
});
module.exports = {
  stories: [
    '../src/**/*.stories.tsx'
  ],
  addons: ['@storybook/addon-actions/register','@storybook/addon-actions', {
    name: "@storybook/preset-typescript",
    options: {
      tsLoaderOptions: {
        transpileOnly: true,
        getCustomTransformers: () => ({
          before: [styledComponentsTransformer]
        })
      },
      include: /\.tsx?$/
    }
  }]
};

でクラス名にファイルのパスが入るようになった。

じまろぐ

めめ

本を読んでる

転

アウトプットする

2020年振り返り

サイボウズに転職した

めっちゃ自粛した