cloud flare workerで省エネSSRなBlogを目指す
2020-04-13
世は技術ブログ大時代. みんなはてなブログか[JAMstack](https://jamstack.org/)にその身を委ねていた. お手軽さを求めるならはてなブログ, あるいはそこにカスタマイズ性やスピードを求めてHeadlessCMSにコンテンツを追加して動的に静的サイトを更新していくJAMstackな構成を目指した. 実際今の時代, GatsbyjsなりNextjsでもcontentfulなどを組み込んだJAMstackのテンプレートがあるので, HeadlessCMSからAPIを取得して環境変数として設定して, 適切にCI/CDを組んであげればもうJAMstackによる高速でお手軽な技術ブログが完成します. すごい時代だ.でもそんな中, あえてSSRを用いた動的な構成にロマンを感じ動的なブログを構築しようとした男がいました, いや僕なんですけど. cloud runでNode.jsの上にexpressサーバーを生やして, そこでJSXをreact-domを通してhtmlにしています. しかし一回のアクセスごとにexpressが立ち上がると時間がかかる(特にTTFB), そもそも従量課金制なのでアクセスのたびにサーバーを立ち上げるのでなく, 出来るだけキャッシュを効かせたい. 特にこの場合本質となるブログ記事はCMS上にあるのでそこを参照したい. というのを叶えたく, edge-sideでスクリプトを動かしてキャッシュを動的に管理して更なる最適化を目指す, という取り組みをしてみます
Next.jsとnow.shでブログを新しく作り替えた
2019-12-14
[Next.js 9](https://nextjs.org/blog/next-9) 7月8日Next.jsのv9リリースが発表されました。 実はこのブログの前身もNext.jsで書かれていて書いた当時はまだv8でした。でv9リリースからおよそ5ヶ月が経ってやっと、重い腰を上げて自分のブログのアップデートを試みました。 ですが蓋を開けるとあら不思議、あまりの~~クソ~~コードぷりになかなか作業が進まない。 具体的に言ってしまうと@ts-ignoreとanyのオンパレードで下手したらJSのまま作業するよりも酷い代物が出来上がっていました。 そんなものをアップデートしようとしても全然コンパイルが通らず、しかもバカ遅い。 ちなみにこれが書き換える前のlighthouseのスコア、無慈悲な0点に涙を禁じ得ません。 そしてもう何もかもが無理になり一から作り直してしまうことにしました(
TypeScriptの反変とどう向き合うか
2019-08-28
お久しぶりです、しにゃいです。  TypeScript いいですよね、静的型付けにより今あなたが触っているプロジェクトをより安全に進めて行くことができます。 しかしそんな TypeScript さんもなんだこれは、といってしまうような一見よくわからない挙動をすることがあります。 この記事ではその中の一つともいえよう反変について扱っておこうかなと思います
webpackからReact Lazy+Suspenseを試す
2019-08-21
お久しぶりです。しにゃいです。 この記事ではまた React+webpack をやろうと思います。今回は Lazy+Suspense を用いてコンポーネントを動的に読み込むやつをやろうと思います。 よかったら前回の記事も読んでねん。 [脱 create-react-app、React アプリの小さめ構築](https://www.shinyaigeek.com/p/21) [React アプリ小さめ構成 with react-router 編](https://www.shinyaigeek.com/p/22
Reactアプリ小さめ構成with react-router 編
2019-08-12
この記事は前回の記事の続きという感じです。これまた初学者向け [脱 create-react-app、React アプリの小さめ構築](https://www.shinyaigeek.com/p/22) この記事を読めば create-react-app なしで react アプリを構築できる様になるのですが、その続きとしてこの記事では react-router について扱おうと思います(開発していて思いの外どぶったので) react-router のエラー、割とありますよね. ていうか公式の API なり Document なりがよくわからないって感じはします。 なんかよくわからないけど 404 エラーが出たり、CANNOT GET URL みたいなエラーが出たり、僕もこれでどぶって、いい感じの日本語記事が見つからなかったのもあってじゃあ紹介しておこうかなという感じです
脱create-react-app、Reactアプリの小さめ構築
2019-08-10
突然ですがみなさん、React アプリ構築に create-react-app 使わないと出来ないのにフロントエンジニア名乗ってるなんてまさかですけどないですよね???webpack の設定いつも適当にコピペしてたりなんてしていませんよね??? (まあ僕も割とこんな感じだったので人の事は言えませんが) 今回は上記の煽りであ、やばいかもと思った人向けの記事です。 タイトルの通り create-react-app 無しでの React アプリ構築の手順(というか比較的小さい構築)をやっていこうかなと思います。(思ったより適当な日本語記事がなかったので) webpack,TypeScript あたりを使ってやって行く予定です。 目標は"Hello React"と書き出すとこまでです。 え??しょぼくない??と思う方もいると思われますが、これ以降の簡単なアプリ作ったりってのは結構どの記事でもやられているのでそちらを参考にしてほしいなという感じです。 また特にモジュール積みのところでガンガン module についての記事を載せたり、公式のドキュメントを載せていますが、これはイマイチわからない人は読んだ方がいいんじゃない?というくらいの気持ちで載せたので読む体力がないのであれば今は飛ばしても結構かと思われます。いつか思い出した時にでも読んでください
気付かぬ間にコピペコーダーになってた話
2019-04-07
お久しぶり?です。しにゃいです お元気ですか?僕は元気です、クソどうでもいいですねはい この記事はちょっとした僕のやらかしを書いています、恥ずかしいですねハイ コピペコーダー、怖いですよ。自分でも何書いてるかわかんないですもん。 しかもコピペコーダーのうちってなかなか自分がそうだと気づけないんですよ怖いことに、ああ怖い とりあえず今Googleで実装したいこと調べてQiitaで出てきたコードとかをあんまり中身を理解せずにコピペしていたり、teratailとかで質問しても、回答の内容が理解できずにコードをコピーしちゃって終わってる人とかはこれを絶対読もうなマジで
ブログGUI作りました!
2018-11-12
お久しぶりです、しにゃいでぇす! たまには進捗でも報告しようかなと いや最近は毎日毎日来る日も来る日もしこしこコーディングしてます まあプログラミングは楽しいからいいんですけど ALESA とか中国語だけは許せないですわマジで そう正直僕がコーディングしてるのって7割楽しい3割お金になるからなんですよね正直 多分コード書けるってのはこれからきますよ、ええ 僕は AI 信者意識高い系ではないですけど実際近い将来事務とかの仕事は減ると思ってるんですよね
進捗報告2
2018-10-23
お久しぶりです、しにゃい です 割と忙しくてめっちゃ時間が空いてしまった。。 取り敢えずですが近況報告をば 取り敢えず python の学習がある程度進んだので前言ってたテキストをまとめて変更する GUI 作りやしたぁ!