Wednesday, October 21, 2009

My Yahoo! Pipes

Hello people, this time I'd like to announce my first yahoo pipe, which consists on showing the last earthquakes in the world directly from the usgs.gov source. The pipe shows the last 50 strongest earthquakes in the last 7 days ordered by magnitud. They are located nicely in a world map where you can have a picture of how the world is shaking now. If you click on any feed it will redirect the browser to Yahoo News! related to that feed. It also show some thumbnails of YouTube videos of the regions where they occur:

Go to My Earthquakes Pipe

You can set the number of earthquakes to look for whether you want to see more or less feeds...

Enjoy it and start building yours very quick...
For more details about how the pipe was built you can see the source code at anytime. Basically it takes CVS/text data from usgs.gov (I found this data accessible in the catalog of data.gov, there are so many more to play with) and sets the fields to build each item feed. Then, looks for yahoo news with the region affected as keyword. Simultaneously, looks for videos in YouTube (or google, now it's the same) using the location information. Finally everything is mash-up to show the data in three tabs of a Yahoo! Pipe page.

Monday, September 14, 2009

More From Google

Dear Web Developers, you may find this tools interesting --> http://code.google.com/

They have Ajax APIs, Projects Hosting, tools, open source programs, Phyton & Java SDK's, and even more...

I haven't check it, but looks promesing...

SNOWBOARD TIME (HTML 1.0 Assignment)

Hi everyone, for the adventurer people that have asked me about snowboarding, finally I find the opportunity to publish something on the web, check it out --> lamp.cse.fau.edu/~rgiusti/MP1


Cutting-edge Web Technologies – Fall 2009
Mini-Project 1 – A basic Web 1.0 site using XHTML and CSS
Rafael Giusti

The site I chose to build for this assignment has the purpose to share my experience gained in one of my favorites activities, snowboarding. The information posted is intended to help people who are planning to take this fabulous adventure. This webpage idea came to me since many friends have asked me for that information, so I took this opportunity to publish it. From now on, I will refer to the webpage when they ask me.

The site consists on 4 .html files interconnected showing text information, some pictures and links to videos. I chose a design with light gray, blue and white colors, a background made of snowballs figures, and a header containing a picture of me in the snow mountain. I chose a standard menu that came with the original two columns css I picked up. At the end, my final .css was made from the mixture of two css. I had lot of text to show in the web page, that I wrote in the first step of my assignment, so I decided to split it. Some pages shows a list of sections where each item will expand to show text details when clicked, using Javascript. I also decided to put some videos I had previously loaded at Youtube to save more text to show.

I started working with Amaya, but didn’t work well on my mac laptop, so I used Aptana studio that works well. It has a nice interface with colors, embedded browser to see the current view of the webpage, and text predictor that helped me a lot when writing the code for html, css and javascript. It also has available a debugging interface, yet I tried to use it and couldn’t make it works.

The task that took me more time was editing the css. I learned that it is very important to chose one design that has to be exactly as you have in mind. My problem was that I couldn’t find it, so I decided to put my hands on the closest one. For example, I modified the header to put my own picture, replaced the background from another css, and transformed from two columns to one the design for one of the pages. All this took me a lot of time, mostly because of my inexperience with css. I think for next time I could make some css modifications faster. Another task that was time-consuming was the html validation. I spent lot of time fixing bad practices I was doing in my code. Hopefully, the validator comes with details about the errors, so I learned what the reasons of my code errors were.

An important thing to mention is that I was counting to put some embedded videos from Youtube (they give an option to copy an paste the code in any html file), but in the final step of my design the HTML 1.0 Strict validation didn’t pass because embedded objects are only available in HTML 5.0. I needed to keep these videos in my design so I tried using Javascript to add the embedded object code and it worked. This way I didn’t worry about memory usage in the server because of the videos, while at the same time my code met the HTML 1.0 strict validation required by the assignment.

Friday, September 4, 2009

Google Web Toolkit 1.7

Google provides a web toolkit to build and maintain web applications!!!
Let's take a look and see if works well like their other products... http://code.google.com/webtoolkit/

Starting Web Developers

New in the world of web developing?
This site will teach you everything from the beginning for HTML, XML, XHTML, Javascript, Ajax, PHP, SQL and so on...
Web Tutorials: www.w3schools.com

Remember that a good basis knowledge will make you understand advanced and complex code that you will find everywhere.
I'm working on that ;)
More code examples for AJAX...
FreeAjaxScripts.net
Per example, they have the code for on line "star rating" like you can see in Netflix, Amazon, etc etc...


Looking for FREE scripts to add fun functionality to your website ---> Check this out:
The Top 40 Free Ajax & Javascript Code for Web Designers

I tried the number 1 and 3 and works very well. The entire list looks interesting.

The first is a Lightbox script to overlay images in the current page.
The other is a Reflection script to create reflection effect to images.

I only downloaded the code and played making some changes, I still need more knowledge to add things like this to a website.

XHTML 1.0 / HTML 4.01 Tags Reference

> Show Table