Skip to content

Developer setup

Cameron Rushton edited this page Mar 12, 2020 · 3 revisions

This project requires Maven, JDK 1.8+ and the Lombok plugin for your IDE to start development.

To work on the front end, you need node and npm. Get them both in one download here: https://nodejs.org/en/download/

Once done, run npm install aurelia-cli -g

Go to the project directory and cd into the root of the front end files cd into src/main/javascript

install dependencies npm install

if at any time it says there are required dependencies that you need to install yourself, do so. Most likely will be npm install babel and npm install eslint.

Seeing 3 warnings/vulnerabilities is normal, but you should not see any errors. If you do, run npm audit fix or whatever it tells you to run.

Run the front end. Make sure you're in src/main/javascript. Now that we have the aurelia cli, we can type au run --watch Go to localhost:9000 in browser

You can update code in the front end, save it, and see your change get added to the view while live - no need to repackage/stop the server/etc. Changes in the back end still need to be recompiled though.

Not reloading? Check the console for compile errors. Once the error is fixed, it should attempt to recompile; try ctrl+c the process to get it to run again if it still doesn't recompile after you know you fixed it. Still don't know? Check the console tab in dev tools in chrome or firefox (ctrl + shift + i usually). Can also check the network tab for all the requests and responses. Need a debugger? You can add breakpoints in the dev tools' sources tab or write the word 'debugger' anywhere in your code and save it. If dev tools is open when you hit the 'debugger' word, it will stop there. Be careful not to push that to prod. While debugging, you can hover over variables to see their current value or type the variable name in the console window.

More info: How-to docs: https://aurelia.io/docs All APIs: https://aurelia.io/docs/api The most useful aurelia page: https://aurelia.io/docs/binding/basics aurelia.io has lots more info than just those routes An example project: https://github.com/CameronRushton/anime-anthology

If you run mvn package, only the back end will be packaged. Your api is at localhost:8080, but you will not see your front end. Use postman or something similar to test your endpoints live. Travis will hook up the front end and back end in production and staging, so that it's one app. You can do this on your own in a dev environment, but this is an easy way to upload mass compiled files unnecessarily.

Make sure aurelia knows where your app is in a local installation (ensure environment.js points to localhost:8080). You'll know the front end and back end aren't talking if there's Http errors in your dev tools console.

Clone this wiki locally