Agile: Create Web Apps the Amazingly Simple Way

There are some people who insist that the only real way to code is in a text-based editor like vi or emacs. Others would sooner chop off a limb than depart with the comforts of Visual Studio. While the first group will happily code away at their consoles from now until Y2K38, the second group is always demanding new innovations in simplicity of software development. These people are the target users of the Agile Platform – an amazingly simple way to create beautiful and functional web apps. As just one example, you can take an Excel spreadsheet and turn it into a searchable, sortable, editable web app in literally 5 minutes, without writing a single line of code. Old-school hacker or not, that’s pretty impressive.

Getting the Agile Platform

The Agile Platform is Windows software, and an installer can be found here. It’s worth noting that the installer may download some additional components (such as parts of IIS or SQL Server) during the install, so the process may take a while.

First Agile Application

When everything is installed, fire up Service Studio, Agile’s development environment. At the main menu, choose to start your own app from scratch. You’ll be dropped into the main editor window.

agile-blank

Right now you’ve just got an empty template, waiting for data. All we have to do now is give it some data (in this case, in the form of an Excel spreadsheet). Agile will create a web site based on the data.

Importing the Data

As an example exercise, we’ll create a simple bug tracker/ticket system. To make the process simpler, I’ve prepared a spreadsheet to act as the example data, which can be downloaded here.

In Service Studio, click “Import -> Entities from Excel” and choose the file you just downloaded. If you watch the right hand pane, you’ll see a few new entries show up. The section you need to worry about is Entities. In there, you’ll now see a new entity called Ticket. Drag this entity from the panel and place it directly on top of the HomePage icon.

agile-drag-entity

View Your “Work”

Believe it or not, you’ve now done everything you need to do for our basic bug tracker. Have doubts? You can see for yourself by publishing the project and previewing in your browser. Click the 1-Click Publish button at the top of the screen to begin building.

agile-publish

It’ll take at least a few seconds, and you can watch the progress with the bar in the lower left of the screen. Once it’s done, you’ll be presented with an option to view the project in your web browser via a button in the lower right. You’ll now see the page Agile generated for you based on your data.

agile-preview

Pretty cool huh?

Editing Your Page and Data

You will of course want to be able to change the data once it’s in your system. Let’s start by turning the ticket number on our page into a link, which will take users to a “Edit Ticket” page. On the main flow screen, double click the silver square labeled “Ticket_List“. This will open a WYSIWYG editor where you can interactively manage the items on your page.

Right click the ticket number as demonstrated above, and select “Link to New Ticket_Edit Web Screen“. This will generate a new page where you can easily edit all the data listed. Go ahead, publish again and see for yourself.

agile-edit-page

More Information

One of the best features of this platform is that they provide an extremely comprehensive set of training materials for you to learn everything you’d need to know. It’s all available right here.

Conclusion

I’ve barely scratched the surface of Agile, and honestly, I’m already pretty blown away. It’s rare that I’m really impressed by software. As in REALLY impressed, but Agile is one heck of a product. What we’ve done in this guide is just a tiny portion of what this platform can do, but even that tiny bit shows what an amazingly well designed system this is. To me, the biggest drawback about the Agile Platform is its reliance on Windows libraries and applications. It’s not a bad thing exactly, the platform seems to work quite well on my Windows 7 test machine, but portability would have made this a real killer app. That said, I’d be willing to boot Windows once in a while if it means I can develop beautiful, functional and powerful web application in one lazy afternoon.

3 comments

  1. Great article Joshua!

    I would like to share that OutSystems also provides a Java edition, so you can publish that same application model to a Java and Oracle stack.

    Also, because users are concerned with technology lock-in, the Agile Platform generates standard, optimized and fully documented source code which does not require runtime interpreters or engines.

    You can read more about it here: http://www.outsystems.com/agile-platform/technology-independence/

  2. Great article Joshua. I liked the fact that you don't just talk about the platform, but actually used it to create an app and explain readers how they can do it on their own.

    A great piece of the Agile Platform, that is not visible at first, is Service Center – the Agile Platform's management console.
    When you install the free Community Edition on your computer, Service Center will be one of the tools that is installed.

    Service Center has all the logging/monitoring of your apps (which you can use to identify errors or performance bottlenecks), let's you manage your infrastructure (to add front-end servers for horizontal scalability, for example), manage users and roles (of the development team), and handles all version control (so you can always access a past version of your app, download it to make changes, or rollback to a previous version with 1-click).

    Service Center is an awesome tool to manage your web apps created with the Agile Platform, and really brings down maintenance/operation costs. Be sure to take a look at it when you have some spare time.

    Cheers

  3. Very practical article Joshua!

    An other perfect solution for running your project and later on maintenance is the ETC feature.
    ETC stands for Embedded Change Technology. What is does is enabling developers, testers and users (for all depending on permissions) to “comment” on a webpage. What happens is that the comment combined with a screenshot and browser information is logged in the Agile system. The project / maintenance team can pickup the ETC entry and are pointed to the specific location in the source. Read more at: http://blog.outsystems.com/aboutagility/2010/07/justin-james-ect-diary-application-development.html

    Bert <

Comments are closed.

Sponsored Stories