概要 本記事は rebase で運用するリポジトリでコミットがぐちゃぐちゃなってしまい、コンフリクト対応に苦労した自身の対応記録になります。 上記を回避するには、コミットの整理が有効です。 コミットを整理するには git rebase -i が使えます。ローカルブ…

はじめに この記事は何の話？ 継続のコツ なぜ書こうと思った？ そもそもなぜ継続できなくなるのか？ どうするとよい？ 行動を習慣化する 習慣化するために小さくはじめる 実践した小さな習慣 もっと楽に進められるように意識を変えた 『小さな習慣』の応用 …

以前学んだアジャイル開発とスクラム開発について少し整理する機会があったのでまとめておこうと思います。 アジャイル開発 アジャイル開発のマインドセット ４つの価値 12の原則 顧客満足を最優先し、価値のあるソフトウェアを早く継続的に提供します 要求…

安全なウェブサイトの作り方を読んだので、理解した内容を自分なりにまとめておきます。資料 上記は3章構成になっていてそれぞれ長めの内容なので、ここでは3章の『失敗例』について、Ruby on Rails ではどうするかについてをまとめます。 SQL インジェクシ…

安全なウェブサイトの作り方を読んだので、理解した内容を自分なりにまとめておきます。資料 上記は3章構成になっていてそれぞれ長めの内容なので、ここでは2章の『ウェブサイトの安全性向上のための取り組み』の Web サーバの運用に関する対策や、Web サイ…

安全なウェブサイトの作り方を読んだので、理解した内容を自分なりにまとめておきます。資料 上記は3章構成になっていてそれぞれ長めの内容なので、ここでは1章の『ウェブアプリケーションのセキュリティ実装』の設計や実装レベルの解決や対策方法についてま…

Rails セキュリティガイド - Railsガイドを読んだので、理解した内容を自分なりにまとめておきます。 Web アプリケーションの脅威 セッション セッションハイジャック セッションストレージ cookie のローテション CookieStore セッションに対するリプレイ攻…

SWR とは useSWR の API コンテキストとして SWR を使う 関数として利用する 自動再検証 条件付きフェッチ 引数 参考 SWR とは SWR(stale-while-revalidate) は、データ取得のための React Hooks ライブラリで、次の戦略で実装されている。 キャッシュからデ…

イベントハンドラとエフェクトの選び方 エフェクトからの切り離し エフェクトイベントの命名のコツ エフェクトで依存値を取り除く方法 イベントハンドラへの移動を考える エフェクト内の無関係なロジックは分ける リンタに依存値でないことを示す 前回値を使…

初めてOSSにIssueを立てましたこの記事ではアラサーおじさんの僕が OSS 開発活動を通して感じたことや学んだことなどをまとめておこうと思います。 なんで OSS 開発活動をしてみようと思った？ 覚えておきたい、OSS 開発活動の肝 OSS 開発活動の作業時のポイ…

Effect の書き方 Effect を宣言する Effect の依存値の配列を指定する 必要に応じてクリーンアップを追加する 参考 Effect を理解するためには次のロジックを押さえておく必要がある。 レンダーコード コンポーネントのトップレベルにあるもので、props や s…

ref の使い方 ref を参照すべきでないタイミング 参考 DOM ノードにアクセスする時に使うのが ref 。 本来 React がレンダー結果に応じて DOM を自動更新するので、コンポーネントで DOM を操作することはないが、ノードへのフォーカスやサイズ・位置測定で…

リデューサ関数とは state セットのアクションをディスパッチに置き換える リデューサ関数を作成する コンポーネントからリデューサを使用する 良いリデューサの書き方 直接 state をセットするのとリデューサの違いのまとめ 参考 リデューサ関数とは コンポ…

インタラクティビティの追加 – Reactで理解した内容をまとめていきます イベントへの応答 イベントハンドラ イベントオブジェクト state：コンポーネントのメモリ コンポーネントでデータ更新するために必要なこと state セット関数にはコールバック関数が渡…

コンポーネントを純粋に保つ – Reactのチャレンジ問題の最後でハマってしまいましたハマったのは下記コード： export default function StoryTray({ stories }) { let storiesTray = stories; storiesTray.push({ id: "create", label: "Create Story", }); …

純関数 なぜ純関数が重要なのか？ 参考 純関数 純関数とは『計算だけを行い、他には何もしない関数のこと』で次の特徴がある。 呼び出される前に存在していたオブジェクトや変数を変更しない 同じ入力を与えると、純関数は常に同じ結果を返す 純関数は数学で…

アロー関数は直後の式を返す 配列のアイテムに key が必要な理由 キーのルール 参考 アロー関数は直後の式を返す あまりちゃんと意識できていなかったんですが、アロー関数は直後の式を自動的に返す。{} で囲まれる場合は、ブロック形式の関数とみなされるの…

本全体への所感 印象に残った点 情報セキュリティとは リバースブルートフォース攻撃 参考 暗号と認証のしくみと理論がこれ1冊でしっかりわかる教科書を読んで重要だと思ったことのまとめです。 本全体への所感 絵が多めでイメージしやすく理解しやすい 印象…

React がマークアップとレンダリングロジックを混在する理由 JSXのルール コンバータの利用 参考 React がマークアップとレンダリングロジックを混在する理由 ウェブサイトは、コンテンツを HTML、デザインを CSS、ロジックを JavaScript で書くというのが一…

衛星測位について発見のあった内容をつらつらと書いていきます。 キーワード RTK による位置測位の仕組み 衛星測位には４機以上が必要 自分で基準局を設置する方法 『干渉』や『なりすまし』に問題あり 標高はジオイドからの高さ 参考 キーワード RTK による…

カイゼンジャーニーを読んで、心に響いた内容をつらつらと書いていきます。 キーワード 小さく試みる Start with why(目的から始めよ) むきなおりで現在を正す 星取表でチームスキルの見える化 ヒーローはチーム カンバンで問題をみえる化する リーダーズイ…

モックから考える Step1: UI をコンポーネントの階層構造に落とし込む Step2: React で静的な ToDo アプリを作成する 静的なリストで表示してみる Step3: 必要十分な state の決定 Step4: state をどこに配置するべきなのかを明確にする Step5: 逆方向のデー…

等価と等値の意味をちゃんとできていなかったので整理。 項目 説明 等値 同一のオブジェクトであること（同じアドレス値を指している） 等価 意味的に同じであること ちゃんと理解できていなかったのは、厳密等価演算子と等価演算子の使い方を勘違いしていた…

React でのアプリの作り方の流れを、React の流儀 – Reactの検索可能な商品データ表を例に学んだ。 モックを作る UI をコンポーネントの階層構造に落とし込む React で静的なバージョンを作成する UI 状態を表現する必要十分な state を決定する state をど…

『state, props って同じようにデータを持つようだけど何が違う 』となってしまったので調査。Component Best Practices | React at Preactを参考にしました。 state 変更可能なデータ(mutable) 変更があると、仮想 DOM との差分を取り、ブラウザ DOM を更新…

要素とは 要素を DOM として描画する コンポーネントとは 関数コンポーネントとクラスコンポーネント コンポーネントのレンダー クラスにローカル state を追加する ライフサイクルメソッド 参考 要素とは 要素は React アプリケーションの最小単位の構成ブ…

単項演算子は前後のどちらかにつけるかによって評価結果が変わり、どっちの結果となるかがわかりにくいため、式*1の中では用いないようにする。 ++, -- を使いたい場合には文*2として記述する。 式で書くパターン： var Items = []; var maxId = 0; // 式で…

概要 属性の指定 インジェクション攻撃を防ぐ JSX はオブジェクト 参考 概要 JSX は JavaScript の構文拡張で、React 要素を生成する： const element = <h1>Hello, world!</h1>; JSX のメリットは、マークアップとロジック両方をそのまま含んだように記述でき、コー…

CDN とは CDN を使うメリット CDN を使うデメリット Vue で CDN を用いる CDN での Vue2 から Vue3 への移行 Vue is not a constructor のエラー対応 CDN とは まずは、バージョンを変えるために CDN を見直しました。そもそも CDN 自体ちゃんとわかっていな…

React とは コンポーネントとは React の名付けの慣習 関数コンポーネント 参考 React とは React はユーザインターフェースを構築するための JavaScript ライブラリ。UI を『コンポーネント』と呼ばれる小さく独立した単位で組み立てることができる。 コン…