Dev.to Clone

This project is a clone of Dev.to, an open-source platform for developers to share articles, discuss topics, and build a community. The project consists of two main parts:

• Frontend: The user-facing interface of the platform, built with Next.js.
• Backend: The server-side logic, written in TypeScript, including APIs, database interactions, and business logic. Jest is used for testing the backend. The backend uses OAuth for authentication and SQLite as the database for storing data.

Deployment is handled using Docker, and the application is deployed to Vercel. Continuous Integration and Continuous Deployment (CI/CD) pipelines are implemented using GitHub Actions to automate the deployment process to Vercel.

Each part is a standalone application and runs independently. Below are the setup and usage instructions for both the frontend and backend.

---

Table of Contents

1. Frontend Setup
2. Backend Setup
3. Running the Applications
4. Deployment
5. Directory Structure
6. Contributing
7. License

---

Frontend Setup

Prerequisites

• Node.js (version 16 or higher)
• npm or yarn

Steps

1. Clone the repository:

   git clone https://github.com/your-repo/dev-to-clone.git

2. Navigate to the frontend directory:

   cd dev-to-clone/frontend

3. Install dependencies:

   npm install

   or

   yarn install

4. Start the development server:

   npm run dev

   or

   yarn dev

5. Open your browser and go to http://localhost:3000 to see the application in action.

Build for Production

To build the frontend for production, run:

npm run build

or

yarn build

The production-ready files will be in the .next directory.

---

Backend Setup

Prerequisites

• Node.js (version 16 or higher)
• npm
• SQLite

Steps

1. Navigate to the backend directory:

   cd dev-to-clone/backend

2. Install dependencies:

   npm install

3. Set up the environment variables:

   • Copy the .env.example file to .env:

     cp .env.example .env

   • Update the .env file with your database credentials, OAuth configurations, and other settings.

4. Initialize the database:

   npm run migrate

5. Run the tests:

   npm run test

6. Start the development server:

   npm run start

7. The backend server will run on http://localhost:4000 by default.

---

Running the Applications

To run the full application:

1. Start the backend server following the instructions above.
2. Start the frontend server following the instructions above.
3. Ensure the frontend is configured to communicate with the backend API (update the API base URL in the frontend .env or configuration file if necessary).
4. Postman testing in Dev-to Clone

---

Deployment

Prerequisites

• Docker
• Vercel CLI (optional for local deployments)

Steps

1. Build Docker images for the frontend and backend:

   docker build -t frontend ./frontend
   docker build -t backend ./backend

2. Push the Docker images to your container registry (e.g., Docker Hub or a private registry).
3. Configure Vercel to pull and deploy the Docker images.
4. CI/CD pipelines are set up using GitHub Actions. Every push to the main branch triggers automated tests and deploys the latest version to Vercel.

For more details on setting up the CI/CD workflow, check the .github/workflows directory in the repository.

---

Directory Structure

/dev-to-clone
|-- frontend/         # Frontend application (Next.js)
|-- backend/          # Backend application (TypeScript with OAuth and SQLite)
|-- Dockerfile/       # Store Dockerfiles for backend/frontend deployment
|-- .github/          # GitHub Actions CI/CD workflows
|-- README.md         # Project documentation

---

Contributing

We welcome contributions! To contribute:

1. Fork the repository.
2. Create a new branch:

   git checkout -b feature-name

3. Make your changes and commit them:

   git commit -m "Description of changes"

4. Push your changes:

   git push origin feature-name

5. Submit a pull request.

---

License

This project is licensed under the MIT License. See the LICENSE file for details.