lamechang-dev

Webフロントエンドエンジニア lamechangのブログ。

2022/01-04振り返り

1-4月 生活など これまでの社会人生活で初めてしっかり体調を崩す 仕事 仕事で担当していた重めのPJが終わりに向かう アウトプット・勉強とか コワーキングスペースの契約 ブログ ポートフォリオサイト 読んだ本や動画 5-8月の目標 1-4月 生活など これまで…

コワーキングスペースの土日プランを契約した話

コワーキングスペースを契約しました 家から自転車で10分弱程度のところにあるBIZcomfortを土日プランで契約しました。めちゃくちゃいいのでそれについてざっと書きます。 bizcomfort.jp 契約した理由3点 1.副業を再開するため また本業と別のスタートアッ…

【TypeScript】レコード型とマップ型

はじめに レコード型 マップ型 組み込みのマップ型 はじめに 今回はTypeScriptにおいてObjectの型定義をしていく上で必須知識とも言っても過言ではないレコード型・マップ型についてです。花粉辛い。 レコード型 TypeScriptの組み込みのRecord 型は 、 ある…

【TypeScript】過剰プロパティチェックの挙動

過剰なプロパティチェック 過剰プロパティチェックが適用されないケース 変数に割り当てられる際の例 型アサーションの例 過剰なプロパティチェック TypeScriptには、過剰なプロパティチェックを行う機能が存在します。まず、以下の例を見てみましょう。 typ…

コードを一切書かない上流SEを3年やった後にコードを書くWebエンジニアを2年やって思ったことをつらつらと

2021年2月末でWebエンジニアになってから丸2年経つので、ポエムです。ポエムは緊張しますね。 SIerで上流SE3年 マネジメント・SE業務について 英語について 余暇の使い方ついて Webベンチャーでエンジニア2年 文化について 業務について 余暇の使い方につ…

【TypeScript】サブタイプとスーパータイプ、そして変性について

サブタイプとスーパータイプ サブタイプ(subtype) スーパータイプ(supertype) 変性とは? 関数の変性 参考文献 サブタイプとスーパータイプ TypeScript上での型の間の関係についての概念である サブタイプ スーパータイプ についてです。 サブタイプ(su…

【TypeScript】【React】【Recoil】翻訳しながらそれなりに型をつけて細々と進めていくRecoil Tutorial その4 Asynchronous Data Queries編(2)

本記事は、Reactの提供元であるFacebook改めMetaが開発中の新しい状態管理ライブラリである Recoil の公式チュートリアルを翻訳しつつ、TypeScriptで型付けをしながら進めていく連載の第四弾です。細々とやっていきます 今回は Asynchronous Data Queries の…

【TypeScript】【React】【Recoil】翻訳しながらそれなりに型をつけて細々と進めていくRecoil Tutorial その3 Asynchronous Data Queries編(1)

本記事は、Reactの提供元であるFacebook改めMetaが開発中の新しい状態管理ライブラリである Recoil の公式チュートリアルを翻訳しつつ、TypeScriptで型付けをしながら進めていく連載の第三弾です。細々とやっていきます 今回は Asynchronous Data Queries に…

【TypeScript】【React】【Recoil】翻訳しながらそれなりに型をつけて細々と進めていくRecoil Tutorial その2 Selector編

本記事は、Reactの提供元であるFacebook改めMetaが開発中の新しい状態管理ライブラリである Recoil の公式チュートリアルを翻訳しつつ、TypeScriptで型付けをしながら進めていく連載の第二弾です。細々とやっていきます 今回は Selector について。 recoiljs…

【TypeScript】【React】【Recoil】翻訳しながらそれなりに型をつけて細々と進めていくRecoil Tutorial その1 Atom編

本記事は、Reactの提供元であるFacebook改めMetaが開発中の新しい状態管理ライブラリである Recoil の公式チュートリアルを翻訳しつつ、TypeScriptで型付けをしながら進めていく連載の第一弾です。細々とやっていきます まずは Atom について。 recoiljs.org…

【JavaScript/TypeScript】条件に応じてオブジェクトのプロパティを追加する方法

※ ES6以上の動作環境 JavaScriptにおいて、条件に応じて(Conditionallyに)オブジェクトのプロパティを付与する方法について一応書きます。書こうと思った動機は「意外と頻出な実装パターンに見えてあまり日本語の情報にヒットしなかった」から困ってる人いる…

【Material UI】スナップショット実行時にコードが修正がないにも関わらず属性値に差分が出る

環境:"@material-ui/core": "^4.10.2” 特定のコンポーネントに一意の属性を自動で付与する挙動の影響でコード上の修正がなくてもスナップショットの実行時に差分が出ることがあります。差分が生じる箇所は aria-xxxx や id 、 class など複数属性のようです…

2021年振り返り

2021年の所感(技術編) 1月-3月 人生初の副業を始めましたWebエンジニアにキャリアチェンジすると決めた2019年秋頃に少し触ってたReact.js周りを復習しながら、フロントエンドメインで2社掛け持ちさせてもらってました 本職ではVue.js・LaravelでのLP構築。E…

【ポエム】【ITエンジニア】これまでのキャリアの反省と今後のキャリアについて

自分のこれまでのキャリアについて 自分の経歴について整理するのは初めてですが、一応紹介しておきます。 自分は新卒でNRIのアプリケーションエンジニアとして3年間働いた後に、Web系メガベンチャーでソフトウェアエンジニアとして約1年半勤務しました。そ…

【React】Effect Hook とclassコンポーネントのライフサイクルメソッドの細かい相違点を整理した

TL;DR 実行されるタイミングが違う propsとstateの値の即時性が違う 関数の中に含まれる機能の純粋度(凝集度)が違う 1. 実行されるタイミングが違う ComponentDidMount:コンポーネントがマウントされてレンダリングの内容が仮想DOMからリアルDOMへ反映され…

【material-ui】Gridコンポーネントのブレークポイント propsにbooleanを渡した際の挙動を知る

material-uiのgridコンポーネントとprops material-uiをデザインシステムとして利用した際に、レスポンシブデザインの対応方法としてgridレイアウトにブレークポイントを設定することは多いと思います。以下のような設定値を渡すことができます。 xs 全ての…

【React】RecoilのSelectorで非同期を用いたデータ取得をする

Recoilについて Context APIが抱えるいくつかの制約を解消しうる、Facebookによって提唱されたライブラリ。「Atom」「Selector」と呼ばれる単位を使用してアプリケーションデータを管理する。 Atom Atomsは、ReduxでいうところのStoreに相当。 明確な違いと…