NEON MAPP - XYZ Spatial Data Interfaces for 🌩 PostGIS

dbauzus-glx - Aug 28 - - Dev Community

This is a submission for the Neon Open Source Starter Kit Challenge : Ultimate Starter Kit

XYZ/MAPP

Open Source presentation, controller, domain and service layers for cloud native spatial data and application interfaces. XYZ being the Node application domain and service layer for a RESTful API which provides secure gateways for spatial data sources and 3rd party service providers. MAPP is an ES6 JS library which acts as application control and presentation layers. MAPP utilizes the Openlayers map engine for mapviews and provides an interface to the XYZ API. The library abstracts away the complexities of handling spatial data objects such as layers and locations.

The project is under an MIT License as a public repository on Github.
⚡️https://github.com/GEOLYTIX/xyz

My Journey

I have been working with proprietary Web Mapping Services in the noughties and dabbled with Python (GeoDjango) and Java (GeoServer) prior to the emergence of Node.js. Being a fullstack dev I was immediately hooked by the idea of using only Javacsript and SQL. I joined Geolytix in 2015 and have been working on XYZ/MAPP ever since.

The project has been conceived as Open Source since its inception. My employer being extremely progressive by letting us work OS at all times.🤲

Over the years many talented developer have joined MAPP team.
👩‍💻https://github.com/cityremade
👨‍💻https://github.com/RobAndrewHurst
👨‍💻https://github.com/simon-leech
👨‍💻https://github.com/AlexanderGeere

We are currently applying to bring the project under the OSGEO umbrella as a community project.

*Disclaimer. I am on a paid NEON Launch plan and have been using NEON since early access. I am using NEON on a daily basis for the ease of quickly creating cloud hosted dev databases.

Your Journey...

Will be an abridged version of the Getting Started / Workshop to create an XYZ/MAPP instance with access to an editable spatial dataset in a NEON PostGIS extended database.

tl;dr; Here is the link for the Vercel deployment for the Neon Dev Challenge which I created while writing following notes.

Create a table in the Neon Dashboard

Following script can be run in the NEON SQL Editor to create an empty table with a serial ID for new records and spatial indexed geometry. New locations [records] added to this table have fields to store textual, numeric, and boolean values.

CREATE TABLE IF NOT EXISTS dev_challenge
(
   id SERIAL,
   char_field character varying,
   textarea text,
   numeric_field numeric,
   integer_field integer,
   json_field json,
   bool_field boolean,
   datetime_integer integer,
   geom_3857 geometry
);

CREATE INDEX IF NOT EXISTS dev_challenge_geom_3857
   ON dev_challenge USING gist (geom_3857);
Enter fullscreen mode Exit fullscreen mode

XYZ/MAPP local

Clone the XYZ/MAPP repository.

git clone https://github.com/GEOLYTIX/xyz
Enter fullscreen mode Exit fullscreen mode

Open the repository folder in an IDE, like VSCode. Install the node_modules and esbuild the mapp libraries with the provided script.

npm install
npm run _build
Enter fullscreen mode Exit fullscreen mode

You are now able to run the XYZ as an Express application with node express.js. We recommend to create a node launch.json to Run and Debug the application with VSCode.

Copy the connection details from your NEON dashboard as value for the DBS_NEON environment variable.

{
  "version": "0.2.0",
  "configurations": [
    {
      "type": "node",
      "request": "launch",
      "name": "Neon Dev.to Challenge",
      "program": "express.js",
      "env": {
        "WORKSPACE": "https://geolytix.github.io/mapp/workspaces/neon_dev_challenge.json",
        "__WORKSPACE": "file:./public/workspace.json",
        "DBS_NEON": "postgresql://dbauszus-glx:************@ep-curly-base-242741.eu-central-1.aws.neon.tech/neondb?sslmode=require"
      }
    }
  ]
}
Enter fullscreen mode Exit fullscreen mode

You should now be able to access the MAPP default view on http://localhost:3000

Here you should be able to create locations stored in the NEON PostGIS table created earlier and modify the field values.

Image description

Workspace

The workspace is a JSON configuration for locales and layers hosted in an XYZ application. You are more than welcome to use the example workspace from the GitHub pages for geolytix/mapp repository. You may also copy the content into a workspace.json file in the public directory of your XYZ clone.

Deploy to Vercel

You can deploy your instance as a cloud function via Vercel. This is available for free as part of the Hobby Plan. Please refer to the XYZ wiki in regards to Vercel manifest. You need to create a vercel.json file with your env object from the launch.json before you can deploy through the vercel cli.

All of the cli configs are still default as of today.

Image description

You can access the deployed instance here.
👉https://neon-dev-challenge-hzro47z37-dbauszus-projects.vercel.app/

.
Terabox Video Player