All Projects → Nealyang → React Express Blog Demo

Nealyang / React Express Blog Demo

🔥 React full stack+Express+Mongo implementation blog website tutorial 🌚

Programming Languages

javascript
184084 projects - #8 most used programming language

Projects that are alternatives of or similar to React Express Blog Demo

timeoff-server
TimeOff is an application that allows companies' employees to set vacations before they begin taking their time off. Implemented in modern tech stack i.e. Node, Express, MongoDB.
Stars: ✭ 33 (-98.22%)
Mutual labels:  redux-saga, mongoose
Node Express Mongoose Demo
A simple demo app using node and mongodb for beginners
Stars: ✭ 4,976 (+167.96%)
Mutual labels:  mongoose, demo
Fullstack Shopping Cart
MERN stack shopping cart, written in TypeScript
Stars: ✭ 82 (-95.58%)
Mutual labels:  mongoose, redux-saga
Write Music
visualise sentence length
Stars: ✭ 144 (-92.25%)
Mutual labels:  demo
Forest Express Mongoose
🌱 Express/Mongoose Liana for Forest Admin
Stars: ✭ 145 (-92.19%)
Mutual labels:  mongoose
Node Easy Notes App
A simple Note-Taking app built using Node.js, Express and Mongoose
Stars: ✭ 148 (-92.03%)
Mutual labels:  mongoose
Interactivelandscape
An exploration of an animated interactive landscape built with three.js.
Stars: ✭ 150 (-91.92%)
Mutual labels:  demo
Nest User Auth
A starter build for a back end which implements managing users with MongoDB, Mongoose, NestJS, Passport-JWT, and GraphQL.
Stars: ✭ 145 (-92.19%)
Mutual labels:  mongoose
Doc Scripts
React Document Build Tool Scripts , Like react-scripts of create react app
Stars: ✭ 149 (-91.98%)
Mutual labels:  demo
Pushvendor
Ruby on Rails POS (Point of Sale)
Stars: ✭ 147 (-92.08%)
Mutual labels:  demo
Nim pc demo
云信Windows(PC) C/C++ Demo源码仓库
Stars: ✭ 147 (-92.08%)
Mutual labels:  demo
Node Express Mongoose Passport Jwt Rest Api Auth
Node, express, mongoose, passport and JWT REST API authentication example
Stars: ✭ 146 (-92.14%)
Mutual labels:  mongoose
React Native Demo
React Native Voximplant Demo
Stars: ✭ 148 (-92.03%)
Mutual labels:  demo
Low Rank Bilinear Pooling
Fine-grained classification via second order statistics in a compact end-to-end trainable model
Stars: ✭ 145 (-92.19%)
Mutual labels:  demo
Mmtexturechat
AsyncDisplayKit(Texture) Smooth Scroll Chat Simulation for Whatsapp and iMessage
Stars: ✭ 149 (-91.98%)
Mutual labels:  demo
Gestureai Coreml Ios
Hand-gesture recognition on iOS app using CoreML
Stars: ✭ 145 (-92.19%)
Mutual labels:  demo
Cocos Creator Joystick
🕹 Cocos Creator Joystick Demo 虚拟摇杆
Stars: ✭ 148 (-92.03%)
Mutual labels:  demo
Demo Reactive Spring
Demo code for "Servlet and Reactive Stacks" talk
Stars: ✭ 147 (-92.08%)
Mutual labels:  demo
Iconfontsimagelist
Components to simplify use of "Icon fonts": resize, color, opacity and more... with full support for High-DPI apps. Rendering optimized with GDI+
Stars: ✭ 147 (-92.08%)
Mutual labels:  demo
Node Express Mongo Api
Starter project for a REST API with Node.js, Express & MongoDB 🔋
Stars: ✭ 148 (-92.03%)
Mutual labels:  mongoose

React技术栈+Express+Mongodb实现个人博客

该项目暂停维护,欢迎关注后续开源的个人网站

说明

放到开头,这里重点说明下,很多哥们会发邮件群里艾特,但是好多邮件回复不了不知道什么情况,群里有时候不怎么关注就错过了,大家如果有啥问题咱就直接提issue吧,后面朋友遇到相同问题大家也可以参考

微信公众号

img

扫码关注微信公众号,获取第一手文章推送

功能描述

前端部分

  • 文章列表展示
  • 文章分类
  • 登录管理
  • 权限管理
  • 文章详情页展示
  • 管理员文章管理
  • 管理员标签管理
  • 发文(支持MarkDown语法)

后端部分

  • mongoose数据库操作
  • 路由管理
  • 身份验证
  • 基本的增删改查
  • ...

技术栈

  • react
  • react-redux
  • react-router
  • redux-saga
  • babel
  • webpack
  • Express
  • Mongodb
  • Mongoose

TODO

  • 文章评论

项目运行效果

  • 首页 index

  • 非管理员登录

nealyanglogined

  • 管理员登录

adminLogined

  • 标签管理

amdinTag

  • 查看文章详情 detail

  • 发表文章 newArticle

  • 修改文章 modifiedArticle

项目介绍

当然这是一个全栈的开源demo,在此之前写过一个模仿大众点评的Demo,有兄弟反应说应该加点注释。 因为实在不想回头再麻烦,就想在这个demo中再加。

这个demo就是一个简单的增删改查的博客demo。前端用react技术栈、后端是express+mongoose。

项目实现步骤系列博客

  • [实战react技术栈+express前后端博客项目(0)-- 预热一波]
  • [实战react技术栈+express前后端博客项目(1)-- 整体项目结构搭建、state状态树设计]
  • [实战react技术栈+express前后端博客项目(2)-- 前端react-xxx、路由配置]
  • [实战react技术栈+express前后端博客项目(3)-- 后端路由、代理以及静态资源托管等其他配置说明]
  • [实战react技术栈+express前后端博客项目(4)-- 博客首页代码编写以及redux-saga组织]
  • [实战react技术栈+express前后端博客项目(5)-- 前后端实现登录功能]
  • [实战react技术栈+express前后端博客项目(6)-- 使用session实现免登陆+管理后台权限验证]
  • [实战react技术栈+express前后端博客项目(7)-- 前端管理界面用户查看功能+后端对应接口开发]
  • [实战react技术栈+express前后端博客项目(8)-- 前端管理界面标签管理功能+后端对应接口开发]
  • [实战react技术栈+express前后端博客项目(9)-- 前端管理界面发表文章功能+后端对应接口]
  • [开发实战react技术栈+express前后端博客项目(10)-- 前端文章列表、路由控制以及对应后端文章管理开发]
  • [实战react技术栈+express前后端博客项目(11)-- 前端文章管理部分完善(修改、预览功能)]
  • [实战react技术栈+express前后端博客项目(12)-- 博客添加评论功能以及对应后端实现]
  • [实战react技术栈+express前后端博客项目(13)-- pm2的使用说明]
  • [实战react技术栈+express前后端博客项目(14)-- 收工]

移步Nealyang/personalBlog

环境

node @7.9.0
db @3.4.0
...
别的就直接npm install 了

注意MongoDB初始化后需要初始化一个admin/admin账户,用于登录后台管理

运行

git clone [email protected]:Nealyang/React-Express-Blog-Demo.git

npm i

npm start

独立打包

npm run build

生产环境启动

npm run start-prod

开发数据库

链接: https://pan.baidu.com/s/1c3aedw8 密码: 5ii1

扫描上方二维码,回复【1】加我个人微信,入群

Note that the project description data, including the texts, logos, images, and/or trademarks, for each open source project belongs to its rightful owner. If you wish to add or remove any projects, please contact us at [email protected].