maproulette3 | MapRoulette , the micro-tasking tool for OpenStreetMap | Map library

maproulette3 is a new front-end for MapRoulette built with React. A back-end server from the maproulette2 project is still required. You can either install and configure it locally, or -- if looking to do front-end development only -- can connect to a pre-existing server if you have access to one (you will need your API key for that server). Please do not use the production server for development purposes.
Create a .env.development.local file and then look through .env at the available configuration options and override any desired settings in your new .env.development.local. yarn to fetch and install NPM modules. yarn run start to fire up the front-end development server. As mentioned above, a back-end server from the maproulette2 project is also required. You can either install and configure it locally or, if you have access to a pre-existing server, connect directly to it by using your API key for that server. These instructions are for connecting to an existing back-end server, rather than a local one you have installed. Please do not use the production MapRoulette server for development use.
Create a .env.development.local file and then look through .env at the available configuration options and override any desired settings in your new .env.development.local
yarn to fetch and install NPM modules
yarn run start to fire up the front-end development server
Install the back-end server using the instructions from the maproulette2 project, if you haven't already
Visit your OpenStreetMap account and go to My Settings -> oauth settings -> Register your application and setup a new application for development. For the Main Application URL and Callback URL settings, put in http://127.0.0.1:9000 (assuming your back-end server is running on the default port 9000). The only app permission needed is to "read their user preferences". Take note of your new app's consumer key and secret key, as you'll need them in the next step
In your back-end server project, setup a .conf file that overrides properties as needed from conf/application.conf (unless you'd prefer to set explicit system properties on the command line when starting up the server). Refer to the conf/application.conf file, conf/dev.conf file and maproulette2 docs for explanations of the various server configuration settings. At the very least, you'll want to make sure your JDBC url is correct and your OAuth consumer key and secret are set properly.
Fire up your back-end server, specifying the path to your .conf file with -Dconfig.resource or explicitly specifying the various system properties on the command line. See the maproulette2 docs for details on starting up the server
Edit your .env.development.local file in your front-end project and set: REACT_APP_SERVER_OAUTH_URL='http://127.0.0.1:9000/auth/authenticate?redirect=http://127.0.0.1:3000' (assuming your back-end server is on port 9000 and front-end is on port 3000). Restart or startup your front-end server, and then navigate to the front-end at http://127.0.0.1:3000
Open MapRoulette on that server normally in your browser, visit your user profile, and take note of your API key at the bottom of the page. Alternatively, you can use the server's super.key if it has been setup with one and you have access to it
Edit your .env.development.local file and override the following config variables:
Restart your front-end dev server if it's already running (ctrl-c then yarn run start again)
Point your browser directly at the front-end server, http://127.0.0.1:3000 by default. Once the page finishes loading, you should show up as signed-in if all is working correctly