概要

エンジニアを始めたのにポートフォリオサイトが無いのはさみしいなと思ったので作ります。
どうせなら流行りのReactで動的webサイトを作ってみたいと思います。

こんな感じの人間がReactを使ってwebサイトを作ってみたいと思います。

Reactってなに？

javascriptのフレームワークでサイトを作るのに便利くらいしかReactのことを知らなかったので調べました。

コンポーネントベース: Reactでは、UIを再利用可能なコンポーネントに分割して構築します。これにより、コードの可読性と保守性が向上し、開発速度も向上します。
仮想DOM: Reactは、実際のDOMとは別に仮想DOM（Virtual DOM）というメモリ上の軽量なデータ構造を使用して、UIの変更を効率的に管理します。これにより、ページの再描画が最小限に抑えられ、パフォーマンスが向上します。
単方向データフロー: Reactでは、データは親コンポーネントから子コンポーネントへと一方向に流れます。これにより、データの管理が容易になり、アプリケーションの複雑さが抑えられます。

んーよくわかりませんが、触っていってみましょう。

Windows
[node.js公式ページ]https://nodejs.org

MacOS

brew install node@18.16.0

今回は18.16.0のnode.jsを使いました。

npm install react react-dom

ここではreact本体とreact-domをインストールしてます。
インストールはこれで終わりです。簡単ですね。

npx create-react-app "APP名"

これでカレントディレクトリにReactのアプリケーションができました。

cd "APP名"
npm start

デフォルトブラウザにロゴがくるくる回転するwebページが出ればＯＫです。

明日はフォルダの中身をみて、簡単にカスタマイズしてみようと思います。