项目以及项目笔记会不断更新

体会vue与react项目区别

声明：本项目参考了滴滴大佬的vue项目，原vue项目请关注

项目运行

前端项目启动

npm install

npm start

项目中用到的一些自定义types在common/js/typings目录下

可以通过dts-gen为没有types的npm包自动生成d.ts声明文件

后端项目启动

安装mysql

启动mysql服务:net start <mysql程序名称>

登录用户: mysql -uroot -p

输入密码

创建数据库：CREATE DATABASE music;

利用server/sql/music.sql中的查询语句创建数据表user

启动一个终端，切换到server文件夹下

npm install

npm start

项目笔记

D1

D2

D3

D4

D5

部署

node后端

ToDo

• 完善项目中typescript类型
  • store，action类型
  • 数据类型
  • 无状态组件 React.SFC
  • 有状态组件 readonly state : Readonly<IState>，react已经对props、props的属性与state的属性作了只读处理
  • react事件类型
  • ref类型 React.RefObject<Scroll> --> <Scroll ref={this.toplist}></Scroll>
  • 媒体事件类型 const { currentTime } : { currentTime: number } = e.target as HTMLMediaElement
• 项目本地部署
• 组件优化
• create-react-app优化打包
• electron构建exe
• 个人中心管理系统
  • mysql数据库表的设计
  • 登录注册
  • koa2-cors解决跨域
  • koa-bodyparser解决post数据的解析与提取
  • 后端API功能实现、postman测试、前端测试:getDataByPage, addFavorite, deleteFavorite
  • cookie
  • session

页面展示