Medium Clone Website ✨

A full-stack Medium clone featuring a robust backend. The frontend is powered by Vite, React, TypeScript, and Tailwind CSS, integrating Zod for input validation to ensure data integrity. This project includes features like user authentication (sign up, sign in) and a blog section. 📝

Features 🚀

• Sign Up: Users can create an account to join the platform. 🔑
• Sign In: Existing users can sign in to their accounts. 🔓
• Blog: Users can create and publish blog posts. ✍️
• Input Validation: Zod ensures the integrity of user input. ✔️
• Responsive Design: The app is fully responsive and looks great on all devices. 📱💻

Technologies Used 🛠️

• Frontend:

  • React.js ⚛️
  • Tailwind CSS 🎨
  • Vite ⚡
  • TypeScript 🖥️
  • Zod for input validation 🧹

• Backend:

  • Hono (for backend API) 🌐
  • Prisma ORM (for database management) 🗄️
  • JWT (for user authentication) 🔐
  • Cloudflare (for performance and security) ☁️

• API Testing:

  • Postman API for testing endpoints 🧪

Getting Started 🚀

To run the project locally, follow these steps:

1. Clone the Repository 📥

git clone https://github.com/haniyakonain/medium-clone.git

2. Install Dependencies 📦

In the project directory, run:

npm install

3. Set up the Backend ⚙️

Ensure you have the proper environment variables set up. You will need to configure the database and JWT secret keys for the backend.

cp .env.example .env
# Edit the .env file and add your database connection details and JWT secrets.

4. Run the Project 🚀

To start the development server:

npm run dev

The frontend will be available at http://localhost:3000 and the backend API at http://localhost:4000.

Endpoints 🔌

Here are some key API endpoints:

• POST /api/auth/signup: Sign up a new user 🔑
• POST /api/auth/signin: Sign in an existing user 🔓
• POST /api/blog: Create a new blog post ✍️
• GET /api/blog: Get all blog posts 📑
• GET /api/blog/{id}: Get a specific blog post 📝

Use Postman to test these API endpoints.

Cloudflare Integration ☁️

This project is deployed and protected via Cloudflare for better performance and security. 🚀

Database 🗄️

The project uses Prisma ORM to manage the database schema and migrations. The database is configured in the .env file, and Prisma migrations can be run with:

npx prisma migrate dev

Authentication 🔐

JWT is used for securing user authentication. Upon successful sign-in, a JWT token is issued, which should be included in the Authorization header for protected API routes.

Contributing 🤝

Feel free to fork the repository, make changes, and open pull requests. Contributions are welcome! ✨

License 📜

This project is licensed under the MIT License - see the LICENSE file for details. ⚖️