30歳からのプログラミング

30歳無職から独学でプログラミングを開始した人間の記録。

SPA

SPA を GitHub Actions でビルドして GitHub Pages にデプロイする

デプロイの自動化と History API のフォールバック設定を行うことで、GitHub Pages で SPA を公開できるようにする。 具体的なゴールは以下の通り。 masterブランチにプッシュすると、自動的にビルドが行われる ビルドした内容が GitHub Pages として公開さ…

React Hooks + Redux Hooks + TypeScript で SPA を構築する

2019/07/14 追記 ディスカウント後の価格みたいな導出項目はselector (reselect)を使うとよいのでは https://redux.js.org/recipes/computing-derived-data - YonmanHasseのコメント / はてなブックマーク というコメントを頂き、確かに便利そうだったので導…

Lambda@Edge で History API のフォールバックを複数設定する

SPA を開発する際に必須のタスクの一つとして、History APIのフォールバック(以下、単に「フォールバック」と記述する)がある。 この事象について掻い摘んで説明すると、SPA においては URL と HTML ファイルが一対一になっていないので、それに伴う対応を…

SPA フルリニューアル計画における技術選定や設計思想(2019年2月版)

SPA のフルリニューアルを技術選定や設計からやることになった。 前回の記事も、そのために検討や調査を行っている際に生まれた副産物をまとめたものだ。 目指すべきは変更しやすいシステムであり、そしてそれは、堅牢性を実現することで達成されるはずだと…

SPA の CSRF 対策や CORS について検証する

SPAのCSRF対策について調べる機会があったので、まとめておく。 CORSの挙動を中心に、実際にコードを書いて検証していった。 間違ったことは書いていないと思うけど、利用は自己責任でお願いします。 CSRF とは CSRFそのものについての詳しい記事はネット上…