关郁达 计算机应用技术·大一实践学期

项目简介：

本项目是一个仿豆瓣移动端网页，由多个 HTML 页面组成，包括首页、书影音、小组、市集、个人中心和登入注册页。首页展示用户动态，有时间更新、搜索、点赞和评论弹窗等功能；书影音页提供电影、电视剧、读书、音乐和同城演出信息；小组页可查找和加入小组，查看讨论精选；市集页展示商品并支持显示更多；个人中心可查看资料、创建书影音 TOP10 等；登入注册页用于用户登录和注册。整体通过 HTML、CSS 和 JavaScript 实现，页面交互丰富，风格简洁易用。

主要技术：

本项目采用Tailwind CSS v3原子化框架构建界面，结合Font Awesome图标库与原生JavaScript实现交互逻辑，打造仿豆瓣多功能网页应用。通过Swiper.js实现书影音模块的多页面滑动切换，运用CSS过渡与JavaScript事件监听完成点赞动画、评论模态框等动态效果。采用响应式设计原则，利用Tailwind的md:/lg:等前缀类适配移动端与桌面端布局，确保视觉一致性。代码组织遵循模块化与组件化思想，结合BEM命名规范提升可维护性，通过图片懒加载、CSS类复用等优化策略提升性能。项目成功复现豆瓣核心功能，包括首页动态流、书影音内容浏览、市集商品展示、小组讨论及个人中心管理等模块，为后续扩展服务端渲染或状态管理奠定基础。

图1 登录

图2 集市

图3 书影音