一步一步构建一个react应用-开篇

介绍

断断续续利用周末时间做了两个月,基于react和express的一个小项目差不多做完了。所以想写一系列文章来总结一下前后端用到技术及遇到的问题和解决方法

初衷是练习一下react相关的技术栈,但做的过程感觉对后端投入的热情更大。。。

线上地址

主要从下面几点入手

技术栈

  • react + react-router + antd-mobile + fetch
  • redux(没用,之后改)
  • express + mongodb + redis

运行

clone代码到本地 项目地址

喜欢就star一下吧?

前端:

    npm install
    npm start

后端:

    1. 需要安装mogondb 本项目mogondb端口 3307,并开启权限认证。可以在/BE/config/db.js中修改

    2. 需要安装redis  brew install redis

    3. npm install -g pm2

    3. node 版本最好最新版本,因为使用了 async await,推荐nvm来管理node版本

    4. npm install 

    5. npm run test 运行单元测试

    6. npm start

功能介绍

之前看了挺多棒子电影的,所以想做一个电影相关的小项目,主要功能:

  • 首页 电影列表展示,可搜索和分类筛选
  • 电影详情页(有无下载地址)
  • 爬取豆瓣电影并录入
  • 登录、注册
  • 管理员增删改查
  • 普通登录用户收藏电影
  • 我的收藏列表

部分截图

首页

《一步一步构建一个react应用-开篇》
《一步一步构建一个react应用-开篇》
《一步一步构建一个react应用-开篇》《一步一步构建一个react应用-开篇》

详情页

《一步一步构建一个react应用-开篇》
《一步一步构建一个react应用-开篇》

录入

《一步一步构建一个react应用-开篇》
《一步一步构建一个react应用-开篇》

用户

《一步一步构建一个react应用-开篇》
《一步一步构建一个react应用-开篇》
《一步一步构建一个react应用-开篇》

    原文作者:对对对就是这
    原文地址: https://segmentfault.com/a/1190000011006530
    本文转自网络文章,转载此文章仅为分享知识,如有侵权,请联系博主进行删除。
点赞