ブログ

テレワークができないお仕事

自分がシステムエンジニアとして主に携わっている分野はかなり機密性の高い分野です。設計書やソースコードは社外からの参照が不可能、テスト環境などにも社外からはアクセスできません。仮にUSBメモリでデータを持ち出そうにも、USBメモリをPCに差...
react

react HooksでsetTimeoutやsetIntervalなどからstateを参照する

react HooksでsetTimeoutやsetIntervalなどからstateを参照する場合はuseRefを使用するといいらしい。カスタムイベントなど独自のものを実装する際にも同じ手が使えると思う。 stateの値を読み出す...
react

react hooksのuseEffect実装3パターン

useEffectは、第二引数に渡す値によって動作が変わってくる。ここさえ掴んでしまえば結構便利な機能だと思う。 第二引数に空の配列を使用するパターン コンポーネントがマウント(DOMへ挿入≒表示)された時とアンマウント(DO...
react

react Hooksを扱ってみた所感

reactほぼ初心者の自分がいきなりreact Hooksを使ってみた。最初の頃はなかなか自分の感覚と合わないところがあったが徐々に慣れてくると、  実装を1箇所に集約できるバグが発生しにくくなる 関数型のスタイルによって再利用が容...
react

reactでリストをレンダリングする際に気をつけること – key指定

reactにおいてリストを動的にレンダリングする場合、key要素に正しい値を指定すべきである。未指定、配列のインデックスを使用する、ということを避け、なんらかのロジック(ここではshortidを使用)で採番した一意なIDを指定すべきである...
react

reactでリストをレンダリングする際に気をつけること – 配列操作

reactでリストをレンダリングするためにstateに配列を持たせる。この配列の操作を謝ると、リストは期待通りに更新されない。reactを始めたばかりの頃はハマってしまうことも多いと思われる。 だめな例 App.tsx ...
react

create-react-appでsource mapを出力しない方法

create-react-appで作成したアプリをビルドすると、ソースマップ(*.js.map)が自動的に作成される。ソースマップを作成したくない場合は、".env.production"あたりに GENERATE_SOURCEMA...
react

create-react-appで作成したwebアプリのファイルサイズを削る

create-react-appで作成したアプリをクラウドにリリースしようとしたが、ファイルサイズが少々気になったため、これを削ってみることにした。 npx create-react-app コマンドで作成したreactアプ...
react

reactで新しいwebアプリを作成する(2020年4月時点)

reactを使用して新しいwebアプリの作成を開始してみる。この記事では雛形のビルドまでを行っているが、実に短時間で完了する。なお今回はエディタとして無料のVisual Studio Codeを採用している。最近は仕事現場でもVisual...
タイトルとURLをコピーしました