we leaned about the Aptana Jaxer Server, which is a plug-in for other
servers such as Apache, Jetty or Tomcat. Based on Mozilla Gecko, Jaxer's server-side
user sessions, and other functions that are typically only found in web application
languages. Today, we will be using the Aptana Studio IDE to build a simple file-based
blog for Jaxer.
Familiarizing Yourself with the Aptana Studio IDE
Visit the Aptana Studio IDE download page to get the latest version.
The web page that we'll be working on today will be part of a project named "blog". We should create the project before moving on to individual files so that they will be grouped together and share the same root directory. Launch the Aptana Studio now to create the project. Once the app has loaded, select
File => New => Default Web Projectfrom the menu.
This will bring up the Project Wizard, which is where we can configure all
the properties for our project. The first screen sets the project's name and
root directory. Enter "blog" in the
Project name text
field. Accept the default location for the project root.
The project root defaults to the location of your current workspace, which
is normally best. Click
Next to continue.
The second page of the wizard is the
screen. Aptana Studio supports many of the most popular JS frameworks in use
Prototype 188.8.131.52 and hit
You can skip the
Host screen as we don't require hosting services.
Finish button to complete the creation of the blog project. Our new
project will appear in the
Project pane, on the left-hand side of the studio.
The project includes a
lib folder, which contains the
prototype library, an
index.html file, and a
prototype_sample.htm page. If you're familiar with Prototype,
you can delete the Prototype sample.
The post files will reside in the
posts subfolder. You can create
a folder by right-clicking the
blog project icon in the
pane, and selecting
New => Folder from the popup menu.
New Folder dialog allows you to choose the parent folder and a name for
the new folder. Leave the "blog" root as the parent and enter "posts"
Folder name text field. Click
OK to create the new folder:
The blog.html Page
Now we'll modify the
index.html page to display the posts.
First, we'll rename it to something a little more descriptive. Right-click
index.html file in the
Project pane and select
Rename from the popup menu.
That will change the name label into an editable textbox. Rename the file to
"blog.html" and hit
Enter to effectuate the name change.
blog.html file to open it in the editor. The title and page heading
can be updated to "The Blog Page". Next, we need to assign the
onserverload event. As you type
<BODY> tag, a dropdown list will appear with a list of available
onserverload from the list and enter
"init()" between the
quotes to set the event action:
init() function will read all the files in the
posts folder and format
them as HTML using the Showdown JS library,
tool. First, we'll add code to create a
<DIV> element to the page: