mrkezii / modir

Modite Directory

Modite Directory

Modite Directory brings distributed teams at Modus closer together with clever data patterns. Uses 3rd party API services from Slack, Harvest, Google Suite, GitHub, HeyTaco, etc.

Modite Directory uses:

• Ionic 4
• React
• Cloudflare Workers
• Workers KV store
• Cloudflare Access

Developing

Use Docker

The benefit of Docker is that the specific versions of node_modules and Node JS required to build/run this can be encapsulated within a Docker container rather than having to have those versions of software installed on your workstation.

NOTES

1. Node version 12 seems to be required for node-sass to work.

Shell scripts

The Dockerfile is used to build a Docker image that has no node_modules/ directory.

There are 4 .sh (shell) scripts to make using Docker easy:

docker-build.sh

The docker-build.sh script uses the Dockerfile to create an image, then mounts a named volume over node_modules and does the npm install into that volume.

You use npm/yarn to add modules to package.json on the workstation. When you run the docker-build.sh script, your local node_modules/ will be removed (since it's not needed by the container).

This script might be slow the first time you run it, but should be quite fast each successive time - as long as the node_modules in the named container are preserved.

docker-debug.sh

The docker-debug.sh script uses an image built with docker-build.sh and runs it (not as a deamon) so you can see any outoput from the program run via npm start within the container. The working dir ($PWD) is mounted at /home/app where the app is run. This allows you to edit files on your workstation and the changes take effect as if the code were running natively on the workstation. The named volume is mounted on /home/app/node_modules so they are available.

You can change the port the server listens on by editing this file.

docker-prod-build.sh

This script does an npm build within the container but generates its output files in the build/ directory on the host so you can use them accordingly.

docker-clean.sh

This script cleans up the Docker files for this project (removes them), including the named volume and the Docker image.

Typical workflow:

1. ./docker-build.sh (to build the container and node_modules volume)
2. ./docker-debug.sh (to run the container so you can edit and debug)
3. ./docker-prod-build.sh (eventually, to make a production build/ set of files)

Without Docker

In the project directory, you can run:

npm start

Runs the app in the development mode.
Open http://localhost:3000 to view it in the browser.

The page will reload if you make edits.
You will also see any lint errors in the console.

npm test

Launches the test runner in the interactive watch mode.
See the section about running tests for more information.

npm run build

Builds the app for production to the build folder.
It correctly bundles React in production mode and optimizes the build for the best performance.

The build is minified and the filenames include the hashes.
Your app is ready to be deployed!

Modus Create

Modus Create is a digital product consultancy. We use a distributed team of the best talent in the world to offer a full suite of digital product design-build services; ranging from consumer facing apps, to digital migration, to agile development training, and business transformation.

This project is part of Modus Labs.