JS原生管理系统介绍

一.需求分析

1.1页面的结构（样式）

于这个视频的项目来说，尽可能做到美观，干净，符合现代页面的设计规范，使用户感到舒服。

1.2页面的数据

能让用户正常的登录，能让页面随着用户操作实现相应的变化，能让数据传输到搭建的本地接口

1.3页面的功能

使功能在正常运作的同时让用户感到便捷，好用。

二.核心功能

• 一个简单的搜索引擎，用来查找新闻
• 一个登录系统
• 一个新闻和用户管理界面
• 一个用户的注册功能，编辑和删除
• 一个新闻编辑和上传功能

2.1页面的登录

2.2用户的创建和保存、删除

• 首页
  
  

2.3新闻的创建和保存、删除

2.4一个简单的搜索引擎（模糊查询）

三.实现技术

3.1前端基础

html，css，js这三项，通过使用html和css来构建页面的样式，通过js来实现页面的交互功能，使页面能“动起来”

3.2框架使用

主要用到bootstrap，用来直接构建一些页面的组件，极大的方便了代码的使用（使用很简单也很方便）

3.3本地数据接口的构建

主要用到node.js的json-server来构建环境，实现一个简单的本地环境接口进而实现后端账号的存储和登录等功能

四.项目总结

4.1 面对困难

有很多方面：

• 1.json-server环境的构建
  花费了大量时间才构建完成，对于node.js一点不懂
• 2.js的不熟悉
  对于js关于与后端的接口，ajax的不熟悉，fetch不熟悉，异步函数async和await的不熟悉等，都对代码的写入和读取造成了影响

4.2 后续规划

• 把之前没有听完的ES6过一遍，同时写一定的代码练习
• 对于js中不熟悉的地方都重新过一遍，特别是前后端交互部分
• 学好接下来的vue，以及将要学习的java基础
• 有空闲时间的话，学一些unity相关的知识，以及c#

4.3 整体总结

总体来说，这次的项目实践感受到了自己有很多不足的地方，要及时改正，对于js的很多地方还是不熟悉，要在增强学过知识的同时来学好新知识