React + TypeScript (craete-react-appは未使用)の環境にeslintをインストールしたときのメモです。
セットアップが面倒かと思っていたのですが、`npx eslint --init`するだけで必要なnpmパッケージも自動でインストールされるし非常に簡単でした。
...
## 発生した問題
ReactのコンポーネントでtextAlignのスタイルを適用としたところ、エラーが発生した。
```language-js
const App = () => {
const divStyle = {
textAlign: 'right',
}
return (
hello
);...
TypeScriptを使ってReactのコードを書いているときに、onKeyPressイベントに対するイベントオブジェクトの型指定方法です。
この例では、Inputタグに対するキーボードイベントを処理したいので、`React.KeyboardEvent`の型指定を行っています。
```lan...
Reactに関する書籍・web記事を見ていると、場合よってはjsx/tsxファイルの1行目に`import React from 'react'`を書かなければならないという記述があります。
一方で、"この記述は古いバージョンの時の話で最近はそうではない"という記載もあります。
...
## 発生した事象
Reactのプログラムを`yarn run webpack`で作成したところ、ビルドは通ったがブラウザで表示するとコンソールに下記のエラーが出力された。
(仕組みを理解するために`create-react-app`を使わずに、手作業でwebpackの環境構築してい...
Reactのプロジェクトを`create-react-app`で作成すると、`npm start`させた時に自動でブラウザが起動します。macOSの場合だと、複数のブラウザをインストールしているときは、Chromeが優先されます。
通常の開発であれば自動起動するのは便利なのですが...
create-react-appを使ってTypeScriptのReactプロジェクトを、カレントディレクトリ作成するコマンドです。
```language-bash
npx create-react-app . --template typescript
npm start
```
## はじめに
この記事では、craete-react-appのV5で作成したReactプロジェクトに対して、React RouterのV6をインストールして複数URLでページを表示させるための作業を説明します。
## バージョン
この記事は下記バージョンのパッケージで動作...
この記事では、`React` + `TypeScript`でmuiを使ったページを作り始めるための準備をするための手順を説明します。
muiは以前はMaterialUIと呼ばれていました。
## プロジェクトを作る
```language-bash
npx create-react-app 211107-create-rea...