本项目基于nei搭建，自动集成mock数据，建议使用NEI工具启动项目
安装nei
npm install nei –g
启动项目
nei server
本项目提供了以下素材：
| 文件名 | 说明 |
|---|---|
| 首页.png及首页.psd | 首页及psd源文件 |
| 登录.png及登录.psd | 登录弹窗及psd源文件 |
| 注册.png及注册.psd | 注册弹窗及psd源文件 |
| 我的作品.png及我的作品.psd | 我的作品及psd源文件 |
| 上传作品.png及上传作品.psd | 上传作品及psd源文件 |
| 我的作品.png及我的作品.psd | 我的作品及psd源文件 |
| banner0, 1, 2, 3.jpg | 4张banner图片 |
| loading.gif | 加载图标 |
| address_codes.js | 省市区代码 |
| md5.js | md5 加密库文件 |
注：✔为实现，✖为未实现
3.1首页
顶部tab
-
a)有选中效果✔
-
b)hover动画效果✔
-
顶部搜索可用
-
a)搜索非空进行搜索操作✔
-
b)回车和点击图标都可进行搜索操作✔
-
登录后顶部展示用户信息
-
a)用户名很长…显示✔
-
b)hover出现下拉列表✔
-
c)点击"退出登录"退出，跳转到首页✔
-
轮播图
-
a)图片垂直剧中✔
-
b)图片5s切换（500ms淡入淡出）✔
-
c)点击指示器定位到指定图片✔
-
d)hover上去轮播停止，hover退出轮播继续✔
-
明日之星
-
a)列表展示正确✔
-
b)未登录时，点击关注，弹出登录弹窗✔
-
c)已登录时，关注和取消关注功能可用✔
-
其他效果显示正确
-
a)侧边热门话题2行显示，文字太多直接截断✔
-
3.2登录
-
数据验证
-
a)手机号非空，11位数字✔
-
b)密码非空✔
-
c)验证失败，相应输入框变红✔
-
登录
-
a)登录功能可用✔
-
b)登录成功后，如果在首页，首页的明日之星列表需要刷新数据✔
-
c)登录不成功，显示错误✔
-
点击立即注册，关闭登录弹窗，弹出注册弹窗✔
-
点击关闭图标，弹窗关闭✔
-
3.3注册
-
级联选择器可用
-
a)地区数据正确✔
-
b)生日数据，大小月30/31日，闰年2月29日数据正确✔
-
验证码
-
a)验证码显示正确✔
-
b)点击验证码更新✔
-
表单验证
-
a)手机号非空，11位数字✔
-
b)昵称中文英文数字均可，至少8个字符✔
-
c)密码长度6-16位字符✔
-
d)验证失败，相应输入框变红✔
-
注册
-
a)注册功能可用✔
-
b)注册成功关闭注册弹窗，打开登录弹窗✔
-
c)注册不成功，显示错误✔
-
3.4我的作品
-
年龄、星座、城市名计算正确。✔
-
作品列表加载正常，加载列表期间要显示loading图标，没有作品时有文案提示。✔
-
分页功能正常可用。分页的具体逻辑请参见《我的作品-分页》课程的讲解。✔
-
3.5上传作品
-
表单元素行为正常：
-
a)作品分类按钮组状态互斥 ✔
-
b)权限设置按钮组状态互斥✔
-
c)作品授权的模拟下拉菜单✔
-
图片上传功能可用：
-
a)图片可以批量上传✔
-
b)上传过程中要有表示整体进度的进度条✔
-
c)上传完后可以即时预览✔
-
d)单张图片的大小小于1MB✔
-
e)每次最多选择10张图片，超过10张要有弹窗提示✔
-
f)设置封面功能正常✔
-
g)开始上传后，上传按钮变为不可点击，视觉上表显为灰色✔
-
标签组件功能可用：
-
a)加载系统推荐标签✔
-
b)标签可删除 ✔
-
c)标签可添加 ✔
-
表单可正常提交
-
a)不丢失任何数据信息✔
-
b)提交前需要检查作品名称是否为空✔
有些状态视觉稿并没有给出，可以适当地自由发挥，没把握的同学可以参考视频教程《创建作品-文件上传》中的效果演示。如果自己实现的效果不忍直视，则会扣掉相应的分数。
正确还原视觉效果，正确测量大小宽高距离位置等数值，文字边框背景等颜色能正确取色。
按照效果图和上面的功能点完成所有功能。
必须要兼容的浏览器：Chrome。其他现代浏览器也要基本支持，比如Firefox、Safari等。IE 浏览器只要在高版本中可用即可，比如使用 Ajax 异步上传文件，如果浏览器本身不支持这个特性，则不做要求。
- HTML代码要求：完善的头部信息，代码缩进，正确使用语义化标签及实体，考虑SEO需要，正确嵌套标签，正确使用标签属性，规范的注释格式。
- CSS代码要求：CSS文件内部规范化分类，命名和格式规范化，注释清晰，合理优化代码。
- JS代码要求：
- a)不得使用任何JS框架，比如不能使用 jQuery等
- b)可以使用模板引擎库，比如 handlebars.js 等
- c)要求有统一的编码规范
- d)要求整洁、紧凑、可读性好
- e)要求注释完整
- f)不得将第三方库代码（比如md5.js）放置到自己的业务代码中，这会额外扣分。
- 代码要考虑简洁性、通用性、扩展性、可读性、可维护性。