Skip to content

Latest commit

 

History

History
132 lines (103 loc) · 8.01 KB

README.md

File metadata and controls

132 lines (103 loc) · 8.01 KB
Raw

BlogVault

BlogVault - Create and Share Your Stories with BlogVault

Explore Your Passions and Build Your Audience on Our User-Friendly Blogging Platform

About 🎯

BlogVault is a blogging platform web app built using the MERN Stack using NextJS. On BlogVault, we can read other's blogs, write our own blogs, and save blogs for later reading. BlogVault uses the power of NextJS and ReactJS to provide blazing fast content and a great user experience. From Static Side Generation to ServerSide Rendering to API Routes, it's all there in BlogVault. BlogVault follows all Production practices and Security Measures, like email verification, image format checking, rate limiting, session invalidation and much more.

Try it out

You can try BlogVault by visiting: https://blogVault.vaibhavjaiswal.tech

And that's what BlogVault offers 🔥

Home Create Discover Search Saved

📸 Screenshots 🖥️

📸 Screenshots 📱

Technical details 💡

Frontend

  • BlogVault is created using NextJS, ReactJS and MaterialUI.
  • BlogVault's animations are created using Framer Motion.
  • BlogVault uses the power of NextJS ServerSide rendering to provide content blazing fast.
  • BlogVault uses the SWR to fetch client side data and cache, revalidate it for better performance.
  • BlogVault is highly responsive and looks great on all devices.
  • All the React components and package structure is properly organized.

Backend

  • BlogVault's Backend is created using NodeJS, ExpressJS, MongoDB and Redis.
  • BlogVault uses PassportJS for all authentication methods like Email-password and Social Sign-ins.
  • BlogVault's backend has the feature to upload images, and it also scales down the images for better storage and performance.
  • BlogVault's backend checks images for their type, so no one can upload other files with image extensions.
  • BlogVault uses Redis for caching and storing sessions.
  • BlogVault's backend is deployed on my own Server using Nginx.
  • BlogVault validates emails by sending verification emails using Nodemailer.
  • BlogVault's Rest APIs are protected using Rete Limiting, so its not possible to spam the APIs and cause a DDOS attack.

View the respective README files of frontend and backend for more details.

Tech Stack

Frontend

  • NextJs - Next.js enables you to create full-stack web applications by extending the latest React features, and integrating powerful Rust-based JavaScript tooling for the fastest builds.
  • React - The library for web and native user interfaces.
  • MaterialUI - MUI offers a comprehensive suite of UI tools to help you ship new features faster.
  • Framer Motion - A production-ready motion library for React.
  • Lottie - LottieFiles is a collection of animations designed for Lottie and Bodymovin.
  • ReactIcons - Include popular icons in your React projects easily with react-icons.
  • React Markdown - Markdown component for React.
  • React Hook Form - Performant, flexible and extensible forms with easy-to-use validation.
  • yup - Yup is a JavaScript schema builder for value parsing and validation.
  • Sass - Sass is the most mature, stable, and powerful professional grade CSS extension language in the world.
  • Axios - Promise based HTTP client for the browser and node.js.
  • SWR - SWR is a React Hooks library for remote data fetching.
  • Lodash - A modern JavaScript utility library delivering modularity, performance & extras.
  • Typescript - TypeScript is a strongly typed programming language that builds on JavaScript, giving you better tooling at any scale.

Backend

  • NodeJs - Node.js® is a JavaScript runtime built on Chrome's V8 JavaScript engine.
  • ExpressJs - Fast, un-opinionated, minimalist web framework for Node.js.
  • MongoDB - MongoDB is a general purpose, document-based, distributed database built for modern application developers and for the cloud era.
  • Redis - Redis is an open source (BSD licensed), in-memory data structure store, used as a database, cache, and message broker.
  • PassportJs - Passport is authentication middleware for Node.js. Extremely flexible and modular, Passport can be unobtrusively dropped in to any Express-based web application.
  • Nodemailer - Nodemailer is a module for Node.js applications to allow easy as cake email sending.
  • Multer - Multer is a node.js middleware for handling multipart/form-data, which is primarily used for uploading files.
  • Sharp - The typical use case for this high speed Node.js module is to convert large images in common formats to smaller, web-friendly JPEG, PNG, WebP and AVIF images of varying dimensions.
  • Bcrypt - A library to help you hash passwords.
  • Express Session - Simple session middleware for Express.
  • yup - Yup is a JavaScript schema builder for value parsing and validation.
  • Morgan - HTTP request logger middleware for node.js.
  • Http Errors - Create HTTP errors for Express, Koa, Connect, etc. with ease.
  • Lodash - A modern JavaScript utility library delivering modularity, performance & extras.

Project Setup ✏️

View the respective README files of Frontend and Backend to set up the project locally.

Contact

If you need any help, you can connect with me.

Visit:- Vaibhav Jaiswal