CSCI 3601 Production Template Fall 2017

Table of Contents

• Setup
• Running your project
• Testing and Continuous Integration
• Resources
  • Angular 4
  • SparkJava
  • MongoDB

Setup

As in the labs, you'll be using IntelliJ. Once you've all joined your group using GitHub classroom, you can clone your repository using IntelliJ:

• When prompted to create a new IntelliJ project, select yes.
• Select import project from existing model and select Gradle.
  • Make sure Use default Gradle wrapper is selected.
• Click Finish.
• If IDEA asks you if you want to compile JavaScript to TypeScript 🔥 DO NOT 🔥 it will break your project.

⚠️ IDEA will sometimes decide to "help" you by offering "Compile TypeScript to JavaScript?" ‼️ Never say "OK" to this offer -- if you do it will make a complete mess of your project. We're using other tools (gradle, ng, and a thing called webpack which you never explicitly see) to do that compilation. If you let IDEA do it, you'll have a ton of JavaScript files cluttering up your project and confusing other tools.

Running your project

• The familiar run Gradle task will still run your SparkJava server. (which is available at localhost:4567)
• The build task will still build the entire project (but not run it)
• The runClient task will build and run the client side of your project (available at localhost:9000)
• The build.sh is a script that calls upon gradle build to build the entire project which creates an executable to be able to launch the project in production mode. To run build.sh, go to your project directory in a terminal and enter:./build

When build.sh is run the script .sage_run.sh is copied to ~/sage.sh that when launched i.e. ./sage.sh will run your project in production mode. The API_URL within the environment.prod.ts should reflect the url to get to your server e.g. http://localhost:4567 or http://acooldomainname.com

❗ Pro-tip: IntelliJ comes with a nice view to see the mongo databases setup. To access this click on File -> Settings -> Plugins, type Mongo and make sure the Mongo Plugin is installed. Now head to View -> Tool Windows -> Mongo Explorer. Then use the tool icon to add configuration. Once prompted type for Path to Mongo Shell: "/usr/bin/mongo" and hit the green ➕, to add your label and, huzzah!, Mongo Explorer is on your side bar.

Testing and Continuous Integration

Testing options are still integrated in this lab so you can test the client, or the server or both. Testing client:

• runAllTests runs both the server tests and the clients tests once.
• runClientTests runs the client tests once.
• runClientTestsAndWatch runs the client tests every time that the code changes after a save.
• runClientTestsWithCoverage runs the client tests and deposits code coverage statistics into a new directory within client called coverage. In there you will find an index.html. Right click on index.html and select Open in Browser with your browser of choice. For Chrome users, you can drag and drop index.html onto chrome and it will open it.
• runE2ETest runs end to end test for the client side. NOTE: Two Gradle tasks must be run before you can run the e2e tests. The server (run) needs to be on for this test to work, and you have to need to have data in the dev database before running the e2e tests!
• runServerTests runs the server tests.

Turn on your repo in Travis CI, replace the build status image in this README, and push your changes. That will trigger a build with Travis.

Resources

Angular 4

• What is Angular 4 and Typescript?
• What is Angular CLI?
• What are environments in Angular CLI?
• Testing Angular 4 with Karma/Jasmine
• End to end testing (e2e) with protactor and Angular CLI
• Angular CLI commands

SparkJava

• Spark documentation
• HTTP Status Codes
• Other Resources

MongoDB

• Mongo's Java Drivers (Mongo JDBC)