Ninja Framework Tutorial – PART 1: Setting up Ninja with Netbeans

Abstract

For the first part, I will walk you through how to get a Ninja site running with Netbeans. The end product is as simple as just launching Netbeans and hit Run Project. No command line needed. As of this writing these are the current versions of what I’ll be using:

JDK 1.7.0_25

Apache Maven 3.3.1

Ninja Framework 5.1.0

Netbeans 8.0.2

Brief Intro

(You can skip this section if you want.)

Lately I’ve been looking into web development with Java. As with general web development, working with simply just raw java is tedious and prone to lead to a ton of bad practices and lots of unnecessary code. Why reinvent the wheel? Having experience with Laravel, I decided using a framework would be a sensible choice. After choosing between Spring MVC and Ninja, I opt for Ninja.

Why write a series of tutorials? The Ninja Framework website is pretty nicely documented, but I feel things could be simpler, and there are some holes that unless you’ve some experience you’re going to be a lost. In addition I don’t see many tutorials written about it. Everybody in YouTube land is doing more Ruby and PHP. When I searched “Ninja framework” in YouTube, all I found is an hour long video. Even in Google search I barely found anything useful.

Let’s Start!

First off, I’m assuming you’re going to start with nothing. I’m using Windows 8.1, but you should be able to apply it to Linux or whatnot. Following this guide, you first install JDK and Maven, followed by Netbeans (If you’re sure which edition, just choose all! XD). JDK and Netbeans is fairly straight forward so I won’t guide you through.

Maven is a little tricky. It’s not like you download some installer and you’re on your way. Netbeans does come with Maven built in, but currently it is using 3.0.6 whereas Ninja requires 3.1.0 and above.

What you have to do, is download the binary zip from the Maven website, extract the contents to your C drive. You will see a folder “apache-maven-3.3.1” or something like that in the root of your C drive. Rename this folder to “mvn” to make things simpler.

Add “C:\mvn\bin” directory to your environment PATHs so you access the “mvn” command in your command prompt. If you see some JAVA_HOME error when typing “mvn -version” in command prompt, add a environment user variable JAVA_HOME pointing to JDK:

If you’re not sure how to add an environment PATH or user variable, google it (lol).

Create New Ninja Project in Netbeans

Select “New Project…” icon in Netbeans. Under Categories, select “Maven”, and under Projects, select “Project from Archetype”. When you click Next, you’ll see a list of “Known Archetypes”. You can filter the result using the search bar, typing “ninja”.

SuperDevMode via “Run Project”

SuperDevMode guide in Ninja’s website. For a first few days of using Ninja, I actually open up the command prompt, cd to the ninja project directory and copy paste “mvn ninja:run” every time I want to run SuperDevMode. When I want to terminate SuperDevMode I press “Ctrl-C” and type “y” to cancel batch process.

This is plain silly. Obviously IDEs are made to make this process simpler.

Right click your project and select “Properties”. Under Catergories, select “Actions”. Under Actions, select “Run Project”. Change the contents of “Execute Goals” from “package” to

ninja:run -Dninja.port=8080

You’ll see a new file called “nbactions.xml” added to your project. If you remove this file, it will revert back to the default “Run Project” settings in Maven.

Port numbers VS Context Path

Why specify a port number you ask? Ninja Framework uses 8080 by default after all. But say you have multiple Ninja sites and you want yo run them at the same time. Distinguishing them is as simple as using different port numbers. You can then bookmark these in Chrome for convenient access.

But you can also use ContextPath like so, yes?

mvn ninja:run -Dninja.context=/your_context_path

Well, it gets the paths to your site screwed up. When I first did this the site was unable to find its assets (css, js files) because they were linked as such:

This is annoying for me to do, so I prefer to just change port numbers and give meaningful names via URL bookmarks.

Ignore, I Don’t Want IDE Managed Deployment

Last step! (: Click “Run Project”. You’ll be presented with a dialog as below:

Select “Ignore, I don’t want IDE managed deployment”, and SuperDevMode will now be running! Note that it won’t launch your browser automatically as other netbeans web projects; you’ll have to launch a browser manually and enter the URL “localhost:8080” (Not a big hassle I hope).

To turn off SuperDevMode, go to the Output window and click “Stop the currently executing build”:

From now on, whenever you press “Run Project” (F6), it will execute SuperDevMode automatically. This will be specific only to this project. What a time saver!

This information will also go to your “nbactions.xml” file, as with how you set up “Project Run”. After that it is the same thing as running: you need to select “Ignore, I don’t want IDE managed deployment”. You’ll have to do this once, but afterwards you can use the dropdown shortcut:

It will only use port 8080, so if you have SuperDevMode using port 8080 you should turn it off. Technically you can change this port number, but you’ll have to edit “pom.xml” and do configurations… which I despise; it’s not like ninja:run where you can specify it as a parameter. So therefore I will assume you’ll only debug one site at a time.

Technically you can debug one site using port 8080 and have 3 other ninja sites running on SuperDevMode (but using different port numbers) at the same time. Cool yes?

Bonus Section: Automatic Refreshing – Super Auto Refresh

Workflow at this point is as follows: You make a change in Netbeans, Netbeans auto compiles for you, SuperDevMode picks up and changes and updates itself. You then refresh your browser to see the changes. The last step at this point is still done manually.

F5, F5, F5…

So to top it all up before closing, I wish to recommend another convenience tool called Super Auto Refresh. You can the Chrome extension via this link. Set the tab to your Ninja site for 2 seconds interval refresh and you’ll never have to manually refresh again! Of course, you could lag your PC doing this, so you shouldn’t try this if it slows you down.

One thought on “Ninja Framework Tutorial – PART 1: Setting up Ninja with Netbeans”

Hey, thanks for a fantastic tutorial. I also find the NinjaFramework really excellent. I’ve blogged about CORS using the NinjaFramework here: http://outbottle.com/tag/ninjaframework/ I couldn’t figure out how to get SuperDev mode working direct from Netbeans though. I also didn’t realise debugging was so readily available. Thanks for providing great information.