| <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN"> |
| <HTML> |
| <HEAD> |
| <META HTTP-EQUIV="CONTENT-TYPE" CONTENT="text/html; charset=utf-8"> |
| <TITLE>Meteozoom -- Interview with Mauro Cioni</TITLE> |
| <META NAME="AUTHOR" CONTENT="Ruth Kusterer, Mauro Cioni"> |
| <META NAME="description" CONTENT=""> |
| <link rel="stylesheet" type="text/css" href="../../../netbeans.css"> |
| |
| </HEAD> |
| <BODY> |
| |
| <h1>Meteozoom — Interview with Java Developer Mauro Cioni</h1> |
| |
| <img src="../../../images_www/articles/interviews/mauro2.jpg" border="1" align="right"> |
| <h3>Who are you? Tell us something about yourself!</h3> |
| <P><BR></P> |
| |
| <P>My name is Mauro Cioni, I am 35 and I graduated in Computer Science |
| Engineering in 1996.</P> |
| <P>Currently I work in a software/consultancy company in Italy, where I am a |
| software architect for complex web applications; I also follow the |
| early stages of development to help others to start projects in the |
| right way.</P> |
| <P>I live on my own, and I devote a fair part of my free time to cycling |
| (both MTB and on the road), skiing, playing basketball and hunting |
| mushrooms.</P> |
| |
| <h3>Have you developed web portals before?</h3> |
| <P><BR></P> |
| |
| <P>Most of the jobs I do in my company is to design web sites/portals, mainly |
| on the intranet side. Sometimes I deal with portal products, but often |
| we start from scratch and integrate the customer’s existing |
| applications and services into our solutions.</P> |
| <P>Anyway, <a href="http://www.meteozoom.it">meteozoom.it</a> |
| (and its siblings meteozoom.com and meteozoomblog.it) |
| are being developed on my own, completely outside from my job. |
| They’re definitely hobby works, developed in my spare time. I wish I |
| had more time for this, because I’ve got many ideas but little time.</P> |
| |
| |
| <h3>How did you get the idea for Meteozoom?</h3> |
| <P><BR></P> |
| |
| <P>I’ve always been curious about weather and what the weather was like |
| around the globe, so I started looking at webcam pictures on the |
| internet as soon as they became available.</P> |
| <P>Then I started thinking that maybe it would be interesting to collect |
| these pictures on a regular basis for a further analysis in the |
| future, and for creating short movies of the weather evolution over |
| time.</P> |
| <P>At first I started by writing a small Java program that could read |
| pictures over the net and store them on the local disk, which was |
| running (and still runs) on a server permanently connected to the |
| internet.</P> |
| <P>This went on for years (from 2003 to 2005) then, when I started owning |
| tens of CDs of backup data I started wondering what I was storing |
| them for and why.</P> |
| <P>So the idea of putting everything on a website was the logical |
| consequence, and 2 years ago the first version of meteozoom.it came |
| to life.</P> |
| |
| <div align="center"><p><img src="../../../images_www/articles/meteozoom/meteozoom.png" border="1" /></p></div> |
| |
| <h3>And do you really store all webcam pics up to one year ago?</h3> |
| <P><BR></P> |
| |
| <P>I actually store pictures up to more than 3 years ago (november 2003).</P> |
| <P>At first I only saved pictures of a few places around where I live |
| (including a beautiful webcam on the top of |
| <a href="http://www.meteozoom.com/faces/EveryPlace.jsp?id=570">Monte Cimone</a> in the |
| Appennini, which I crawl every minute – |
| <a href="http://www.meteozoom.com/faces/faces/EveryPlace.jsp">search for “cnr”</a> to see it).</P> |
| <P>Every |
| picture is online on the server’s local disks and the collection is |
| continuously increased.</P> |
| |
| <h3>What was your goal, which features were most important to you?</h3> |
| <P><BR></P> |
| |
| <P>My goal was to make a huge collection of webcam pictures available over |
| the net; this was quite exciting, because as far as I know nobody is |
| collecting this kind of data and, since past is past, nobody will |
| ever have the pictures that I own.</P> |
| <P>I wanted people to be able to check what the weather was like in a |
| place on the world in a particular moment of the past.</P> |
| <P>Ease of use was my first goal, even if I am not too good at writing user |
| interfaces. Then comes speed, because dealing with millions of |
| pictures on a home PC is not that efficient.</P> |
| <P>A parallel goal was of course to have everything working at the lowest |
| cost possible, so the whole “architecture” is on a couple of PCs |
| in my home, running all open-source software.</P> |
| <P>To tell the truth, the first strong push to my development of the web |
| interface came when Creator (version 1) came to life, because I |
| didn’t want to implement all of the request/response Java code on |
| my own (I know from my job experience that it takes a long time and is always error prone).</P> |
| |
| <h3>Which tools (software, database, servers) did you choose, and why?</h3> |
| <P><BR></P> |
| |
| <P>The web server machine is a single |
| Pentium 3 with 1.3Gb of RAM and 4 hard disks (which are almost 900GB |
| of space in total). It runs Linux Fedora Core 6, with Apache |
| Tomcat 5.5 as application server and Awstats for web statistics</P> |
| <P>The database server is a single AMD Athlon XP+ with 1Gb of RAM. It runs Linux |
| Fedora Core 6 and MySQL 5.1 |
| </P> |
| <P>The pictures crawling machine (the PC which explores and saves the webcam |
| pictures) is a single Pentium 2 with 192Mb of RAM, and DSL Linux. The |
| crawling application is a multithreaded real-time Java application</P> |
| <P>Internet connectivity is guaranteed by my home DSL connection, which only has |
| a 384kbs upload speed (this is the main reason for the site's slowness). |
| </P> |
| <P>As you can see the “production” environment is very old and quite |
| slow, but I can guarantee that from the local network it’s much |
| faster than from the internet, so the DSL connection is the main |
| bottleneck. That's why I plan to upgrade to an upload speed of 1Mbs very soon.</P> |
| <P>The development machine is my laptop, running Windows Server 2003 and |
| MySQL (among other things).</P> |
| <P>My development tool is <a href="https://netbeans.org/features/web/web-app.html">NetBeans |
| IDE 5.5 with Visual Web Pack</a>; among other |
| libraries I use Hibernate, many of the Jakarta Commons libraries, |
| Log4j.</P> |
| <P>I upgraded to IDE from Creator in September 2006 (I think), while |
| the first versions were written with Creator 1 and then Creator 2.</P> |
| |
| <h3>Was it difficult to migrate from Creator to NetBeans IDE?</h3> |
| <P><BR></P> |
| |
| <P>Well ... it was not very straightforward. |
| At first I tried to simply update my project using the |
| <a href="https://netbeans.org/kb/55/vwp-migration.html">upgrade procedure</a> |
| described on the site. This seemed to work, but then I started having |
| problems using the visual editor and other issues here and there.</P> |
| <P>After some time I decided then to create a VWP project from scratch and |
| copy the single pages/JSPs into it by hand. |
| Since then, everything is working great.</P> |
| |
| <h3>What challenges did you encounter while working?</h3> |
| <P><BR></P> |
| |
| <img src="../../../images_www/articles/interviews/mauro1.jpg" border="1" align="right"> |
| <P>The main challenge is speed, second is speed, and then speed again.</P> |
| <P>I handle more than 9 million records in a single MySQL table, and I do |
| database searches using a low-end PC, so optimizing for speed is |
| quite challenging. |
| Currently I am working on a mechanism of searching pictures at regular |
| intervals of time, which makes the queries even slower (due to a |
| limitation in MySQL's store procedure and in Hibernate's handling of |
| them).</P> |
| <P>Another thing I try to have in mind is simplicity on the interface side. At |
| first I used to have a single page with all of the search parameters |
| in it, but it was very confusing so I tried to separate simple |
| searches from expert ones.</P> |
| <P>Another issue is protecting my pictures from easy stealing from the outside...</P> |
| <P>On the technological site, I have to mention some difficulties I found |
| in understanding some strange life cycle of JSF elements (which I |
| don’t understand completely yet).</P> |
| |
| <h3>How did you solve these difficulties?</h3> |
| <P><BR></P> |
| |
| <P>On the speed side, I use the fastest MySQL engine which does a great |
| work I must say. Hibernate caching also gives a hand in speeding up |
| things.</P> |
| <P>For protection of my precious pictures, I use encryption on the URLs |
| (which should make it impossible to infer a new picture URL from its |
| place/date) and I copy a picture to a temporary area before allowing |
| the user to download it.</P> |
| <P>For the user interface, I separate beginner’s functionality from advanced |
| one, I tried to put help hints where possible, and use AJAX to make |
| the interaction smoother.</P> |
| <P>The small availability of components in the first version of Creator was |
| solved by... waiting for the release of new ones, which in fact happened |
| soon after.</P> |
| <P>Google Maps integration is done not by using the Netbeans-provided |
| component, but by generating Javascript code dynamically “by hand”.</P> |
| <P>I had many minor problems to solve while developing, but I must say |
| that the developer community on the SUN developer site helped me most |
| of the times (and I helped others in some cases)</P> |
| <P>To solve the Javascript issue I had to use an inelegant workaround that |
| includes hidden fields, bean properties and use of Javascript’s |
| <code>eval()</code> function.</P> |
| |
| <div align="center"><p><img src="../../../images_www/articles/meteozoom/meteozoom-google-map.png" border="1" /></p></div> |
| |
| <h3>What would you like to see improved in the IDE to make your work easier?</h3> |
| <P><BR></P> |
| |
| <UL> |
| <LI><p>Include more powerful AJAX components.<p> |
| <p>The poorness of the very first version of Creator (mainly on the web |
| components) didn’t help much, while now I honestly have to |
| mention that the AJAX components that you can integrate in the IDE |
| could be more complete.</P> |
| <P>For example, the Google Maps component doesn’t allow doing many of the |
| things one may need, and so does the AJAX text component (which I use |
| anyway).</P> |
| <LI><P>Better |
| explanation of some advanced mechanism, like the “immediate” |
| attribute of visual components, the difference between <code>prerender()</code> |
| and <code>preprocess()</code> methods, the use of validators and converters |
| (which I still don’t know how to use...)</P> |
| <LI><P>Include |
| some facilities to deal with client-side Javascript (for example, |
| it’s not easy to dynamically create client side Javascript code)</P> |
| </UL> |
| |
| <h3>How did you implement the Italian / English localization?</h3> |
| <P><BR></P> |
| |
| <P>By using the Java locale mechanism and the Netbeans’ localization |
| bundle editor.</P> |
| <P>I did not use the NetBeans internationalization wizard because it seems |
| not to work for JSPs, and most of my strings where declared in JSP |
| files and not Java sources.</P> |
| |
| <h3>How long did it take to implement the current alpha version?</h3> |
| <P><BR></P> |
| |
| <P>I do all the work in my spare time so it’s quite hard |
| to tell... What |
| I can say is that I am working on meteozoom.it (both the website and |
| the backend crawling application, in proportion of 95%-5%) since late |
| 2004 I think.</P> |
| <P>As I probably work on it for an average of 3-5 hours per week, maybe a |
| good figure of the overall developing time was around 500 hours. |
| This does not include the time I spent learning how to use Creator 1 |
| (and then 2 and then VWP), which was completely new for me at that time.</P> |
| |
| <h3>What is the coolest event you have caught on webcam?</h3> |
| <P><BR></P> |
| |
| <P>I don’t have much time to navigate all the pictures I have, but |
| <a href=" http://www.meteozoom.it/faces/SpecialEventsList.jsp">some |
| things I caught</a> include a lunar eclipse seen from Italy, some very |
| beautiful sunrises and sunsets, the arrival of a stage of the Giro |
| d’Italia (the famous bicycle tour) on the top of Passo dello Stelvio |
| last year, some climbers on the top of Mount Aconcagua in Chile |
| waving hello to the camera.</P> |
| <P>I would really like people to help me in finding interesting things |
| caught by the webcams, as I would love |
| <a href="http://www.meteozoom.com/">help in finding new webcams</a> to |
| crawl. (Click "post a webcam" at the top of the page.)</P> |
| |
| <h3>If you could start the portal over, what would you change?</h3> |
| <P><BR></P> |
| |
| <P>I have to say that I have gone through a heavy restyling 6 months ago, |
| which introduced Hibernate for database connections and applying a |
| strong change to the user interface, so I wouldn’t change many |
| things.</P> |
| |
| <P>I can summarize what I would like to do in the near future:</P> |
| <UL> |
| <LI><P>The |
| ability to create movies on the fly from the pictures</P> |
| <LI><P>Integrate |
| some weather forecast service with my site</P> |
| <LI><P>(This is a dream:) |
| A mechanism to automatically find webcams around the |
| world without having to add them manually. I think this is almost |
| impossible by now, I would need a standard for webcam hosting sites.</P> |
| </UL> |
| |
| <h3>Do you have tips for NetBeans users who want to create a web portal?</h3> |
| <P><BR></P> |
| |
| <UL> |
| <LI><P>Try |
| and write good Java code using the provided tools -- mainly |
| refactoring facilities, beans creation tools for adding properties |
| and fields.</P> |
| <LI><P>Design |
| the web interface using the VWP visual editor for 99% of the job, |
| but then adjust the final settings on the generated JSPs directly |
| -- for example for component styles.</P> |
| <LI><P>Sometimes |
| the editor doesn’t deal perfectly with JSP Expression Language, so |
| try and edit it manually if you think something is not working as |
| expected.</P> |
| <LI><P>Study the |
| <a href="http://wiki.netbeans.org/wiki/view/NetBeansVWPUserFAQ#section-NetBeansVWPUserFAQ-ProcessingAndLifecycle">JSF |
| component lifecycle</a> as implemented in Netbeans; might be hard at |
| first, but then it results to be very powerful.</P> |
| <LI><P>If |
| coming from plain ASP/JSP request/response programming model, try |
| hard to think in terms of visual components, actions and events. You |
| can really write web interfaces pretty much like you work with |
| client interfaces and this is very very powerful.</P> |
| <LI><P>Netbeans |
| <a href="http://wiki.netbeans.org/wiki/view/VwpFAQDBUpdate">data provider</a> |
| mechanism is really great; I suggest not to use it for |
| direct JDBC data access when dealing with large data sets.<BR>Instead, |
| use the adapters to access data served by data-access frameworks, |
| like Hibernate. This acts as a clear and very good separation |
| between user interfaces and data layer.</P> |
| <LI><P>Study |
| and work together with other developers through the |
| <a href="https://netbeans.org/community/lists/">forums</a>, they’re great.</P> |
| <LI><P>Make |
| good use of init() and destroy() methods, they’re great for |
| avoiding database connection leaks that I used to have. |
| </P> |
| <LI><P>Download and learn the |
| <a href="https://netbeans.org/features/java/profiler.html">NetBeans Java Profiler</a>, it really helps in |
| understanding where and why code is behaving badly.</P> |
| </UL> |
| |
| <h3>Mauro, thanks for sharing your experience!</h3> |
| |
| <p>PS: |
| |
| Mauro is currently working together with the <a href="mailto:raveqa-testapps@sun.com?subject=Migrating to NetBeans Visual Web Pack" |
| >Visual Web pack team</a> to be one of the first to migrate his web application to NetBeans IDE 6.0. |
| We plan to post a follow-up interview with Mauro |
| about the final version of his web portal. It will include more real-life |
| tips and tricks for web application developers, so check back here soon! </p> |
| |
| |
| <h2>Related Links</h2> |
| |
| <p>How's the weather? See for yourself at Mauro's web portal |
| <a href="http://www.meteozoom.com">meteozoom.com</a>. |
| New feature: Create a video from a row of pictures and watch the weather change.</p> |
| |
| <h3>NetBeans 6.0 Web & Java EE Development</h3> |
| |
| <ul> |
| <li><a href="https://netbeans.org/kb/60/web/creator-migration.html">Tips for Migrating Java Studio Creator 2 Update 1 Projects to NetBeans IDE 6.0</a></li> |
| <li><a href="https://netbeans.org/kb/60/web/vwp-migration.html">Tips for Migrating NetBeans Visual Web Pack Applications to NetBeans IDE 6.0</a></li> |
| <li>Do you need further assistance with migrating from Sun Studio Creator to NetBeans Visual Web pack? |
| <a href="mailto:raveqa-testapps@sun.com?subject=Migrating to NetBeans Visual Web Pack" |
| >Ask us!</a></li> |
| </ul> |
| |
| <h3>NetBeans 5.5 Visual Web Pack</h3> |
| |
| <ul> |
| <li>Are you looking for a free visual web application development tool? |
| <a href="https://netbeans.org/features/web/web-app.html">Download the Visual Web pack</a> |
| for NetBeans IDE.</li> |
| <li>Do you have questions about visual web application development? Read the |
| <a href="http://wiki.netbeans.org/wiki/view/NetBeansVWPUserFAQ">Visual Web pack FAQ</a>.</li> |
| <li>Ready to create the web application of your dreams? Follow the |
| <a href="https://netbeans.org/kb/55/vwp-index.html">Visual Web Pack Learning Trail</a>.</li> |
| <li>Share your experience and hear what others have to say about NetBeans Visual Web |
| development: Visit <a href="http://visualweb.netbeans.org/">NetBeans Visual Web Project</a>, |
| sign in with your NetBeans username, and sign up for the |
| <a href="https://netbeans.org/projects/visualweb/lists">NetBeans Visual Web users</a> |
| mailing list.</li> |
| </ul> |
| |
| |
| </BODY> |
| </HTML> |