A Simple Web App using Nitrogen.

Nitrogen is a Erlang web framework created by Rusty Klophaus. It’s looking pretty good so far and seem to be steadily improving. Today I decided it was time to jump in and get to know Nitrogen and setup my own app. Using the Amazon wishlist gen_server code I posted yesterday I created a little app that will accept an email address and then return your wishlist.

Nitrogen Installation:

First you need to install Nitrogen to your Erlang installations library path, follow the instructions here. For me this looked like:

cd /opt/erlang/current/lib/erlang/lib/
git clone git://github.com/rklophaus/nitrogen.git nitrogen-master
make
cd /opt/erlang/current/bin
ln -s /opt/erlang/current/lib/erlang/lib/support/nitrogen .

From there you can use the nitrogen create APPNAME command to generate a basic application directory. I called my app nitro_test.

Creating the wishlist app:

Since we are going to use the wishlist gen_server code I already wrote, I created a file named wishlist.erl in the src directory and pasted in the code adjusting the module name to match the file name. You should see something like this:

[user@host src]$ ls
nitro_test_app.erl pages wishlist.erl

Next, since we need gen_server to start up when we start nitrogen we need to edit nitro_test_app.erl’s start method to include this, it should look like this:

start(_, _) ->
nitrogen:start(),
wishlist:start_link().

Next I went to editing the web_index.erl file to include the functionality we want for our app’s index page. The code should look something like this:

-module (web_index).
-include_lib (”nitrogen/include/wf.inc”).
-compile(export_all).

main() ->
#template { file=”./wwwroot/template.html”}.

body() ->
%% Create the body of the page
Body = [
#p{},
%% Create a label
#label { text="Email Address" },
%% Create a textbox
#textbox { id=emailTextBox, next=continueButton },
#p{},
%% Create a button with a postback of 'continue'
#button { id=continueButton, text="Get Wishlist", postback=continue }
],

%% Validate the text is in the textbox
wf:wire(continueButton, emailTextBox, #validate { validators=[
#is_required { text="Required." },
#is_email { text="Enter a valid email address." }
]}),

wf:render(Body).

title() ->
“wishlist”.

%% This runs if the button is clicked
event(continue) ->
%% Grab the email address from the textbox
Email_addr = wf:q(emailTextBox),
%% Run a gen_server call to our wishlist module to actually get the wishlist
[List] = gen_server:call(wishlist, Email_addr),
%% Create a message to display with the email address
Message1 = wf:f(”This is the wishlist for ~s :”, Email_addr),
wf:flash(Message1),
%% Iterate through the wishlist displaying each item’s name
lists:map(fun(X) ->
ListItem = wf:f(”~s”, [X]),
wf:flash(ListItem)
end, List),
ok;

event(_) -> ok.

Hopefully the comments help you figure out what each directive does.

Finally, you should be able to build your app and run it. The start.sh script will build everything for you, but you can run make if you want.

[user@host nitro_test]$ ./start.sh
Starting Nitrogen.
Erlang (BEAM) emulator version 5.6.5 [source] [64-bit] [smp:2] [async-threads:0] [hipe] [kernel-poll:false]

Eshell V5.6.5 (abort with ^G)
(nitrogen@localhost)1>

—
Nitrogen is now running on inets.
Serving files from: ./wwwroot.
Open your browser to: http://localhost:8000
—

Hitting http://localhost:8000 in your browser, typing in your email address and clicking the get wishlist button should result in something that looks like this:

(click the image for a larger version)

Hopefully this helps you get started with Nitrogen. The full app in working order can be downloaded here.

Comments

I downloaded the app and ran start.sh and got this.  I am wondering if there is anything else I need to do to get this running.  Thanks.
——————————————

Starting Nitrogen.
Erlang (BEAM) emulator version 5.6.5 [source] [async-threads:0] [kernel-poll:false]

Eshell V5.6.5 (abort with ^G)
(nitrogen@localhost)1>
=INFO REPORT==== 11-Jan-2009::10:16:56 ===
  application: nitro_test
  exited: {bad_return,
          {{nitro_test_app,start,[normal,[]]},
            {‘EXIT’,
              {undef,
                [{nitrogen,start,[]},
                  {nitro_test_app,start,2},
                  {application_master,start_it_old,4}]}}}}
  type: temporary

Posted by Karmen Blake on 11 Jan 2009 at 19:20

Hi,

you have to edit the start.sh script and to insert the following.

1. export NITROGEN_SRC=PATH to your Nitrogen installation
2. -pa $NITROGEN_SRC/ebin $NITROGEN_SRC/include

in your erl command.

Best regards,
Ulf

Posted by ulf_A on 12 Apr 2009 at 08:00

Add comment