React Portfolio 网站构建指南

本指南介绍如何使用 Create React App 构建个人作品集网站。

项目启动

在项目目录下,您可以运行以下命令:

  • npm start: 以开发模式运行应用程序。在浏览器中打开 http://localhost:3000/ 即可查看。代码修改后页面会自动重新加载,控制台中会显示错误信息。
  • npm test: 以交互模式启动测试运行器。更多信息请参考 Create React App 文档中关于测试的部分。

项目构建

  • npm run build: 构建生产环境可用的应用程序,并将结果输出到 build 文件夹。该命令会以生产模式正确打包 React,并优化构建以获得最佳性能。构建文件会被压缩,文件名包含哈希值。更多信息请参考 Create React App 文档中关于部署的部分。
  • npm run eject: 注意:这是一个不可逆操作! 执行该命令后,您将无法返回 Create React App 的默认配置。如果您对默认的构建工具和配置不满意,可以执行此操作来自定义配置。该命令会将所有配置文件和传递依赖项(例如 webpack、Babel、ESLint 等)复制到您的项目中,以便您进行完全控制。

总结

本指南简要介绍了使用 Create React App 构建 React Portfolio 网站的基本步骤,包括项目启动、测试和构建等。

zip
react-portfolio-main.zip 预估大小:20个文件
folder
react-portfolio-main 文件夹
file
.gitignore 310B
file
package.json 904B
file
package-lock.json 674KB
folder
src 文件夹
folder
components 文件夹
folder
Header 文件夹
folder
Header.jsx 文件夹
folder
ProjectCard 文件夹
folder
ProjectCard.jsx 文件夹
folder
NavBar 文件夹
folder
NavBar.jsx 文件夹
folder
Footer 文件夹
folder
Footer.jsx 文件夹
folder
Pages 文件夹
folder
About 文件夹
folder
About.jsx 文件夹
folder
Portfolio 文件夹
folder
Portfolio.jsx 文件夹
folder
Contact 文件夹
folder
Contact.jsx 文件夹
folder
Experience 文件夹
folder
Experience.jsx 文件夹
file
index.js 500B
file
App.js 528B
file
reportWebVitals.js 362B
file
App.css 450B
file
index.css 366B
folder
public 文件夹
file
robots.txt 67B
file
index.html 472B
file
manifest.json 192B
file
README.md 3KB
zip 文件大小:171.59KB