【第一章】学习React:已成功建立React开发环境
简要概述
我开始做工程师了,但是我觉得没有作品集网站很寂寞,所以我打算做一个。
既然要做,我想用流行的React来制作一个动态的网站。
持ってる知識
webサーバ関連のインフラ知識
基本的なことだけ知っている
html
css
javascript
node.js
何も知らない
React
我想以这种感觉的人,尝试使用React来制作网站。
React是什么?
因为我只知道React是一个在JavaScript框架中用来建立网站非常方便的工具,所以我进行了一些调查。
-
- 组件化开发:React将UI拆分为可复用的组件进行构建。这样可以提高代码的可读性和可维护性,并加快开发速度。
-
- 虚拟DOM:React使用轻量级的内存数据结构虚拟DOM(Virtual DOM),与实际DOM分离,以高效地管理UI的变化。这样可以最大限度地减少页面的重绘,提高性能。
- 单向数据流:React中的数据从父组件向子组件单向流动。这样可以简化数据管理,降低应用程序的复杂性。
嗯,我不是很清楚,但我们可以试着碰一下。
引入方式
- 安装Node.js
- reactはNode.jsで動くということがわかりました。まずはnode.jsをインストールします。
Windows
[node.js official website]https://nodejs.org
苹果操作系统中的MacOS
brew install node@18.16.0
这次我们使用的是 18.16.0 版本的 node.js。
- 安装React
- Reactはnpmでインストールです。
npm install react react-dom
在这里,我们正在安装React核心和React-DOM。
安装完成后,这就结束了。很简单,不是吗?
创建一个React应用程序。
- インストールしたReactで早速アプリケーションを作ってみましょう。
npx create-react-app "APP名"
现在,您已经在当前目录中创建了一个React应用程序。
我们来启动一个示例应用程序吧。
cd "APP名"
npm start
