Chrome, JavaScript, php, webdev

Google APIs On GDL Israel

Google APIsIn this week we spoke about Google APIs and how you can work with them from the client (e.g JavaScript) and from the server (in this case, it was with PHP but there are many more options).

The main link that you will want to start with is:¬†code.google.com/apis/console/ which give you the option to ‘activate’ which APIs you are going to use and later on each and every one of them you can click on the ‘question¬†mark’ and jump to a starting guide. Another good tool is the API-Explorer¬†which give you the option to test APIs quickly and see what each end-point will return. Continue reading

Advertisement
Standard
Chrome, HTML5, JavaScript, mobile, php, webdev

HTML5 APIs On Google Developers Live Israel

html5-cakeThis week we spoke about “Modern Web Applications Utilizing HTML5 APIs“.
Some of the things we covered:

  • Defining the modern web app
  • Designing a web app with a thought on all devices out there.
  • HTML5 Power tools/APIs
  • Google cloud endpoints and why it’s a great option to built your next powerful API.

Continue reading

Standard
Chrome, HTML5, JavaScript, webdev

Web Workers Intro On Google Developers Live Israel

Web Workers is a good way to improve the performance of your web applications. It’s not a new HTML5 API but for some reason not too many front end developers are using it. This short episode will give you the intro to why and how you can leverage this simple and powerful API to enter the world of multi threads in the browser. Continue reading

Standard
Chrome, HTML5, webdev

Google Drive on GDL IL

Here is my talk from last week with Nicolas Garnier (Developer Advocate for Google Drive) on the new aspects of Drive. You can have a short intro to drive and then dive into:

  • What are the key features developers should be aware of when working with Drive APIs. For example: all the Drive SDKs you can use with your¬†favorite¬†technology (e.g. Java, Php, Python etc’).
  • Show some new apps that are doing good job in integrating into Drive. We spoke about best practices¬†and OAuth2.0
  • Learn what is next for drive in the near future…

Psst…
If you want to see more GDL-IL episodes, feel free to ‘Add our show‘ to your¬†calendar. It’s going to take 15-25min of your time every WED at 14:00 Israel time (IST)

Standard
Chrome

Google I/O 2012 – Day 1

nexus q front sideI’ve took some notes during this packed day. I¬†apologize¬†if they are not ‘polish’… The main goal is to put them here asap and later (maybe, on my next 26h flight) work on them and make sure the wording is better.

Keynote take aways

  • Android – Nexus 7 looks like a great tablet. It’s in the right size and with many great apps that will shin on it. I hope to check it out soon specially as a reading device.
  • Nexus Q seems like powerful (and¬†beautiful) computer that make music/video more¬†social. The use cases are powerful and the ability to stream google music with a push of a button in your friends place – cool!
  • Google+ got event – finally we have a powerful mobile app that let you and your friends share photos together before/during/after events. I know several startups that are trying to solve this¬†challenge¬†and it’s going to be¬†interesting¬†to see what will happend in this space of geo-local-photo sharing apps.
  • Glass – Jumping from airplanes, bikes and some snapling on Moscone. What can I say? I want the roll Sergay is having these days… This video tell the story:

Web component Talk

  • Shadow¬†Dom – encapsulate stuff in the DOM.
    You can follow on it using Chrome DevTools (go to setting and click on ‘show Shadow Dom’) in the example of a video tag you will see all the ‘shadows’ that are behind the sense (e.g. some divs, buttons etc’)
    It’s important to rememeber that for every DOM element we can have Shadow DOM rendered instead.¬†We have here a rendering time¬†structure which can help developer write more efficient web apps that runs faster and smoother.
  • Custom element – meaningful tas to extend DOM objects.
    Use the new HTML5 < element >
  • Templates – clonable DOM for easy authoring

In Parctice we try to ‘tell’ the browser what we mean.¬†The declarative renaissance with web component will let developer to channel their intent to the web browser. It is giving developer CSS variables to custom components and define an api that other developers can leverage. It will let the community a way to share semantics and overtime we will see HTML envlolve due to popular use cases (e.g. x-poll tag).
Another important point is that declerative tags will run faster because the browser ‘understand’ them nativly.

Google Drive API

  • On ChromeOS you have today a strong integration with web applications like: Lucid Charts and Aviray. Both apps, are doing great job in their UI to use the user massel memory and make her productive asap. On the backend, they use google drive api to save your work.
  • You should use the google JS library and load the picker (in their drive example) and use it. It’s very easy and nice api to use.
  • Security – level of access (or scope). These level of access were very board… (scery) but now they have a new api (per file). Once you approve it (using OAuth2.0) the app will be able to access certain files.

Other great talks that I’ll fill in the details later are:

The Web Can Do That!?

The web is changing so quickly that it’s hard to keep up with what’s new in the platform. HTML5’s new capabilities allow developers to build a whole new suite of applications – things that were once impossible to do, are now a reality.

This session cover some of the bleeding edge of HTML5:

  1. media capture
  2. HTML5 file APIs
  3. Advanced usage of web sockets
  4. Media streaming.
  5. Device input
  6. CSS3 & multimedia.
  7. Modern CSS design.

Better Web App Development Through Tooling

Building a solid webapp is a challenge for all developers, but a plethora of tools have emerged recently to assist you. From starting boilerplates, to performance tuning and build tools, you’ll get a full overview of the tooling ecosystem. In this session, you’ll learn which mature and valuable open source projects can save you time as well as get answers to common questions in building a webapp.

Standard
Chrome, HTML5, webdev

New USB API & Bluetooth API In Chrome/ChromeOS

It seems that we are going to have some powerful new APIs on ChromeOS and Chrome in the future. From looking at chromium site¬†last month I’ve saw two new interesting proposal to new APIs that will make Chrome (even) better. The ability to ‘talk’ with hardware and external devices is very important and until today the way to do it (from a web app) was by using network. So there was no (real good) option to communicate with hardware and external¬†accessories¬†that do not support network (e.g Wi-Fi). These two new APIs are going to allow web developers with more power to build amazing apps that communicate with external devices. Think, smart¬†watches, GPSs, robots, Lego cars (my kids will love it!) etc’.

USB API

The USB API aims to provide access to fundamental low-level USB operations from within the context of an extension. Some use cases that might come to mind:¬†GPS, Watch, mobile phone or any other devices which require third-party drivers to work. One of the use cases for this API would be to provide the ability for a Chrome extension to function as a device driver and allow previously new devices to be used – is it cool or what? just think on the ‘old’ days where if you needed to talk with your specific hardware you were locked to write you native application for windows, mac and linux (and more if your users are there). In the new world, you will be able to write it once and run it everywhere… (where have we heard this sentence before? back in the 90s? Some technology that start with J?) One big question is if/when we could see this API being part of the web platform. I don’t really know. However, I do hope it will.

The APIs functions:

  • Locates an instance of the device specified by its vendor and product identifier -¬†chrome.experimental.usb.findDevice(
    integer context,
    integer vendorId,
    integer productId,
    function callback)
  • Performs a USB bulk transfer to the specified device -¬†chrome.experimental.usb.bulkTransfer(integer device,
    string direction,
    integer endpoint,
    string data,
    function callback) 
  • Close a USB device handle -¬†chrome.experimental.usb.closeDevice(integer¬†device,
    undefined callback)
  • Performs a USB control transfer to the specified device -¬†chrome.experimental.usb.controlTransfer(integer¬†device,
    string direction,
    string recipient,
    string type,
    integer request,
    integer value,
    integer index,
    string data,
    function callback)
  • Creates a USB context by which devices may be found -¬†chrome.experimental.usb.createContext(function¬†callback)
  • Disposes of a context that is no longer needed. It is not necessary that this call be made at all, unless you want to explicitly free the resources associated with a context -¬†chrome.experimental.usb.destroyContext(integer¬†context)
  • Performs a USB interrupt transfer to the specified device - chrome.experimental.usb.interruptTransfer(integer device,
    string direction,
    integer endpoint,
    string data,
    function callback)

* This API proposal was on March 7th, 2012. For more details check this proposal. After all we are dealing here with an open source project.

Bluetooth API

A bluetooth API that is on par with the Android and iOS APIs. Version 1 will support basic RFCOMM communication. Profile support will be left for a future version. As for the most common use cases we can think on anything that you are doing today on your mobile device (e.g. headset, stream video/audio etc’). One important aspects to pay attention (just like on mobile devices) will be to see how intensive the bluetooth API is in terms of making¬†your battery drain.

The APIs functions:

  • Accept incoming bluetooth connections by advertising as a service - chrome.experimental.bluetooth.acceptConnections(string uuid,
    string service_name,
    string service_description,
    function callback)
  • Connect to a service on a bluetooth device - chrome.experimental.bluetooth.connect(BluetoothDevice device,
    string uuid,
    function callback)
  • Close the bluetooth connection specified by socket - chrome.experimental.bluetooth.disconnect(BluetoothSocket socket, function callback)
  • Get the bluetooth address of the system - chrome.experimental.bluetooth.getBluetoothAddress(function callback)
  • Request a list of bluetooth devices that support service - chrome.experimental.bluetooth.getDevicesWithService(string service_uuid,
    function callback)
  • Get the local Out of Band Pairing data - chrome.experimental.bluetooth.getOutOfBandPairingData(function callback)
  • Check if this extension has access to bluetooth - chrome.experimental.bluetooth.isBluetoothCapable(function callback)
  • Check if the bluetooth adapter has power - chrome.experimental.bluetooth.isBluetoothPowered(function callback)
  • Read data from a bluetooth connection - chrome.experimental.bluetooth.read(BluetoothSocket socket,
    function callback)
  • Set the Out of Band Pairing data for the bluetooth device at bluetooth_address - chrome.experimental.bluetooth.setOutOfBandPairingData(string bluetooth_address, array of ArrayBuffer data,function callback)
  • Write data to a bluetooth connection - chrome.experimental.bluetooth.write(BluetoothSocket socket, ArrayBuffer data, function callback)
  • Fired when the availability of bluetooth on the system changes - chrome.experimental.bluetooth.onBluetoothAvailabilityChange.addListener(function(boolean available) {...your code...});
  • Fired when the powered state of bluetooth on the system changes - chrome.experimental.bluetooth.onBluetoothPoweredChange.addListener(function(boolean powered) {...your code...});

* This API proposal was on March 7th, 2012. More details can be found in the original proposal.

I know few startups that are waiting for these APIs that they would love to built interesting apps to use them. It’s going to be very interesting to see what new smart-watches, GPSs, Mobile devices etc’ will do with these APIs. Be strong & happy.

Standard
JavaScript, webdev

What Car Should I Buy? (Leveraging Hunch API and High Gear Media API)

Last weekend, when the kids were sleeping, I had a bit of time to try out Hunch API. I must say, it’s very cool/powerful API with good documentation. It goes without saying, that I wanted to check what will be a good use-case to our High Gear Media API. After checking around general stuff, I came up with this simple mobile app (ya – it’s work great on iPhone, Android, BB and even Palm). The application is asking you to type your twitter account and base on this account it gives you personalized, recommendations for cars that fit you best. It combine the power of Hunch with the vast automotive content of High Gear Media.

For best results, you should sign in to hunch with your twitter account and answer some questions. Then, once hunch built your taste graph this application will show your very ‘accurate’ results.

If you have an Adriod phone – you can install this application from this link: http://www.appsgeyser.com/getwidget/Cars+For+Me

You might want to try some other famous twitter accounts and see what is their best cars.

Drive safely and stay thirsty.

Standard
webdev

How To Work With High Gear Media RSS Feed In (less then) 4 Minutes


For all the girls that asked me time after time ‘How/Who/When/Why?’ and for all the ones that want to have on their blog the best automotive content around the web… This short code example will harness you with a knowledge to fetch High Gear Media customizable feed and have it on your site. The first thing you need to do in order to save yourself some leg work is to install Zend Framework.

Why reinvent the wheel, right?

The good people that work with Zend build for us some nice components that save us lots of work. For example, to parse an Atom (or RSS) feed – you should use their class and in few lines of code, you can be productive and happy.

After the installation, you can copy & paste the code below and you good to go.

<?php
/**
* @author Ido Green
*
* @since 04/01/2010
*
* @abstract Simple example how to fetch High Gear Media API (XML feed).
* You should have Zend Framework (1.9.4 and above).
*
* @see greenido.wordpress.com
*
* @copyright HighGearMedia INC. 2010
*
*/
// Set error reporting to ALL - Always good when you developing new features
error_reporting(E_ALL);
// Lets make sure we can find Zend Framework lib. (You might want to change it base on your local
// environment.
set_include_path(get_include_path() . PATH_SEPARATOR . "../");
// get the feed library
require_once 'Zend/Feed.php';
try {
$rss = Zend_Feed::import('http://feeds.highgearmedia.com/?sites=thecarconnection,greencarreports,allaboutprius');
} catch (Exception $e) {
echo $e->getMessage(); // In case something didn't work - lets see it.
exit (-1);
}
$feedItems = array();
// Loop through the items in the feed
foreach ($rss as $item) {
$itemElements = array(
'title' => $item->title(),
'description' => $item-<description(),
'link' => $item->link(),
'pubDate' => $item->pubDate(),
'author' => $item->author()
);
array_push($feedItems, $itemElements);
}
echo "\nThe HGM feed we got:\n";
// dump all items
var_dump($feedItems);
// In case some other process want to check if we finished correctly.
exit(0);
?>

The feeds can be fully customize according to your interested topics. For example:

Please feel free to share you experience using the comments.

Standard