53

首页

前言

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

此项目是基于 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 前台展示

效果图:

  • 移动端适配

mobile.gif

  • pc 端

首页

标签分类文章

留言

时间轴

登录

注册

文章详情-1

文章详情-2

文章详情-3

点赞与评论

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

1.2 管理后台

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

登录

用户

文章

文章添加

留言

留言回复

链接

时间轴

时间轴添加

标签

分类

2. 体验地址

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

本博客系统的系列文章:

最后

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

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

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

全栈修炼


如果觉得我的文章对你有用,请随意赞赏

你可能感兴趣的

11 条评论
AMCode · 2018-11-22

期待大佬针对这个项目的完整教程,作为菜鸟的我要学习一下

回复

0

严重了,严重了,我也只是个菜鸟啦,教程应该会在一周内陆续推出哈。

夜尽天明 作者 · 2018-11-22
萌新小白rai · 2018-11-22

文章的样式排版是怎样实现的,是md么?

回复

0

用了开源的 marked 的 markdown 渲染,还加了些手写的样式。

夜尽天明 作者 · 2018-11-22
借个微笑丶sa · 2018-11-22

楼主精神还是值得表扬的~虽然我的用的Ghost,提个建议,网站考虑下把移动端适配咯~

回复

0

谢谢你的建议;我也想过用Ghost,不过自己动手可以学到很多知识,所以选择了自己搭建,移动端的适配会在后面做的。

夜尽天明 作者 · 2018-11-22
kunki孫 · 2018-11-22

你好 很高兴看到你分享的文章 但我在blog-node这个项目下 使用npm start 启动报错,数据库连接失败。还有启动blog-react项目,请求接口没拿到数据 是不是因为blog-node启动报错导致的呢

回复

0

都报错了,肯定接口请求不成功的啊,是不是报 数据库连接失败 ?如果是的话,因为是要安装了 mongodb 数据库才可以连接成功的 。

夜尽天明 作者 · 2018-11-22
0

你好 我mongdb安装成功了 但尝试一下npm start 还是报 数据库连接失败的错误

kunki孫 · 2018-11-22
0

@kunki孫 你装完之后是设置了要输入账号密码才能连接吧,连接数据库的程序不用密码的,或者你开的端口不对吧

夜尽天明 作者 · 2018-11-22
weijie · 2018-11-24

好巧啊,我的博客和你的好像呀,刚在前端开发博客看到的,表示来蹭流量的, (^▽^)
iweijie.cn

回复

载入中...