Thursday, August 27, 2009

5 Tips for Adsense Registration

After waiting in 4 days, finally my blog approved by Google Adsense. This is my first blog with Adsense and I have no experience in registering my blog to Adsense before. I'll share some tips to register successfully. Just follow the simple steps below:

  1. Be sure your posts is in English. Although Google Adsense supports several languages, I strongly recommend you to write your posts in English.
  2. Write your posts by yourself. Don't copy/paste another blog content to yours. It's ok if you can modify them. Make the post look better in language structure and appearance.
  3. Design your blog nicely. Modify the layout and color. Don't use too much color. Keep your blog/site simple. Create a nice banner image with same text as your blog/site address. I think it will make Google more appreciate your work.
  4. Create Google Adsense account after your blog/site has ten or more posts in a week.
  5. While you're waiting for approval, keep writing some posts. I believe that Google Adsense reviewer is keep watching your blog/site whether your site is always update.
That's the simple tips you can do. Don't forget to leave a comment so I know that this post is useful to you. Good luck. Read more...

Tuesday, August 25, 2009

Top 10 Javascript Libraries

I didn't write this list in order of rank. All of these libraries are often used by many software developers. So check them here:
  1. ExtJS
    If you're bulding rich internet application and need widgets, here is the answer. You can create a nice widget with just a piece of code. It's also has a chart widget.
  2. Yahoo UI
    Yahoo UI has a heavy namespaced library and very good documentation.
  3. Dojo Toolkit
    This one has an exellent idea of local data storage. It also has a superb infrastructure and good solid written API - one can easily write its own custom widgets.
  4. jQuery
    Write less do more. jQuery attempts to halve the amount of code you write compared to the traditional DOM JavaScript. With the chain concept, you can transfom ten lines of code with just one statement.
  5. Scipt.aculo.us
    If you're talking about effects, don't forget this one. It has a easy-to-use effects library.
  6. Moo.FX
    moo.fx is a superlightweight, ultratiny, megasmall javascript effects library, to be used with prototype.js or the mootools framework.
  7. Mochikit
    MochiKit is a highly documented and well tested, suite of JavaScript libraries that will help you get shit done, fast. We took all the good ideas we could find from our Python, Objective-C.
  8. Prototype
    Featuring a unique, easy-to-use toolkit for class-driven development and the nicest Ajax library around. It's also became codebase of other libraries.
  9. JavascriptToolbox
    If you need any other libraries, just visit this site.
  10. Jowo
    Finally, this is the best one for me. This is my own library. It's still on production but I have use it in many of my projects.
Why I wrote this post? The reason is that there are so many people confused of choosing which javascript library they are going to use. Why they are confused? Because they're looking for the best one. But unfortunately, there is no the best javascript library in the world. Trust me! Each library has weaknesses. So to get the best one, choose the most appropriate library for your needs. Read more...

Monday, August 24, 2009

How To Redirect AJAX Request

There are so many questions out there asking about how to redirect AJAX / XmlHttpRequest. It is usually needed when you provide user login page with AJAX. We ask user for username and password then we send the data to server via AJAX. Server validates user's data. If they are valid we want to redirect user to another page. That's what we want.

Unfortunately, AJAX cannot do that. Why?

AJAX (Asynchronous Javascript And XML) is a kind of asynchronous communication between client and server. The meaning of asynchronous is that the communication is closed after client sending the data. But it's not ending. Client is still waiting for server response. Once the response come, it is retrieved by callback function in client.

We can make an analogy by sending SMS to your friend. SMS is also a kind of asynchronous communication (while Phone Call is synchronous). When you finish sending SMS to your friend, your mobile phone actually stop sending data to your friend. But the phone is still waiting for the reply from your friend. You cannot know when your friend will reply. It could be in a minute, an hour or there will be no reply.

That's an example of asynchronous communication. So what the point?

In web-based communication architecture, if the data is sent asynchronously to server then the response will not be displayed in browser page. It will be passed to callback function that was set just before sending data. That's why we cannot redirect user with AJAX request. The redirection will only occur in server-side not in client-side.

So if we want to redirect AJAX request, it must be done by javascript on client. The server can just send back status message wheter login is failed or succeded. If success, change the page location by javascript. You can do this by this command
window.location = 'http://www.example.com';

Don't forget to leave a comment so I know that this post is useful to you.
Read more...

Wednesday, August 19, 2009

10 New Widgets on ExtJS 3

ExtJS is one of the best AJAX/Javascript library in the world. Although the number of its widgets is not as much as other libraries, the superiority of ExtJS comes from very nice user interface. Since version 3, ExtJS introduced several nice widgets. Here they are:

1. Row Editor Grid


When you double click any row on this widget, the row will change to a form and allow you to edit the value. Once you finish, you can click the update button or cancel any changes.

2. Progress Bar Pager


Besides visualizing the number of data that are being displayed, this plugin allows you to change the page by clicking on the progress bar instead of using arrow buttons.

3. Sliding Pager


This is the other one of Paging Toolbar plugins. User can change the page by moving the slider instead of typing the page value in text box. When you move the slider, it is snapped to page values.

4. Group Tabs


Vertical tabs group with a nice interface.

5. Toolbar Overflow


The previous versions of ExtJS didn't support toolbar resizing so if toolbar has many controls, they will be invisible when panel is resized. But it's not anymore now.

6. Tab Scroller Menu


Inspired by modern web browsers, ExtJS made a new feature that will make our life easier. User can navigate within many tabs opened at once.

7. Charts


I was surprised knowing that ExtJS includes chart library in this version. It's a good start though it still has a few of chart types.

8. Spinner


It's just an ordinary widget that is also supported in any other desktop application framework. May be ExtJS developers forgot to include this widget on previous releases.

9. Toolbar Button Groups


I think most of software developers who use ExtJS would be very interested in this widget. This widget mimics Microsoft Office ribbon toolbar that comes since Microsoft Office 2007.

10. Check Tree



This widget is usually used by many installers on desktop application.

Don't forget to leave a comment so I know that this post is useful to you.
Read more...

Tuesday, August 18, 2009

13 Best Web Chart Libraries

Few days ago, I got a project that requires to generate a lot of charts as output. And my client needs charts with a great visual. I knew some chart libraries but the visual is not so well so I thought my client wouldn’t be satisfied with it.

So I began to search and try another chart libraries and I was surprised coz I found so many libraries out there. Some of them are free, some are shareware. Don’t worry if you’re looking at the best free library coz there are several free libraries that are good enough. They have good UI and very simple/easy script to use. Check them here:
  • Open Flash Chart (Free) - This chart library is fairly easy to setup and has classes written in PHP, Perl, Python, Java, Ruby on Rails, and .Net to connect to the Chart.
Output: SWF Flash
Animation: Yes
Javascript Control: Yes
Charts: Line, Bar, 3D Bar, Glass Bar, Fade Bar, Sketch Bar, Area, Pie, Scatter, CandleStick

  • Flot (Free) - Flot is a pure Javascript plotting library for jQuery. The focus is on easy usage , attractive plots and interactive features. With Flot you can interact with the data, look at specific data by zooming in, plot a time series, and other various options.
Output: Canvas
Animation: No
Javascript Control: Yes
Charts: Line, Bar, Area

  • Flotr (Free) - Flotr is a javascript plotting library based on the Prototype Framework version 1.6.0.2. Flotr lets you create graphs in modern browsers with features like legend support, negative value support, mouse tracking, selection support, zoom support, event hooks, CSS styling support and much more.
Output: Canvas
Animation: No
Javascript Control: Yes
Charts: Line, Bar, Area

  • JFreeChart (Free) - JFreeChart is an open source Java chart library that makes it easy for developers to display quality charts in their applications. The JFreeChart project was founded seven years ago, in February 2000, by David Gilbert and is used by approximately 40,000 to 50,000 developers. JFreeChart supports many different output types that includes JPEG, GIF, PDF, EPS and SVG. This is a great resource for Java developers.
Output: JPEG, GIF, PDF, EPS, SVG
Chart: Line, Bar, Pie, Area, Scatter, Gauge


  • Visifire (Free) - Visifire (Powered by Silverlight) is a set of open source data visualization components. With Visifire you can create charts with ASP, ASP.Net, PHP, JSP, ColdFusion, Ruby on Rails. The charts can be just simple HTML or animated Silverlight Charts.
Output: JPEG, Silverlight
Animation: Yes (Silverlight)
Charts: Line, Bar, 3D Bar, Funnel, CandleStick, Area, Pie, Stock


  • ExtJS 3.0 (Free) - Since version 3, ExtJS includes chart library in its package. ExtJS supports some basic charts which can be configured via JSON.
Output: SWF Flash
Animation: Yes
Javascript Control: Yes
Charts: Line, Bar, Pie, Stacked Bar
  • PlotKit (Free) - PlotKit is a Chart and Graph Plotting Library for Javascript. PlotKit works with MochiKit javascript library. It has support for HTML Canvas and also SVG via Adobe SVG Viewer and native browser support. PlotKit also has great documentation.
Output: Canvas, SVG
Animation: No
Charts: Line, Bar, Pie, Area


  • JpGraph (Free & Commercial) - JpGraph is a Object-Oriented Graph creating library for PHP. The library is completely written in PHP and ready to be used in any PHP scripts (both CGI/APXS/CLI versions of PHP are supported).
    Output: JPEG, SGS
    Charts: Line, Bar, Pie, Ring, Field, Splines, Geo Map, Stock, Polar, Radar, Gantt, Impuls, Error, Scatter, Ballon, Canvas, Contour
  • AmCharts (Proprietary) - AmCharts are animated interactive flash charts. The charts include Pie Charts, Line Charts, Scatter/Bubble Charts, Bar/Column Charts, and even a stock chart. AmCharts can extract data from simple CSV or XML files, or they can read dynamic data generated with PHP, .NET, Java, Ruby on Rails, Perl and ColdFusion. All the charts are free but they have a link to AmCharts on the upper left.
Output: SWF Flash, WPF
Animation: Yes
Javascript Control: Yes

  • Emprise JavaScript Charts (Shareware) - Emprise JavaScript Charts is a 100% Pure JavaScript Charting Solution that requires no JavaScript frameworks. Emprise JavaScript Charts include charts with zooming, scaling and scrolling ability. Tested and works with all major browsers.
Output: Canvas
Animation: No
Javascript Control: Yes
Charts: Line, Area, Scatter, Pie, Bar

  • XML/SWF Charts (Shareware) - XML/SWF Charts is simple yet powerful tool to create attractive web charts and graphs from dynamic data. You can use any server-side script to gather the data and put it into XML. It supports many charts types,. These Charts have some great features like Animated transitions, Printable charts, and more.
Output: SWF Flash
Animation: Yes
Charts: Line, Column, Stacked column, Floating column, 3D column, Stacked 3D column, Parallel 3D column, Pie, 3D Pie, Bar, Stacked bar, Floating bar, Area, Stacked area, Candlestick, Scatter, Polar, Mixed, Composite and Joined

  • Fusion Charts (Proprietary) - FusionCharts is a cross-browser and cross-platform flash charting component that can be used with ASP.NET, ASP, PHP, JSP, ColdFusion, Ruby on Rails, simple HTML pages or even PowerPoint Presentations.
Output: SWF Flash
Animation: Yes


  • FlyCharts (Shareware) - FlyCharts is a set of Adobe Flash (SWF) files that gives you outstanding possibility to visualize your data. Using FlyCharts you can create compact, interactive and good-looking charts.
    Output: SWF/Flash
    Charts: Column/Bar, Line/Pipe, Pie, Area

Charts that use SWF is more preferred because they offer great visual and animation though every browser on client must has Flash Player installed. So it’s yours to decide which one is fit your needs.

If you know of any other charts, please post below.
Read more...