Closed huanghanzhilian closed 7 months ago
这是来自QQ邮箱的假期自动回复邮件。 您好,您的邮件我已收到。
收到
评论了一大堆,然后写完了,提交,才告诉我没登录,而且提交弹框也关闭了,这个体验非常不好
评论了一大堆,然后写完了,提交,才告诉我没登录,而且提交弹框也关闭了,这个体验非常不好
好的老师,我尽快修改
是个挺不错的学习项目,值得鼓励。不过并不建议在 weekly 打广告:
因此先关闭该 issue。
评论了一大堆,然后写完了,提交,才告诉我没登录,而且提交弹框也关闭了,这个体验非常不好
已经修改了老师
是个挺不错的学习项目,值得鼓励。不过并不建议在 weekly 打广告:
- 开了这个口子,大家都会倾向过来广告,最后 weekly 会变成没有重点的大杂烩。
- 如果要打广告,我希望是一种更底层的技术思维,并加以详细描述,比如从 nextjs14 里介绍一些好用的代码设计模式,或者就 docker 的使用做一些深入介绍。
因此先关闭该 issue。
谢谢老师,不该把项目介绍之间拿来,抱歉老师
老师您好,这是我第一次开源项目,有很多不足,但是是我花了晚上休息的时间,精心打磨的,希望自己能有高质量的输出,也希望能帮助到更多的人。
嗨,大家好!欢迎来到C-Shopping,这是一场揭开科技面纱的电商之旅。我是C-Shopping开源作者“继小鹏”,今天将为你介绍一款基于最新技术的开源电商平台。让我们一同探索吧!
项目在线演示地址:
项目传送门:https://github.com/huanghanzhilian/c-shopping
如果你觉得有帮助,请给我一个Star,这会给我更大的鼓励。
项目背景
背景:
意图:
改进背景中提到的问题。
目的:
打造一个完整的,适合web端的良好生态。
首先,让我们了解一下C-Shopping的技术背后。我采用了一系列最前沿的技术,包括Next.js、Tailwind CSS、Headless UI、Redux-Toolkit-RTK Query、JWT和Docker等。这确保了此项目不仅高效,而且具备强大的可扩展性。我们致力于解决传统电商平台的一些痛点:不美观、不适配不同设备、界面单一,等等。C-Shopping通过采用最新的技术和设计理念,为用户打造了一场全响应式技术开发体验。
C-Shopping关注用户体验。我们的界面不仅仅美观,更是响应式设计,让用户可以在任何设备上轻松愉悦地购物。个人中心和订单管理功能也让你的购物更加个性化和方便。
项目亮点
C-Shopping的亮点之一是我们采用了一系列先进的技术,包括Next.js、Tailwind CSS、Headless UI、Redux-Toolkit-RTK Query等,为用户提供了极致的性能和体验。不仅注重美观,更追求技术上的卓越。
Next.js 驱动的极速体验
C-Shopping采用了 Next.js,这不仅意味着网页加载速度飞快,而且还支持服务端渲染,让你体验到前所未有的流畅度。
🎨 Tailwind CSS 的时尚设计
采用 Tailwind CSS,为 C-Shopping 注入了时尚感。每一次的界面都如同艺术品般精致,让购物成为一场视觉的盛宴。
🔧 Headless UI 自由而灵活
C-Shopping 选择了 Headless UI 风格,让用户可以在购物过程中拥有更多自由。不再受限于传统的UI框架,为你打开了更多定制的大门。
🔐 JWT 安全无忧
安全至上!采用 JWT 进行用户身份验证,为你的购物行为提供了最强有力的保障,让你可以放心尽情购物。
🐳 Docker 容器化的完美部署
C-Shopping 拥抱 Docker,使得项目的部署变得前所未有的简单。容器化技术让整个项目在不同环境中都能如鱼得水地运行。
🔄 Redux Toolkit 和 RTK Query 的状态管理艺术
C-Shopping 使用 Redux Toolkit 和 RTK Query,让状态管理变得更加轻松愉快。你可以更好地追踪应用中的数据流,确保购物体验的稳定性。
功能演示
现在,让我们来看看C-Shopping的一些基本功能。从清晰的导航和商品展示,到方便的搜索和购物车功能,每一个细节都经过精心设计,为用户提供愉悦的购物体验。
用户端
管理端
项目结构
🏗️ C-Shopping 项目结构:
主要结构解释:
📁 app: 应用程序的主要代码
📁 components: 可复用的 React 组件
📁 helpers: 辅助函数和工具
📁 hooks: 自定义 React hooks
📁 models: 数据模型定义
📁 public: 静态资源,如图片、字体等
📁 store: Redux 状态管理相关配置
📁 styles: 样式文件
📁 utils: 通用工具
...
这个结构旨在使项目组织有序,易于维护和扩展。每个部分都按照功能和职责进行划分,使团队成员更容易理解和协作。
部署与使用
开发环境
通过在终端运行以下命令克隆或下载存储库:
使用npm或yarn安装项目依赖项:
or
修改.env的文件,在项目根目录,定义所需的环境变量。这个步骤是重要的(图片上传OSS):
docker 部署
项目根目录已经配置好docker compose,在安装docker环境后,直接运行部署
公众号
关注公众号获得更多资讯,有任何意见或建议都欢迎提issue,或者到公众号。
许可证
Apache License 2.0
MIT License
Copyright (c) 2024 Jipeng Huang
呼吁行动
C-Shopping是一个开源项目,欢迎更多的开发者加入我们的社区。你可以在我们的GitHub仓库中找到项目源码,提出建议或者一同参与开发。
如果你对项目感兴趣,欢迎加入我们的社区,一同为项目添砖加瓦。