**New Developers Working Group**
====== Angular Tips ======

===== Compiling =====
Working with Angular development is a little different than working in other areas of the webclient. Normally you might make a change to a file, clear your cache, refresh, and instantly see your change. Angular is different; it also includes an additional step called compiling.

When you're actively working on a file or series of files, you will want to turn on Angular's watch mode. This way the compiler will keep looking to see if you've made any changes, and bundle up your Angular project so that it can be served up to the web. If you do not turn on the watch mode, you won't see your changes happen on the webclient. See the Angular documentation around **ng build** [[https://angular.io/cli/build|here]].

To turn on watch mode, you will need to navigate anywhere within the eg2 file structure. That would be anywhere within Open-ILS/src/eg2/. See **[[newdevs:landscape:tree#web_staff_client|File Locations]]**.

Then type the command ''%%ng build --configuration production --watch%%''. (That's two hyphens together.)

To stop running ng build, type **CTRL+C**.

===== Typical Build Tasks =====

After installation or making changes, typical build tasks are: 

  * ng build --test  # compile in dev mode
  * ng build --prod # compile in production mode
  * ng lint # check for lint 
  * npm run test # run test cases

A common practice is to have a symbolic link from the source path to the installation path and run "ng build --watch"  in the background. That way, changes you save get immediately compiled and can be seen with a browser refresh.


===== Angular Sandbox - Components =====

  * File location: Open-ILS/src/eg2/src/app/staff/sandbox/sandbox.component.*
  * In browser: /eg2/en-US/staff/sandbox