You will need PNPM, Caddy, NodeJS, Docker and Docker Compose installed.
I'm building this project to learn more about some technologies I'm interested in. Nest, MongoDB, Monorepos and Caddy are some of them.
warning: This is not a real project, so I'm not sure if I'll finish it. In the current moment this is just a playground, full of bugs and bad practices.
Run the following commands in the root directory of the project.
- Run docker-compose
docker-compose up -d
- Install dependencies
pnpm install
- Run the project in development mode
pnpm dev
- Run Caddy server
caddy start
- Access the project at https://socially-awkward.localhost/
graph LR;
A[APP] --> B[https://socially-awkward.localhost]
B -- /api* --> D[API] --> E[http://localhost:3000];
B -- /* --> C[WEB] --> F[http://localhost:5173];
Caddy does a reverse proxy to the apps.
Every request that hits the /api/*
path is redirected to the API app.
Every other request is redirected to the web app.
- In another terminal, run the following command to watch the logs from mongo
docker logs socially-awkward-mongo
- If you want to bash into the mongo container
docker exec -it socially-awkward-mongo bash
- You can try the
mongodb.mongodb-vscode
VSCODE extension too
This is a monorepo built with PNPM and Turbo.
For the API, I'm trying out NestJS and MongoDB.
I'm using Docker with Docker Compose to run the DB.
For the web app, I'm using Vite with React. The routing is handled by React Router and the data fetching is done with React Query.
The styling is done with TailwindCSS (I've been learning it for a while now and I'm really enjoying it).
Caddy is used as a reverse proxy to the apps. Thanks to it, I can use HTTPS locally and solve some cookies issues.
You can find the documentation on the API README.
You can use the awkward-client to interact with the API.
import { AwkwardClient } from 'awkward-client';
const apiClient = new AwkwardClient('https://socially-awkward.localhost/api');
There are a lot of things todo and this is not a real project, so I'm not sure if I'll finish it.
- Finish the frontend
- Guarantee that the user can only delete its own posts and comments
- Add a way to upload images
- Add pagination to the posts and comments