My Path - Web Systems Development and Designing (Part 1)

From the day I started this blogging, I’ve yet to blog anything about the insight of me. If I were to talk about myself, definitely, it would be related to web systems development. Thus, that’s why this blog is written.

Started from my first personal website
I have first got the first taste of web designing during the first trimester break of my foundation study in year 2001. Before that, I was admired and inspired by all the nice web sites in Internet. Then, I decided to spend the 3 weeks trimester break to come out with the first personal website, by using one of the simplest WYSIWYG web editors, which was Microsoft FrontPage 2000. The reason of using FrontPage is simply because it doesn’t require any knowledge in HTML, and the interface is very similar to Microsoft Word. Anyone familiar with Word should feel at home with FrontPage.

As a newbie, the first web site I’ve created was pretty simple, but with lots of graphics. At that time, I wasn’t equip with any skills in graphics editing, and thus all the images were taken from Internet, without considering the image size and contents balancing. Besides, the interfaces were not standardized across the site as well.

Then, upon completion, it was time to register for a free hosting. I’ve registered with Yahoo Geocities, as it was very popular. During that time, Geocities was still providing free FTP uploading services. After registering hosting account, I’ve encountered a critical problem. “How to upload my web files with FTP?” Fortunately, I’ve got the answer from Help topics. But then, another problem came. When I was synchronizing the files, FrontPage prompted with error messages, alerting me with “illegal file names”. Guess what? All the web files were named with spaces in between of words. Thus, they were rejected by the web server. This problem took me 3 days to solve haha. How difficult was it to solve a simple problem without any assistance.

Finally, my first personal website was up running in the Internet. I was so happy, and informed all friends to visit the website. Some of them have dropped critical comments in my Guest Book. Thanks a lot for that. That was how I continuously improve myself.

The first taste has caught my interest to further discover the world of HTML. Thus, I repetitively updated my personal website, to include more useful information. Besides, with every new skill I’ve discovered, I also reconstruct the website as practice. “Practice makes perfect”. This is how I brush-up on my web designing skills.

Moving to Macromedia Dreamweaver
Soon, after a few times of updates, I opt for a web editor offering more advanced designing features. Then, this is when I started to pick up Macromedia Dreamweaver. During that time, it was Dreamweaver 4. At a first glance, the first time I run Dreamweaver, I was shocked by the floating and docked panels. “Oh no, so many buttons and menus, all are strange to me. How to start?” I have no idea on 99% of the features available. I can’t even figure out what a specific function actually does by reading the captions.

Now, this is when the Help menu comes handy. I opened the help topics, and followed the tutorials. Yes, it helps. Finally, I could confidently work with the basic features available to reconstruct my website again. To me, Dreamweaver is the best web editor I’ve ever seen. It’s so powerful that, anything is made possible. From Dreamweaver 4, to the Dreamweaver MX 2004 (7.01) I’m currently using, it delivers the best of satisfactions. You’ll enjoy when building complex design layout.

Discovering multimedia designing
A web developer could never achieve higher peak without knowledge in designing. That’s why I’ve made a move to discover multimedia designing, beginning with Macromedia Flash. I started with Flash 5, in year 2001. What motivated me to pick up Flash? Once, during a coursework presentation session, one of my course-mates delivered the presentation slides in Flash. It caught my attention, and motivated me to learn up Flash designing, so that I could also deliver presentation sessions with Flash.

As for Macromedia products, it’s glad that I’ve never need to buy a reference book. The incorporated tutorials and help topics are useful enough to get me started, and moving to advanced features as well. This approach applies to my learning path in Flash as well. To be honest, when I started to pick up Flash animations, I’ve got hard time trying to get familiar with the steps and features. In order to improve myself, I’ve always initiated to design some seasonal greeting cards, and also short intro for website. This has definitely helped me a lot in brushing up my skills.

There’re advantages and disadvantages of picking up a skill without assistance. The advantage is, you can hardly forget something that you learn. The disadvantage: learning without assistance will sometime cost you a few days to solve a small problem haha.

All right, that’s all for the part 1 of my personal path in web systems development. I’ll continue with this topic in part 2, in which I’ll share with you how I discovered the dynamic web development technologies, as well as the difficulties encountered. Check it out ;-)

Final Year Project – Ready for Coding

Today, my group has submitted the interim report for our final year project, titled Online Real Estate Management System (OREMS). After 6 weeks of compilation, the interim report is consisting of documented information on define and design phases, including the system prototypes, as well as a well-defined set of standards management. This milestone signifies that the OREMS project is now ready for the following phases, development and deployment, which are scheduled for 13 weeks duration.

The proposed OREMS is a completely generic solution for the real estate field. In other words, the solutions are designed to suit most, if not all, of the real estate firms and agencies in Malaysia. This is achieved with detailed studies of various requirements. Most of the settings are designed to be configurable with graphical user interface.

During the design phase, we have visited a number of the existing online real estate systems, to analyze the strengths and weaknesses. Through this, we have also collected some additional system requirements. After all, learning and reviews will always lead to better results.

The proposed OREMS will be implemented in Java platform, with JSP/Servlet in core. At the same time, we’re adapting open source projects as development tools and technologies, such as Eclipse IDE, MySql Database, Jakarta Tomcat server, Apache Struts framework, Apache Log4j logging, and JasperReports reporting. Thus, the development and maintenance costs are greatly minimized.

The OREMS project is a team work delivering by 3 developers including me. Another 2 great companions are Lim Ken Wei and Tee Hui Ping. I met Ken Wei and Hui Ping in the foundation study. Throughout these 3 years, we have collaborated for a number of projects, and now, we’re in the same team again for our final year project.

All the best to OREMS.

Learn Packet Routing Concepts With Peter Packet

Yesterday night, I've just visited a light game developed by Cisco Systems Inc. I saw the link to this game, when I logged into Cisco Academy. This game is named as Peter Packet, and currently available at this link.

The Peter Packet game is fully developed with Macromedia Flash. This game is filled with amazing cartoon animation and fun music. A life saving message must be delivered, and it is up to you and Peter to make the journey safely. You are in control of Peter as he runs, jumps and flies past obstacles. Help Peter defeat the Hacker & his viruses while racing through the Internet!

Any way, the main point of me recommending this game is not merely for the sake of fun. Instead, the missions designed in the game could help everyone to knows the foundamental concepts of routing a packet in the Internet, and the functions of a router.

In addition, throughout the missions, the player will also be introduced to poverty problem facing in India, pollution of driking water in Haiti, AIDS in Zimbabwe; and at the same time, the ways and approaches you could help the community to overcome these social problems.

I would say, this is a very educational game. Keep it up Cisco.

RM5 Polymer Note

On 26th Oct 2004, Bank Negara Malaysia has introduced the new RM5 polymer banknote. Polymer substrate banknotes are more durable, non-porous, more resistant to dirt and liquid and not easily torn. The new polymer banknotes are therefore expected to last longer. To maximise the benefits of its longevity the public are advised that the new banknotes should not be folded with pressure.

The new security features incorporated in RM5 polymer banknotes are:

• A clear window with the shadow image of the Prime Minister's Office at Putrajaya and an embossed printing of the numeral "5", both of which are visible from either side of the banknote.
• Bank Negara Malaysia's logo the Kijang, printed in white and visible on either side of the note. On the back of the banknote, it will appear as a non-transparent window, with the Kijang Logo seen clearly.

The existing RM5 paper banknotes remain to be legal tender and will continue in circulation until it is fully withdrawn over time. Friends, I think we should keep some existing paper banknotes. Who knows it'll be valuable in the next 30 years :-)

Host Your Web Server With Dynamic IP

Want to host your website without purchasing web hosting plan? Yes, No-IP is featuring free service to meet this requirement.

No-IP Free offers an easier way for others to locate you on the Internet. If you want to serve web pages, share MP3s, host Quake, or run any kind of Internet server, you need a name so your users can find you. It's simple. You choose a name for your computer and we tell the world where your computer is located. Even better, we also provide you with a program that notifies us whenever your computer's IP address changes. Instead of being just a number on the Internet, your server is now always available by the same easy-to-remember name.

I'm also using No-IP Free to host some of my web projects for presentation purposes. What's so great about No-IP Free? All you need, is just to register for an account with No-IP, then download and install the Dynamic DNS Update Client. Now, start your web server, and type in the domain name you have just registered. Done, you have your website hosted without additional cost.

Even if you're behind a firewall or using a NAT-enabled router (like me), still, there is a solution for you. You may check out this aricle http://www.no-ip.com/tips/id/3, it's very useful for NAT-enabled router.

All right, don't waste your broadband, have fun with No-IP :-)

Price For Mini MPVs Will Be Raised Up

In Malaysia, to date, the following cars are no longer recognized as MPV (Multipurpose Van):

• Hyundai Matrix
• Hyundai Getz
• Honda Jazz
• Kia Picanto
• Chevrolet Aveo

Thus, effective from 1st Jan 2005, the import duty of these mini MPVs will be raised from 90% to 140%. What a bad news to average income community

Malaysian government is reviewing the mini MPVs, to check if they meet the definition of MPV. According to the guidelines, MPV must have 7 seats, and equipped with luggage storage.

If you're planning to buy these mini MPVs, be quick before the price is raised.

Introduction to Log4j

Programming without any proper logging approach could easily drive your maintenance cycle into dead end. And this is probably the main reason why programmers don't like to get involve in system maintenance and support. Apache Logging Services project has developed a wide range of logging services for various popular languages.

Here, I would like to discuss on the "short-cut" of getting your project to adapt witj Log4j, which is the logging service designed for Java programming environment. Though I've never tried to implement Apache Logging services in other languages, but I believe the approaches should be similar.

Before going further on, please make sure that you've got a copy of Log4j, else you may download from http://logging.apache.org/log4j/docs/download.html.

Now, unzip the the jakarta-log4j-<version>.zip, and locate the log4j-<version>.jar from the directory of \dist\lib. Then, simply add this JAR to your CLASSPATH. If you're using Eclipse, please make sure to update your project library to include this JAR.

Similar to any other latest technologies, Log4j is also a fully customizable package, in which you could design your own logging output patterns, appenders, and also logging levels. All these are cofigurable in .properties or .xml file. Here, I'll show an example of .properties configuration file.

########################################
# Log4j Logging Services Configuration
# Name this file as log4j.properties
########################################

# Set root logger level and appender(s)
log4j.rootLogger=DEBUG, ConsoleApp, FileApp

# ConsoleAppender
log4j.appender.ConsoleApp = org.apache.log4j.ConsoleAppender
log4j.appender.ConsoleApp.layout = org.apache.log4j.PatternLayout
log4j.appender.ConsoleApp.layout.ConversionPattern = [%-5p] %d (%C:%M:%L)%n%m%n%n

# FileAppender
log4j.appender.FileApp = org.apache.log4j.RollingFileAppender
log4j.appender.FileApp.File = logs/log4j.log
log4j.appender.FileApp.MaxFileSize = 500KB
log4j.appender.FileApp.layout = org.apache.log4j.PatternLayout
log4j.appender.FileApp.layout.ConversionPattern = [%-5p] %d (%C:%M:%L)%n%m%n%n

Copy the configurations as shown above into a new text file, and name it as log4j.properties. Then, save this file in the root directory of your classes, such as /classes or /bin.

Whenever you declare a logger object in your class, Log4j will look for this configuration file. Basically, what this example configuration file does, is to set two types of logging appenders, one of these is console appender, and another one is file appender. So, the logging statements will be generated on console, as well as a file you've specified.

Take note at the statement log4j.appender.FileApp.File=logs/log4j.log. This statement specify the location where the logging file should be kept. So, in this example, you should create a folder named logs in your project directory. As this article is only focus on the "short-cut" of getting your project adapt with Log4j, thus I'll skip off the detailed explanations of its implementation and theories. If you're interested to discover more, please visit http://logging.apache.org/log4j/docs/manual.html.

Now, you're ready to kick-off. Create a new class as shown below:

import org.apache.log4j.Logger;

public class Log4jExample {
/**
* Logger for this class
*/

private static final Logger logger = Logger.getLogger(Log4jExample.class);

public static void main(String[] args) {

logger.info("This is an logging statement of level info");

logger.error("This is an logging statement of level error");

}
}

All right, now, if you execute the above example, you should expect to have the following outputs shown in console and /logs/log4j.log file.

[INFO ] 2004-10-25 20:35:31,593 (log4e.DeploymentEx:main:25)

This is an logging statement of level info


[ERROR] 2004-10-25 20:35:31,625 (log4e.DeploymentEx:main:26)

This is an logging statement of level error

The coding is very simple. First, you need to import the org.apache.log4j.Logger. Then, declare a logger object with private static final Logger logger = Logger.getLogger(Log4jExample.class). Done, you can continue to insert logging statements as needed. Example of methods to call are shown below:

logger.debug("This is an logging statement of level debug");
logger.info("This is an logging statement of level info");
logger.warn("This is an logging statement of level warn");
logger.error("This is an logging statement of level error");
logger.fatal("This is an logging statement of level fatal");

Log4j organizes the logging statements into 5 levels:

1. FATAL
   The FATAL level is rarely used and usually implies the impending crash of the application or the relevant sub-component.
   
2. ERROR
   The ERROR level is encountered more frequently, usually following a Java exception. Error conditions do not necessarily cause the application to crash and the application may continue to service subsequent requests.
   
3. WARN
   The WARN level is indicative of minor problems caused by factors external to the application such as missing or inconsistent input parameters supplied by the user.
   
4. INFO
   These first three levels are associated with problems. In contrast, the INFO level is associated with significant events in the normal life cycle of the application.
   
5. DEBUG
   The DEBUG level is associated with minor and frequently occurring but otherwise normal events.

Now, you've got the logging statements successfully generated. It comes to another interesting part. How to allow statements of a specific logging level to be displayed, while deny others? This can be done in the log4j.properties configuration.

From the log4j.properties, take note of this statement log4j.rootLogger=DEBUG, ConsoleApp, FileApp. This statement is to simply set the root logger to DEBUG level, with console and file appenders. So, it means, all logging statements of level DEBUG and above will be generated without filter. If you change DEBUG to INFO, then, logging statement of DEBUG level will be ignored.

That's all for this short tutorial. Log4j is much more powerful than what I'm mentioning here. You may discover other powerful options by simply searching through the Internet, or refer to the book titled Log4j The Complete Reference by Ceki Gülcü. This is the best Log4j reference I've ever read. Have fun with logging.