BloggingCoder - MERN Stack APP

This is a multi-user blogging platform built with Node, React, Next.js, Express, and MongoDB.

<kbd> <img src="http://alexticovschi.com/portfolio/bloggingcoder.jpg" alt="portfolio" title="BloggingCoder"> </kbd> </br> </br>

Browse for blogs

<kbd> <img src="http://alexticovschi.com/portfolio/blogs-browsing.jpg" alt="portfolio" title="BloggingCoder"> </kbd> </br> </br>

Perform CRUD operations from admin dashboard.

<kbd> <img src="http://alexticovschi.com/portfolio/bloggingcoder-admin.jpg" alt="portfolio" title="BloggingCoder"> </kbd> </br> </br>

Publish your own blogs. Add image, categories and tags.

<kbd> <img src="http://alexticovschi.com/portfolio/bloggingcoder-crud.jpg" alt="portfolio" title="BloggingCoder"> </kbd> </br> </br>

Reset your password

<kbd> <img src="http://alexticovschi.com/portfolio/bloggingcoder-password-forgot.jpg" alt="portfolio" title="BloggingCoder"> </kbd> </br> </br>

Signup/Register to BloggingCoder

<kbd> <img src="http://alexticovschi.com/portfolio/bloggingcoder-signup.jpg" alt="portfolio" title="BloggingCoder"> </kbd> </br> </br>

Receive activation link by email to activate your account

<kbd> <img src="http://alexticovschi.com/portfolio/account-activation-link.jpg" alt="portfolio" title="BloggingCoder"> </kbd> </br> </br>

Activate your account

<kbd> <img src="http://alexticovschi.com/portfolio/activate-account.jpg" alt="portfolio" title="BloggingCoder"> </kbd> </br> </br>

Update your own profile

<kbd> <img src="http://alexticovschi.com/portfolio/bloggingcoder-update-profile.jpg" alt="portfolio" title="BloggingCoder"> </kbd> </br> </br>

Send emails to admin

<kbd> <img src="http://alexticovschi.com/portfolio/contact.jpg" alt="portfolio" title="BloggingCoder"> </kbd> </br>

Project Description

• User Signup / Signin
• JWT based Authentication System
• Account Activation on User Signup
• Role Based Authorization System
• Perform CRUD (Create, Read, Edit or Remove Blogs) Operations from Admin Dasboard or User Dasboard
• Admin can Add or Remove 'categories' and 'tags'
• Advanced CRUD with Image Upload
• Ability to Search for Blogs and Load more Blogs
• SEO - Search Engine Optimization
• API Development with Node Express and MongoDB
• SSR provided by Next.js
• Blog Author Private Contact Form
• Multiple User Authorization System
• Sendgrid for Sending Emails
• Forgot Password / Reset Password
• Social Login with Google
• DISQUS Commenting System
• Deployed on DigitalOcean

Tools Used

• React - The front end is powered by React for state management and dynamic rendering.
• Next.js - for SSR (server-side rendering), statically generated pages and SEO.
• Node.js and Express.js - for building the server and interacting with the database.
• MongoDB - a schema-less NoSQL database.
• Mongooose - the object document modeling (ODM) layer that sits on top of Node's MongoDB driver.
• DigitalOcean - as the deployment platform of choice.

Demo

• View Project