charlesknapp / twitter-clone

A simple social media, twitter-like clone. Built with the full MERN-stack, you can use this to create your next social media application.

Twitly - Social Media Application

A simple social media, twitter-like clone.
Built with the full MERN-stack, you can use this to create your next social media application.

Entity Relationships

https://lucid.app/lucidchart/ca1b1f32-3556-4777-9d0c-c311466e1d4d/edit?viewport_loc=-45%2C-98%2C2401%2C1154%2C0_0&invitationId=inv_bc40d589-2094-4b22-a4a2-a88704e12c95

Client Dependencies

• react-redux (State management tool)
• @reduxjs/toolkit (Redux wrapper (easy redux usage)
• redux-persist (Save states to localStorage)
• react-dropzone (Handle files on front -> back end)
• dotenv (Enviornment variables)
• formik (Form handling)
• yup (Form Validation)
• tailwindcss (CSS styling convention)
• react-router-dom@6 (Handling routes/pages)
• @mui/material (UI base)
• @emotion/react (Emojicon Library)
• @emotion/styled (UI style variants)
• @mui/icons-material (UI base icons)

Server Dependencies

• Express (Main server library)
• Nodemon (Startup script functionality)
• Body Parser (Processing body content)
• BCrypt (Password encryption)
• CORS (Cross origin request handler)
• DotENV (Environment variables)
• GridFS Stream (File uploading)
• Multer (Form middleware)
• MulterFS Storage (Form file middleware)
• Helmet (Request content safety)
• Morgan (Logging information)
• JSONWebToken (Authentication)
• Mongoose (Database integration)