React+TS前台项目实战(一)-- 项目初始化配置及开此系列的初衷

文章目录


前言

前面 后台管理系统实战 系列教程暂时告一段落了,想了解全局各种配置的可自行查看。本次教程将重点介绍React前台项目的实操,关于具体的配置,将不再详细介绍,只提供本项目所需的额外配置项说明。React前台项目会更加考验性能方面的优化,如高频数据请求、组件渲染性能、代码分割和懒加载等方面的处理。


一、初始化项目

创建项目选择带typescript版本的,指令为
npx create-react-app react-frontend-ts- --template typescript

二、基础配置

1. 项目目录及说明如下

2. TS版本使用Craco需注意

注: TS版本的配置略有不同,具体看前面的文章 React中使用 ts 后,craco库配置别名时需要注意什么?


总结

接下来,我将以一个区块链项目为例子,使用TypeScript进行约束、通过memo和useMemo等函数来实现页面高频请求数据时的性能优化。还会使用react-query库来处理接口请求和数据缓存等处理、进行国际化语言配置、页面响应式处理、以及结合AndDesign UI框架来构建一个完整的前台项目。关注本栏目,会实时更新。

相关推荐
weixin_382395237 小时前
为小工厂量身打造:本地部署的物料管理系统带缺料计算
前端·制造
__zRainy__7 小时前
解决pnpm v10+不自动构建
前端·pnpm·工程化
猫猫不是喵喵.7 小时前
Vue3 Props 属性
前端·javascript·vue.js
醉城夜风~8 小时前
CSS元素显示模式(display)
前端·css
AI大模型-小华9 小时前
Codex 三方充值快速入门指南
java·前端·数据库·chatgpt·ai编程·codex·chatgpt pro
做前端的娜娜子11 小时前
同一链接实现 PC Web 与移动 H5 自适应
前端·掘金·金石计划
小帅不太帅11 小时前
架构没变、规模没变,DeepSeek V4 Flash 正式版凭什么暴涨 47 分?
前端·aigc·deepseek
jarvisuni12 小时前
DeepSeekFlash前端依旧拉垮,而且变慢了很多!
前端·javascript·算法
卷福同学13 小时前
AI编程出海第二步:验证关键词能否做站
前端·人工智能·后端