资讯专栏INFORMATION COLUMN

react + node + express + ant + mongodb 的简洁兼时尚的博客网站

fish / 2637人阅读

摘要:前言此项目是用于构建博客网站的,由三部分组成,包含前台展示管理后台和后端。体验地址网站主页网站首页管理后台计划这次是一个完整的全栈式开发,只要部署了这三个项目的代码,是完全可以搭建好博客网站的。

前言

此项目是用于构建博客网站的,由三部分组成,包含前台展示、管理后台和后端。

此项目是基于 react + node + express + ant + mongodb 的,项目已经开源,项目地址在 github 上,喜欢的,欢迎给个 star 。

项目地址:

前台展示: https://github.com/biaochenxuying/blog-react
管理后台:https://github.com/biaochenxuying/blog-react-admin
后端:https://github.com/biaochenxuying/blog-node
1. 效果图 1.1 前台展示

效果图:

移动端适配

pc 端

前台展示目前只支持 pc 端。

1.2 管理后台

管理后台是在蚂蚁金服用户开源的 ANT DESIGN PRO 基础上进行开发的。

2. 体验地址

网站主页: http://biaochenxuying.cn/main.html

网站首页:http://biaochenxuying.cn/

管理后台:https://preview.pro.ant.design/user/login

3. 计划

这次是一个完整的全栈式开发,只要部署了这三个项目的代码,是完全可以搭建好博客网站的。

作为一个后端的小白,在这次开发中,小汪也遇到了很多问题。

往后的时间里,我会就这三个项目,推出相应的三篇文章教程或者说明和踩到的坑,敬请期待。

4. 收获与感触

学而不用,基本等于没学,所以为了有 react 相关的技术栈的实战经验,所以用了 react ,而且后端技术 node.js 和 mongodb 也是这一个多月里现学现用的,所以项目中肯定还有很多我不知道的实用技巧,如果写的不好的地方,请大家指出。

网站前端部分如果用 vue 相关技术栈来完成的话,会更好更快,因为本人专长的是 vue 相关的技术栈。

因为最近一直在做自己的个人博客网站,所以好久没更新技术文章了;而且是利用业余时间做的,所以经过差不多两个月的搬砖,现在网站终于都上线了。

开发网站的这段时间里,每天晚上几乎都搬砖到接近 11 点,周末的时间大多也在搬砖,今晚写完这篇文章,也快 12 点了,搬砖不易啊,喜欢或者觉得不错的,欢迎到 github 上给个 star,谢谢。

5. 文档教程

项目地址:

前台展示: https://github.com/biaochenxuying/blog-react

管理后台:https://github.com/biaochenxuying/blog-react-admin

后端:https://github.com/biaochenxuying/blog-node

blog:https://github.com/biaochenxuying/blog

本博客系统的系列文章:

react + node + express + ant + mongodb 的简洁兼时尚的博客网站

react + Ant Design + 支持 markdown 的 blog-react 项目文档说明

基于 node + express + mongodb 的 blog-node 项目文档说明

服务器小白的我,是如何将node+mongodb项目部署在服务器上并进行性能优化的

最后

全栈修炼 有兴趣的朋友可以扫下方二维码关注我的公众号

我会不定期更新有价值的内容,长期运营。

关注公众号并回复 福利 可领取免费学习资料,福利详情请猛戳: Python、Java、Linux、Go、node、vue、react、javaScript

文章版权归作者所有,未经允许请勿转载,若此文章存在违规行为,您可以联系管理员删除。

转载请注明本文地址:https://www.ucloud.cn/yun/19436.html

相关文章

  • react + Ant Design blog-react-admin 项目项目文档说明

    摘要:前言此项目是基于蚂蚁金服开源的之上,用全家桶的进行再次开发的,项目已经开源,项目地址在上。项目地址开源不易,如果觉得该项目不错或者对你有所帮助,欢迎到上给个,谢谢。 showImg(https://segmentfault.com/img/remote/1460000017116745); 前言 此 blog-react-admin 项目是基于 蚂蚁金服开源的 ant design p...

    chavesgu 评论0 收藏0
  • 服务器小白我,是如何成功将 node+mongodb 项目部署在服务器上并进行性能优化

    摘要:前言本文讲解的是做为前端开发人员,对服务器的了解还是小白的我,是如何一步步将项目部署在阿里云的服务器上,并进行性能优化,达到页面秒内看到,秒内看到首屏内容的。搭建的项目是采用了主流的前后端分离思想的,这里只讲服务器环境搭建与性能优化。 showImg(https://segmentfault.com/img/remote/1460000017143281); 前言 本文讲解的是:做为前...

    zsy888 评论0 收藏0
  • Vue + TypeScript + Element 项目实践(简洁时尚博客网站)及踩坑记

    摘要:前言本文讲解如何在项目中使用来搭建并开发项目,并在此过程中踩过的坑。具有类型系统,且是的超集,在年势头迅猛,可谓遍地开花。年将会更加普及,能够熟练掌握,并使用开发过项目,将更加成为前端开发者的优势。 showImg(https://segmentfault.com/img/remote/1460000018720573); 前言 本文讲解如何在 Vue 项目中使用 TypeScript...

    luckyyulin 评论0 收藏0
  • 后端小白我,是如何成功搭建 express+mongodb 简洁博客网站后端

    摘要:前言是采用了主流的前后端分离思想的,主里只讲后端。项目是的进行开发的,项目已经开源,项目地址在上。路由接口主文件所有的路由接口文章各模块的列表都是用了分页的形式的。 showImg(https://segmentfault.com/img/remote/1460000017136149); 前言 blog-node 是采用了主流的前后端分离思想的,主里只讲 后端。 blog-node ...

    Kahn 评论0 收藏0
  • 前端学习资源汇总

    摘要:建立该仓库的目的主要是整理收集学习资源,统一管理,方便随时查找。目前整合的学习资源只是前端方向的,可能会存在漏缺比较好的资源,需要慢慢的完善它,欢迎在该上补充资源或者提供宝贵的建议。 说明 平时的学习资源都比较的凌乱,看到好的资源都是直接收藏在浏览器的收藏夹中,这样其实并不方便,整理在云笔记上,也不方便查看修改记录,索性就整理在 github 上并开源出来,希望帮助大家能够更快的找到需...

    SnaiLiu 评论0 收藏0

发表评论

0条评论

fish

|高级讲师

TA的文章

阅读更多
最新活动
阅读需要支付1元查看
<