our-app-stack-rules

What we use in our stack and what rules do we like to live by when developing our code

Our stack

Server side

setup

All projects are run within a docker container. All projects contain a Dockerfile and are build via pipelines of bitbucket and stored in our own docker registery. All projects are orchestrated with a docker stack file and managed by portainer. Whenever a bitbucket pipeline is done it triggers a webhook of portainer to download the latest image from the registery and redeploy the latest version Most of our projects have a reverse proxy service that take care of the https, compression and routing.

packages

• express
• compression
• http-proxy-middleware
• serve-favicon
• express-validator
• greenlock-express
• greenlock-store-fs
• @appsaloon/logger-js
• body-parser
• simple-oauth2
• got
• mysql
• cron
• mongodb
• mongoose
• bcrypt
• heartbeat-middleware

utility packages

• fs-extra
• date-fns
• lodash

tools

• Postman

Code style

Eslint standard

  npm i eslint eslint-config-standard eslint-plugin-import eslint-plugin-node eslint-plugin-promise --save-dev

Add eslintConfig to package.json

  "eslintConfig": {
    "extends": "standard"
  }

Frontend

packages

• create-react-app
• prop-type
• react-vis
• ky

Code style

Eslint standard

  npm i eslint eslint-config-standard eslint-plugin-node eslint-plugin-promise --save-dev

Add eslintConfig to package.json

"eslintConfig": {
    "extends": [
        "react-app",
        "standard"
    ]
  }

Our Rules

A set of guidelines that makes our lives easier.

Keep a Changelog

All repo's contain a CHANGELOG.md and are based on Keep a Changelog

Conventional commits

Commit messages follow conventionalcommits style.

Server

1. Start with the architecture of the server setup. Always start with the proxy. Adding it later is more difficult
2. Design your api in Postman and create tests to verify your api works as expected. Share this with the team workspace. This will make debugging easier for the rest of the team. Create local and production environments and share these.
3. Start implementing the @appsaloon/logger-js from the start
4. Add Eslint "standard" style to every project
5. Add favicon to the proxy server

FrontEnd

1. Start with create-react-app
2. Implement the @appsaloon/logger-js from the start
3. https://facebook.github.io/create-react-app/docs/setting-up-your-editor (to talk about)

Dockerfile templates

dockerfiles

Pipelines templates

pipelines

Stackfiles templates

stackfiles

Testing in react

tests