一生使える投資の極意を読んだ

注意

この記事を読んでチャレンジした結果資産を減らしても一切責任を持ちません

本題

GW１冊くらい本を読もうということで、以下の本を読んだ*1

世界を見てきた投資のプロが新入社員にこっそり教えている驚くほどシンプルで一生使える投資の極意

よく「株で一発当てて大金持ちになる」みたいなの言ってる人とかtwitterのbio欄に似たような事書いてる人がいるけど、この本を読むと投資とギャンブルの違いというかギャンブルみたいな投資はやめておこうという事とか、投資をする時の考え方みたいなものが書いてある。

なるほどな〜となったもの

自分への投資が給与を上げるという意味で一番簡単にお金を増やす方法だし、健康であることは一番の価値ということと、仕事の相手によって自分が将来的に稼ぐ給与を考えると基本的に大量の日本資産を持っていているという話。

特に基準なく雑に投資本読み漁った感じ、大体の本で”バランス"という言葉が出てきて

• 国内、海外の資産バランス
• どのくらいの確度で増えるのかというバランス
  • 株などと債権・定期預金などの差

という感じの話がよくされているのでたぶんここが大事でなんだろうなと思う。

まとめ

去年何も新しいことを初めてないなと思って積立NISAを始めるなどし、飲み会がなくなった分をつぎ込んだら1年で使える積立NISAの上限に達しているので次何するかと考えている。

なんとなく知ってたけど好きだったアイドル*2も投資してるらしいので、そのうちどっかの企業の株を買ったりしてるかもしれん。

「バフェットの投資術」を学んだら、生き方まで変わった話。

*1:amazon prime会員であればprime readingで無料で読める

*2:全く関係ないけど今もタワレコあべのHoop店は中田花奈を応援してるのだろうか卒業したらどうなるんだろう

reactを自作するやつやってみた

元記事

pomb.us

日本語訳

zenn.dev

環境構築

環境自体はreact-scriptsを使用する

やってみて

• Fiberの名前だけ知らなかったものがどういったものかわかった
• JSX解釈の実装方法を学べた
• 他の処理を妨げないようにrequestIdleCallbackでループを作って画面を組み立てる仕組みがわかった
• 「hooksは実質配列」というの雰囲気しか理解していなかった所を実装することで学べた
• 雰囲気しか理解していなかったdocument.createElementを使ったdomを組み立てる仕組みが学べた

やってみたソース

GitHub - yuzu-sandbox/build-own-react

あとでTypescriptで実装し直そうという考えがあったのでとても雑に写経してしまった。ただ普段TSしか書いてないので型の補助がないjsで書くとちょこちょこtypoとかをしてしまったのでゆるふわでも最初からTSで書けばよかったなとかは思った。

ハマった点

いくつかハマった箇所があったので書いておく

jsx pragmaうまく動かない

作業中Reactを自作のものに置き換える際に/** @jsx *を使用して、React.createElementを置き換える必要があるがReact17からjsxの解決方法が変わってしまったので旧実装を使用する必要がある

react-scriptsではDISABLE_NEW_JSX_TRANSFORM=trueを環境変数に設定する必要がある。.envファイルを使用して設定しておくのが一番楽だと思われる

github.com

Step6 差分検出 - Reconciliation

一通り書いて、最初のレンダリング時にeventどうやってセットされるんだろうと思ったらいつの間にかcreateDom関数の中身がupdateDomに置き換えられていた*1

updateDom関数が定義されたらcreateDom内をupdateDomに置き換える

function createDom(fiber) {
  const dom = fiber.type === "TEXT_ELEMENT"
    ? document.createTextNode("")
    : document.createElement(fiber.type)
  updateDom(dom, {}, fiber.props)
  return dom
}

*1:ぱっと見書き換えてないような気がするんだけどcodesandbox見てて気づいた

firebase hostingのメンテナンスモードを考える

firebase hostingを利用しているサービスでメンテナンスモードの実装を考えた結果をまとめる。

理想

• SEO的に503 service unavailable を返したい
• firebaseの機能だけでやりたい(cloud runとか使わない)
• 全アクセスを503ページへ

tl;dr

SPAモードのhostingでいい感じに503を返す方法がない。soft503で雰囲気を出すしかないっぽい。*1

たぶんhard503を出そうと思うとcloud runとかを使ってステータスコード503のレスポンスを作って返すしかなさげ。

とりあえずindex.htmlの代わりに出したいページ(例:503.html)を出すために雑にindex.htmlにリダイレクトしてるものを503.htmlに置き換えるとキャッシュされてしまった結果サービス再開のタイミングが作業が終わってキャッシュが消えた時になってしまうので、直接503.htmlをステータス200で返してはいけない。

またMDN見てるとRetry-Afterヘッダーを設定してやるのがベターらしい

developer.mozilla.org

設定

前提として対象のサービスはアプリケーションとサービストップページでドメインを分けていて、サービストップページだけ検索エンジンに登録されればいいかという構成。

そして色々考えた結果、index.htmlの代わりに503.htmlがキャッシュされてしまう事だけは避けたかったので以下の事を妥協。

• 503ページがステータスコード200で返ることを受け入れる
• メンテナンスの度にruleを書き換えてデプロイする

設定したredirectルール

追加した部分以外を省略すると、以下のredirect設定を追加した。

{
  "redirects": [
    {
      "source": "/",
      "destination": "/503.html",
      "type": 307
    },
    {
      "source": "**/!(*.html|*.ico|*.png|*.jpg|*.txt|*.js|*.json|*.css)",
      "destination": "/503.html",
      "type": 307
    }
  ]
}

"source": "/"で/のパスのものをリダイレクトして、"source": "**/!(*.html|*.ico|*.png|*.js|*.json|*.css)"で静的なリソース以外のリクエストをリダイレクトする。

その他の実装

色々調べたらfirebaseを使っているのでcloud datastoreを利用してメンテナンスモードフラグのようなものを管理し切り替えを行っている人などがいた。みんなそれぞれ何かしらの工夫をしてて、中にはそれキャッシュどうするんだというものがいくつかあったのでやる時はちゃんとキャッシュ周りを調べてからやったほうが良さそう。

*1:firebase様御社のプロダクトであるbotのために503返すメンテナンスモードボタン実装してください。。