DEV Community

Cover image for Stack shopping and repo setup
Caio Campos Borges Rosa
Caio Campos Borges Rosa

Posted on

Stack shopping and repo setup

In the last article, we discussed the vision for the product and outlined its basic functionalities to guide development. In this article, I will delve into the first steps and fundamental tasks required, as well as showcase our basic development environment.

Chores

A couple of things to consider when building a company are tax-related matters, legislation, IP registration, and domain purchase. I have already taken care of most of these aspects, but I won't focus on that here since they can vary significantly depending on your location. The truth is, you need a lot less than you might imagine to start, so the key is to focus on getting started and figure out the more tedious parts later.

Stack Shopping

You are a new company, you have no friends, you need to move fast and alone(not me because i have you guys), it's essential to move quickly and independently. For the MVP, prioritize the stack that allows you to move faster, as long as it meets the minimum functionality requirements and the available tools are sufficient. Speed should always be the determining factor to break any ties in your decision-making process.

The main part of our product will consist of one simple API and one simple web app. Given the constraint of having limited staff, our priority is to keep the development process concise and facilitate Developer Experience (DX), testing, and iteration. For these reasons, I have decided to use TypeScript for both the API and the app since it is the stack I work with daily and allows for seamless context switching without compromising development experience. Additionally, we can utilize a monorepo to keep our platform organized, and this decision becomes even more evident when considering all the reasons I previously mentioned.

  • Code Cohesion
  • Simplified DX
  • Simplified Testing Environment
  • Type sharing
  • Resource Sharing

Monorepo

The primary objective is simplicity, so we've decided to use KoaJS as our API framework for the back-end. KoaJS is a lightweight and straightforward choice that simply works. This API will handle fundamental user and business logic. If we encounter scenarios that require more specialized functionalities, we can create new packages within the monorepo and import them here.


import Koa, { Request } from 'koa';
import Router from 'koa-router';
import bodyParser from 'koa-bodyparser';
import cors from '@koa/cors';


const app = new Koa();
const router = new Router();
1
  app.use(cors({ credentials: true }));
  app.use(bodyParser());
  app.use(router.routes());
  app.use(router.allowedMethods());

  //// healthcheck endpoint
  router.get('/', async (ctx: { path: string; body: string; }, next: () => any) => {
    if (ctx.path === '/') {
      ctx.body = 'lets map!';
      return;
    }
    await next();
  });

export default app;

Enter fullscreen mode Exit fullscreen mode

Regarding the web app, I've selected Next.js because of its simplicity and ease of deployment. It's straightforward and provides a smooth development experience.

DX

Currently, our development experience is kept simple. To run the project seamlessly in our local development environment, we will utilize TurboRepo and Docker. With just one command, we can have the project up and running smoothly.

To run with Turborepo just run:


pnpm run dev

Enter fullscreen mode Exit fullscreen mode

To run the project with docker, have docker and docker-composed installed and run:


docker-compose up -d

Enter fullscreen mode Exit fullscreen mode

Docker setup in a monorepo

In a monorepo, there are several ways to set up deployment depending on your specific requirements. For now, we'll opt for a simple approach: using one Docker container for each package. We will create a docker-compose file to coordinate these packages and ensure they communicate through a Docker network.

This setup allows us to manage and deploy each package independently while maintaining clear communication between them through the designated Docker network. As we progress, we can explore more complex deployment strategies, but for the initial stages, this straightforward method should suffice.


version: "3"

services:
  web:
    container_name: web
    build:
      context: .
      dockerfile: ./apps/web/Dockerfile
    restart: always
    ports:
      - 3000:3000
    networks:
      - app_network

  api:
    container_name: api
    build:
      context: .
      dockerfile: ./apps/api/Dockerfile
    restart: always
    ports:
      - 3001:3001
    networks:
      - app_network


networks:
  app_network:

Enter fullscreen mode Exit fullscreen mode

As we move forward, we'll have the opportunity to implement some exciting building blocks that will enhance our development process and productivity. With the right tools and approaches, we can accelerate our progress, making the development experience more enjoyable and efficient for everyone involved.

Next steps are:

  • Setting up DataBase
  • Basic Api Endpoints
  • Testing Environment
  • Basic CI

The repository for this project is at github

The repository is public, so you can check all the issues and pull requests to track the project's progress. Feel free to suggest or even make a contribution.

Find me on twitter for a good time and lets build something.

Photo by Mike Petrucci on Unsplash

Top comments (0)