黑马头条移动端

# 项目介绍

随着智能手机的普及，人们更加习惯于通过手机来看新闻。由于生活节奏的加快，很多人只能利用碎片时间来获取信息，因此，对于移动资讯客户端的需求也越来越高。黑马头条项目正是在这样背景下开发出来。本项目主要着手于获取最新最热新闻资讯，通过大数据分析用户喜好精确推送咨询新闻。

cover.png

# 项目概述

做什么？

开发一个类似于手机今日头条、网易新闻的移动端新闻资讯类移动应用。
1

有哪些业务？

本项目涵盖了新闻资讯类 App 的重点核心功能，其中包括：用户登录 / 注册、文章列表、文章详情、文章评论、个人资料、用户中心、频道管理、文章搜索、用户收藏 / 历史 / 作品，以及机器人聊天等功能。
1

用的什么技术栈？

本项目采用完全前后端分离的开发模式，使用 Vue.js 技术栈（全家桶）构建的移动端 SPA 单页面应用程序。
1

本项目是 Vue.js 框架课程的进阶项目，项目选用目前国内最流行的前端框架：Vue.js，课程总天数：10 天，业务模块：11 个，后台接口：50+，本项目是我们就业支撑的重要课程之一，适合有 Vue 或 MVVM 框架使用经验的同学学习。

# 案例演示

  • 演示地址：http://hwss.gitee.io/heima_toutiao_prview/#/

  • 测试账号：

    • 用户名：17342065909
    • 密码：246810

# 业务功能

本项目的目标是完成一个新闻资讯类 App 的核心功能，但项目中所覆盖的核心业务却非常具有普适性，在众多 App 中都有体现，诸如：

  • 基于 Token 的验证方案处理用户登录

  • 移动端表单验证方案及交互提示

  • 短信验证码的发送与验证

  • 用户中心、个人资料展示

  • 对文章内容的收藏、点赞和分享

  • 编辑用户资料，其中包括基本信息修改及头像裁切上传等功能

  • 列表类页面的加载、缓存及优化

  • 列表类页面的下拉刷新和上拉加载更多

  • 资讯类文章详情展示和文章评论

  • 完整的搜索业务：输入联想建议、搜索关键词高亮、搜索历史记录、搜索结果列表等

经过实战级项目的学习与训练之后，相信无论是在面试还是实际工作，当你遇到以上业务的开发需求时，都能信心满满从容应对。

# 技术栈

黑马头条_技术架构图.png

本项目采用了以下项技术解决方案：

  1. 基于 Vue.js 的前端框架

  2. 基于 webpack 工程化开发解决方案

  3. 基于 Vant 的前端 UI 组件库，开发效率更高

  4. 基于 axios 的请求库，功能强大性能高效

  5. 基于 RESTful 风格的数据 API 解决方案（90% 的后端均采用这种风格提供数据 API，全栈级能力，升职加薪不在话下）

  6. 基于 JWT 的 Token 状态维持解决方案（能够让你强化更多服务器知识）

  7. 基于 Vue Router 的路由管理方案

  8. 基于 Vuex 的状态共享方案

  9. 基于 Vue CLI 的脚手架工具，快速创建项目快速开发

  10. 基于 Socket.IO 的实时通信解决方案

  11. 基于 PostCSS 的移动端 REM 适配解决方案

  12. 基于 DCloud 平台的移动 App 开发解决方案

以上技术能力是时下一线企业对每一位前端工程师的基准要求。不过由于前端技术的演化速度太快，现在仍有一些一线的前端工程师处在自学和探索阶段，自己找寻着这些技术的使用场景及最佳实践。

而我们的课程则是以项目的核心业务需求为驱动，以技术解决方案为支撑，不仅能让你在短时间内学会这些技术的使用，还能够应用这些技术解决一个有一个真实的企业级业务需求，为你的技能成长做好铺垫，也为你的求职就业助力。

# 课程大纲

模块
01-项目初始化
02-登录注册
03-个人中心
04-文章列表
05-频道编辑
06-文章搜索
07-文章详情
08-文章评论
09-编辑用户资料
10-功能优化