Skip to content

This is a fullstack blog application I built with MERN stack (mongoDB, Express, React and Node.js).

Notifications You must be signed in to change notification settings

Fransco35/mern-blog-app

Folders and files

NameName
Last commit message
Last commit date

Latest commit

 

History

64 Commits
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 

Repository files navigation

RiseBlog(mern-blog-app)

riseblog

This is a fullstack blog application built with MERN stack (mongoDB, Express, React and Node.js). Visitors are able to read articles posted on the blog and also signup or login to write articles. Only authenticated users are able to navigate to the Write page else they'll be redirected to the login page without authentication.Also there's a commenting feature that allows reader and authorized users to comment on articles Each article can be fully accessed dynamically when the 'Read more' button is clicked and pagination is enacted to render only 10 articles per page.

Features

Frontend

  • Page routing and dynamic page navigation using react-router-dom
  • Authentication state management using React Context
  • Pagination through custom hook
  • Data fetching and posting with fetch API
  • Side effects loading with useEffect and useCallback

Backend

  • Api endpoints and logic using express
  • Image/File handling using multer and cloudinary middleware
  • Authencation handling using passport, passport-jwt and passport-local-mongoose
  • Schema definition and chaining using mongoose
  • Data fetching and storage in mongoDB

Getting Started Locally

Run the following commands in your command line interface to get the project running in your local enviroment

  • git clone <repository https or ssh link>
  • npm i (to install server packages)
  • touch .env(to create a .env file and also paste you MONGO_URI, CLOUDINARY_NAME, CLOUDINARY_API_KEY, CLOUDINARY_API_SECRET and SECRET(for express sessions) details)
  • cd client
  • npm i (to install client packages)
  • cd .. (to go back to the root directory)
  • npm run dev (to startup the client and server concurrently )

=== That's it, Happy Coding ===

Releases

No releases published

Packages

No packages published