/medium-clone

This is a feature-rich Medium clone offering blog creation, search, user profiles, blog management dashboard, analytics, interaction features (likes/comments), and responsive design for optimal viewing on all devices.

Primary LanguageJavaScript

Medium Clone

Description

This is a full-fledged Medium clone developed extensively using React, Node.js, Express, MongoDB, and Redux Toolkit. It offers a modern blog editor, Google authentication, dynamic blog pages, search functionality, user profiles with social links, a dashboard for managing blogs, blog post analytics, interaction features like likes and comments, notifications, and more. The website is designed to be responsive, providing an optimal viewing experience across all screen sizes.

Live Link

Features

  • Modern Blog Editor: Utilizes Editor JS for a seamless writing experience.
  • Google Authentication: Provides secure login for users.
  • Dynamic Blog Pages: Blogs are dynamically generated and accessible via unique URLs.
  • Search Page: Allows users to search for blogs and other users.
  • User Profiles: Dedicated profiles for users, showcasing their social links and written blogs.
  • Dashboard: A centralized dashboard for managing published and draft blogs.
  • Blog Post Analytics: Detailed analytics for each blog post, editable and deletable.
  • Interactions: Users can like blogs and comment on them.
  • Notifications: Tracks interactions and displays recent notifications for users.
  • Profile Editing: Users can edit their profiles, update social links, bio, and username.
  • Password Change: Allows users to change login passwords from settings.
  • Mobile Responsive: Features a responsive design with modern aesthetics and fade-in animations.

Technologies Used

  • Frontend: React, Redux Toolkit - Utilized for building the user interface and managing state efficiently.
  • Backend: Node.js, Express - Powering the server-side logic and handling API requests.
  • Database: MongoDB - Used as the database management system for storing and retrieving data.
  • Authentication: Google Authentication - Implemented for secure user authentication using Google accounts.
  • Other: Editor JS - Integrated for providing a modern and customizable blog editor experience.

Preview

  • Landing Page medium-ss (5)

  • Blog Page medium-ss (11)

  • Login Page medium-ss (6)

  • Blog Creation medium-ss (4)

  • User Profile Page medium-ss (3)

  • Dashboard Page medium-ss (10) medium-ss (9)

  • Profile Setting Page medium-ss (2)

  • Password Change Page medium-ss (1)

  • Dark Mode medium-ss (7)