Home arrow JavaScript arrow Building the User Interface for a Web Site Indexing Application with Prototype

Building the User Interface for a Web Site Indexing Application with Prototype

The Prototype JavaScript library makes it easy to perform certain JavaScript tasks. In this series of three articles, you will learn how to use the Prototype library to create an AJAX-powered application for handling the data for an index of web sites. This article, the first in the series, shows you how to create the user interface.

Author Info:
By: Alejandro Gervasio
Rating: 5 stars5 stars5 stars5 stars5 stars / 6
February 20, 2007
  1. · Building the User Interface for a Web Site Indexing Application with Prototype
  2. · Getting started: defining the layout of the elements that integrate the front-end
  3. · Defining the look and feel of the web site indexing application: creating a few simple CSS styles
  4. · Completing the front-end of the application: Putting the CSS styles and structural markup together

print this article

Building the User Interface for a Web Site Indexing Application with Prototype
(Page 1 of 4 )

Over the last few months, the Prototype JavaScript library has become extremely popular with web developers worldwide, due to its remarkable capabilities to facilitate performing common JavaScript tasks, like working with the DOM, handing online forms, using arrays, and creating AJAX-driven applications.

Of course, the list of things that can be done easily with this package goes on, and certainly I'm sure that if you already tried this powerful software (if you haven't, please visit the official web site at: http://www.prototype.conio.net), you'll want to add your own items to the list. For the moment, the topics that were already mentioned are more than enough.

Speaking more specifically, I must say that one of the strongest points of this JavaScript library relies upon boosting and simplifying the development of AJAX-based programs, a feature that I plan to explore deeper in this three-part article series. Perhaps you're wondering how this can be done. Well, Prototype comes equipped with some versatile objects that can be really helpful in those situations where you need to create programs that trigger HTTP requests in the background. So in this set of articles, I'm going to demonstrate how to build a web site indexing application which will use AJAX to work as expected.

In crude terms, the AJAX-based application that I plan to create here will consist of a mechanism where users can submit some information related to their web site via a simple web form, including the corresponding URL, the web site's title and a short description of it. Next, all this data will be saved to a MySQL database table, and finally it will be displayed in an easily-readable index format on the browser, with no page reloads. Quite simple, right?

Now that I explained the primary objective of this group of friendly tutorials, let's move on and learn together how to use the robust capacity provided by Prototype to create this expansible web site indexing system. Let's get started!

blog comments powered by Disqus

- Project Nashorn to Make Java, JavaScript Wor...
- JavaScript Virus Attacks Tumblr Blogs
- Google Releases Stable Dart Version, JavaScr...
- Khan Academy Unveils New JavaScript Learning...
- Accessing Nitro? There`s an App for That
- JQuery 2.0 Leaving Older IE Versions Behind
- Fastest JavaScript Engine Might Surprise You
- Microsoft Adjusting Chakra for IE 10
- Brendan Eich: We Don`t Need Google Native Cl...
- An Overview of JavaScript Statements
- An Overview of JavaScript Operators
- Overview of JavaScript Variables
- More of the Top jQuery Social Plugins
- The Top jQuery Social Plugins
- More of the Top jQuery Slider Plugins

Watch our Tech Videos 
Dev Articles Forums 
 RSS  Articles
 RSS  Forums
 RSS  All Feeds
Write For Us 
Weekly Newsletter
Developer Updates  
Free Website Content 
Contact Us 
Site Map 
Privacy Policy 

Developer Shed Affiliates


© 2003-2019 by Developer Shed. All rights reserved. DS Cluster - Follow our Sitemap
Popular Web Development Topics
All Web Development Tutorials