MERN DEV Clone Website - Frontend

Contents

• Brief description
• Language and Tools
• Project details
• Images

Brief description

• This is DEV Clone Website built with MERN stack. (The official website of DEV: https://dev.to/ )
• Project link (GitHub): Backend side and Frontend side
• Project's author: Pham Gia Phuc - Acus
• Personal profile: MyProfile

Language and Tools

• Backend

• Frontend

• Other tools:

Project details

A DEV clone website with some main features:

1. Authentication and Authorization

• Sign in and up with email and password
• Sign in with Google authentication (Firebase authentication)
• Verfied account with a code sent to the user's email by Google email
• Access and refresh token (OAuth2 authorization framework)
• Authorized user by roles: user and admin
• Sign out logic

2. User

• Update profile page: User's information and images (Firebase storage)
• Display profile page with user's information and blogs
• Reset user's password
• Create post/blog page
• Dashboard page with user's post and relevant infos

3. Blog

• Editor page
• Preview page
• Blog page

4. Others

• Home page
• Search page
• Info page
• Not found page

Images

1. Authentication and Authorization

• Sign in and up with email and password; with Google authentication

• Verfied account with a code sent to the user's email by Google email

2. User

• Update profile page: User's information and images (Firebase storage)

• Display profile page with user's information and blogs

• Reset user's password

• Dashboard page with user's post and relevant infos

3. Blog

• Editor page

• Preview page

• Blog page

4. Others

• Home page

Cookie configs

res.cookie('refreshToken', refreshToken, {
  httpOnly: false,
  secure: true,
  path: '/',
  sameSite: 'None', // Set to None for cross-site contexts
  maxAge: +REFRESH_COOKIE_LIFE * 1000, // 1 day
});