Picals-Frontend-React

概述

Picals 是一个受Pixiv启发、由我本人自发创建与设计的一个插画收藏平台项目。它旨在为大家提供一个相较于Pixiv更方便、在国内浏览更快捷的找图、存图的方式，并且和论坛的功能相结合，营造和谐、舒适的国内插画讨论环境。

这个项目の起源

由于我是一个爱好动漫和插画的人，平时在各大的插画网站（如Pixiv）收藏了很多中意的画作。但是这样子仅仅只是将插画图片保存到电脑磁盘内部，我现在想要仿照Pixiv等插画网站，打造一个属于我自己的插画收藏空间，从而能够随时随地浏览到我自己的一些收藏，并且能够提供给他人进行访问，能够大概的知道我的品味如何。

除了这个个人的一些牢骚之外，我也实在感觉国内的插画平台几乎都是死气沉沉的没有一丝生气，并且对于没有渠道去获取插画的用户显得十分的不友好。我希望能够提供这么一个平台，虽然不知道后续的发展具体会如何，至少希望能够让大家的找图、存图的过程更加的顺利一点。

最后，也是我个人的一点私心——我的这个项目打算 从零开始100%手写出来 ，无论是在开发的角度还是产品的角度对这个项目进行全方位的审视与功能的完善、迭代与更新。 我相信这是一个比较重大的挑战，不过我也喜欢这些挑战，我喜欢写点乱七八糟的东西来提升自己www。

这个项目后续会怎么样

目前该项目的前端已经处于开发的状态。如果想了解目前的开发进度，可以访问仓库的PR部分进行查阅已完成的内容。感兴趣的同学也可以看一下目前在vercel上的部署效果：picals开发进度

后端的部分，目前已经将 数据库 以及 第一版接口 设计完毕，开始正式进行后端接口的编写。相关的详情可以点击下方的两个链接进行查看。

目前打算基于功能分析文档，画一个需求架构图，并分析需要在V0完成的部分。

该项目目前的设计文档包括但不限于：

• 项目概述（就是这个文档）
• 项目功能分析
• 项目 UI 原型设计
• 项目技术栈设计
• 项目数据库设计
• 项目接口文档
• 项目部署方案

其中，粗体的部分是第一版已经处理好的；最后的部署文档需要在本地正式开发完成后，再根据实际情况进行统筹设计并不断地进行调整，打算基于目前的技术栈设计去调研一些相对合理的部署方案。 最佳实践！！最佳实践！！最佳实践！！

项目的仓库地址

前端项目：https://github.com/nonhana/Picals-Frontend-React

后端项目：https://github.com/nonhana/Picals-Backend-Nest

联系/加入我们

我将这个文档写成README，也是想着能够吸引一些对于前后端开发比较感兴趣的、想要找一些项目来练手的同学来一起进行开发。 我个人还是比较希望这个项目能够成为一个对于大家有价值的开源项目的 ，大家能够在一个项目当中体会一下完整的前后端分离的开发流程及其架构的设计。

emmm，另外说一下，这个项目是 纯粹的兴趣驱动的作品 ，而且原本是打算 我一个人从零开始100%开发完成的 ，但是转念一想这个项目或许可以帮助到一些想要参加比较实际的项目开发的同学，因此我在这个文档的末尾加上这么一段。并且我相信大家集思广益的经验是最宝贵的，我也想在这个项目的开发中实现对整个项目前后端分离开发+项目部署的 最佳实践 。而且我自己也想和更多的人进行交流，可惜我本人是个社恐，并且在学校里面遇不到志同道合的人，只能把这个想法写到这里.......希望能被有缘人看到吧呜呜呜呜

这个项目主要的技术栈为 React+Nest.js ，都是目前相对比较流行的技术栈，具体的技术栈可以进入上方的仓库进行查看。

• 而之所以选择React而不是Vue，是因为我发现目前大多数入坑前端的同学都是侧重于Vue技术栈的学习，然而就国内的大环境而言React基本是前端人人必备的一项技能。 毕竟技多不压身嘛，会的多一点也是件好事。

• 并且后端采用了Node.js中的一款当下最流行也是相对最完善的企业级框架，我认为对这门框架的掌握不仅对TS这门语言本身会有新的认识，并且它本身的注入、装饰器、MVC架构搭配一些ORM工具等等的东西，其实让我有种 在TS中写Spring的感觉（这装饰器就是注解吧喂） ，能够对后端的逻辑有新的认识，也可以为自己将来拓展新的技术栈打下一个比较好的基础。

最后图穷匕见一下：如果您是无意间浏览到这个项目的，并且有兴趣参与这个项目，或者在目前的演示中发现 BUG、提出新的需求，或者想要单纯的了解我们、讨论交流，您都可以加入我们的哦！ 对于我而言，大家一起做东西，在交流中一起进步、一起了解更多的前沿技术或者是解决一些困难的bug，都是十分有意义的事情！ 下面给一下我的联系方式：

• 邮箱：zhouxiang757@gmail.com
• QQ：1209220829