A collaborative map tool inspired by etherpad
Find a file
suroh c76761d3c6
All checks were successful
Build & Push Image / build (push) Successful in 16m15s
Tests / test (push) Successful in 1m1s
Fix missing marker icons
2025-10-11 23:15:08 +02:00
.forgejo/workflows Update urls to github 2025-10-09 20:50:45 +02:00
backend Fix spelling and version 2025-10-08 15:23:06 +02:00
frontend Fix missing marker icons 2025-10-11 23:15:08 +02:00
.dockerignore
.env.template
.gitignore
biome.json
docker-compose.dev.yml Update port in docker compose 2025-10-09 19:37:18 +02:00
docker-compose.yml Update port in docker compose 2025-10-09 19:37:18 +02:00
Dockerfile
drizzle.config.ts
package-lock.json Fix spelling and version 2025-10-08 15:23:06 +02:00
package.json Fix version in preparation for manual release workflow test 2025-10-09 19:35:47 +02:00
README.md
server.ts General cleanup 2025-10-08 13:32:53 +02:00
tsconfig.base.json
tsconfig.json General cleanup 2025-10-08 13:32:53 +02:00
vite.config.ts

ethermap

This is very much a janky earlydays project. All help is welcome!

An interactive map tool. A tool for collaborative planning on maps. Anyone can create new maps, and add, modify and delete locations on any map.

Install

Ethermap is built in JavaScript using NodeJS. To install you can do so by running the following commands.

To install all dependencies for the front and backend :

$ npm install

You will then need to create a .env file in the root folder. There is a .env.template that you can copy as a guide. For a dev server you can simply copy and paste the template leaving it as is.

Then migrate the database structure :

$ npm run migrate:latest

Then you should be able to run the dev server :

$ npm run dev

You should now be able to access ethermaps on http://localhost:3000 (or whichever port you configured in your .env file).

Tech

Backend

Backend is running on express.js with ViteExpress bridging the gap between the front and backends.

Database is setup with Drizzle and Postgres.

Live data is shared with the client using socket.io.

Tests are written with Vitest and route testing uses supertest.

Frontend

Frontend is an SPA using lit element, state with ngneat/elf and some utilities by Pascal Schilp.

Map rendering is done with leaflet.

On hold : Live rendering of users is done with socket.io-client.

For the developer environment and building, the frontend is managed by Vite.

Setup

Dev

To setup the dev environment you will need a postgres database running, and a .env file filled out as per the .env.sample. Then do the following :

$ npm i

$ npm run db:up

$ npm run db:migrate

$ npm run

This should have you running ethermap with an empty postgres database.

Docker

You can build a development image & run it with the following:

docker build -t m3astwood/ethermap
docker run -it -p 3000:3000 m3astwood/ethermap

Desires

Minimal viable functionality for this project is the following :

  • Anyone can create a map
  • Anyone can create, modify and delete points on a map that contain at least
    • name of point
    • notes on said point
  • Everyone can see current users live
    • users can choose their name
    • users can choose their cursor colour
    • user data should be remembered across visits

Things that ethermap should/could do in the future :

  • points
    • edits are all recorded
  • users
    • users can chat
    • users can also draw polygons and make labels that are not necessarily "points of interest"
  • notes
    • notes should be rich
    • note updates should also be "live"
    • notes should be attributed to users who wrote/edited them
  • osmAnd Sync!