Chrome, HTML5, JavaScript, mobile, webdev

HTML5 & CSS3 Tools

I’ve meet with a very cool startup over the weekend. It was interesting to listen and learn from them what is ‘cool’ in their technology world. However, I got the feeling that they are missing some of the new capabilities that the web platform has to offer. I’ve pointed them to some known resources like: html5rock.com , MDN site etc’. But it seems better to try and get a list of tools or pointers that any developer could browse and pick from. So here is an alpha version of the list. It’s split to subjects like: design phase, testing phase etc’ just to keep it a bit more useful.

Continue reading

Advertisements
Standard
Chrome, HTML5, JavaScript, mobile, webdev

Chrome And HTML5 Updates

There are some very interesting technologies that are now available in Chrome. In this post I will try to cover some of them.

We know that Google started the Chrome project on the three ideas of speed, simplicity, and security. It’s still focusing on these important aspects while keep moving forward (fast) on implementation of many other HTML5 features. You can find Chrome on mobile, desktop, Chromebook and Chromecast. Let’s see what are the new, improved features we got these days as developers in Chrome platform:

Focus areas Chrome is moving forward

Mobile and Open Web Platform

We’re investing a lot of time to make sure mobile web experiences improve and that they are easier to develop!

  1. Build amazing mobile web apps
  2. WebGL, Web Audio, WebRTC, Web Speech and many more APIs that give you ‘native’ capabilities inside your browser.
  3. Vibration
  4. Device Motion
  5. WebRTC code lab (link) to check the new world of media (video/audio) in Chrome without plugins.

Continue reading

Standard
Chrome, HTML5, JavaScript, webdev

Raspberry Pi And Google Coder #socool

The Web is awesome and this week I had the pleasure to play with a new ‘face’ of the web platform. It’s built for Raspberry Pi and you can take it as far as your imagination will let you.

Coder

Coder is a very cool project that aim to be a simple way to make web stuff on Raspberry Pi. Short and sweet. It is also an experiment for Raspberry Pi that give you a free piece of software that turns a Raspberry Pi into a simple, personal web server and web-based development environment. Basically, all that you need, for crafting HTML5, CSS, and JavaScript.  Plus, it’s an open-source project so you could fork it and learn from the source on http://googlecreativelab.github.io/coder/ Continue reading

Standard
Chrome, HTML5, JavaScript, mobile, webdev

Google I/O 2013 – Mobile, Web and Cloud – The Triple Crown of Modern Applications

app_engine-256Can we had a better title for our talk? I’m not sure… But the description was along the lines of “…Ready to rock the world with your next application? Odds are you are thinking about mobile, web and the cloud.” So far… so good.

In this session we talked about building a modern mobile web application that takes advantage of the Google Cloud Platform. We touch on the powerful combination of the “mobile web AND the cloud” and in the process we tried to show the power of Google cloud endpoints and modern HTML5 apis. We built a fun little mobile web app “Pictureque” that give you the options to take photos (even on airplanes) and then share them with the world. Continue reading

Standard
Chrome, HTML5, JavaScript, webdev

Web Development – Some ‘Good To Great’ Tools

I’ve started to create a list of some great online tools that will help you (and me) in the next project. Some of the tools are helping to achive a certain effect (=gradients) while others are more a ‘hello world’ examples to hack around it in order to understand a new HTML5 API (e.g. HTML5 File API) and then harness it to your next web app. You might say it’s not a tool and you might be right. I guess it is more a list of resources that might help you get better at what you do.

If you got some other good sources please let me know… Here is the list:

Browser capability

Before you start your project you need to check what is the set of features and which browser will support them. There are few sites that will give you good answers. The lastest one is: html5please.us and other good sources are caniuse.com which include mobile browsers as well and mobilehtml5.org that is all about capability for mobile browsers.

JavaScript MVC frameworks

There is a new kid on the block – Thorax I like that fact that it is an opinionated backbone application framework. It is a combination of several tools:

Another framework that is worth the time to look into is: emberjs and Trello tech stack that is coming from the great dudes of ‘Fog Creek’.

If you wish to check what other options you have today – I would go to this site and check some of the most popular MVC framework that are out there.

Work and share javascript online

I also found myself using Simple JSON viewer in cases you wish to find out a specific parameter in a large JSON object.

Playing with CSS3

Libraries for Fonts

  • Google Web Fonts API – Google Web Fonts makes web fonts quick and easy to use for everyone, including professional designers and developers. We believe that there should not be any barriers to making great websites.
  • TypeKit – Simple, bulletproof, standards compliant, accessible, and totally legal fonts for the web.

Offline Libraries & Frameworks

  • ManifestR – a bookmarklet for creating an AppCache manifest file.
  • LawnChair – a library that provides a lightweight, adaptive, simple and elegant persistence solution.
For Mac Web Developers

    • LiveReload monitors changes in the file system. As soon as you save a file, it is preprocessed as needed, and the browser is refreshed. When you change a CSS file or an image, the browser is updated instantly without reloading the page.
    • CodeKit automatically compiles Less, Sass, Stylus & CoffeeScript files. It effortlessly combines, minifies and error-checks Javascript. It even optimizes images, auto-reloads your browser and lets you use the same files across many projects.

Mobile web development – Some good reads

It is far from being a full list – just a beach-head to start have a source for some tools that will make you more productive.

Standard
Chrome, HTML5, webdev

HTML5 Training Day (Mountain View) – Summary

Well, in the past month I was busy organizing this HTML5 Training Day for business web developers. You may want to stop and ask:
What Is HTML5 Training Day? So, our main goal is to have an open conversation with business web developers and to provide them with tools and knowledge to implement HTML5 features into their web apps. In this one day event, world-class experts talk about tools, tips and best practices in web development with focus on business.

It was a lot of fun and last week, we had in Google more then 24 companies that came to learn about the latest and greatest in the open web technologies.

We started the day with a short presentation that I gave on ‘The State of ChromeOS’. It’s amazing to see how fast is the pace and I suspect we are going to have a great 2012. After that (and two more cups of coffee) we got Pete LaPege (an excellent speaker, if I may) talking about: “HTML5 and new breed of web application” which aim to cover what defines a great Web App and show you how you can use HTML5 to create a new breed of web application that will delight and amaze your users.

Another cup of java and another web ninja: Mr. Eric Bidelman gave great talk with lots of demo on the ‘bleeding edge features in Chrome and the open web platform“.
and some HTML5 offline features. 

For the developers who wish to do ‘mobile first’ – we had a surprise from the snow country. Mr. Boris Smus (that build web stuff that make you – wow! for real) talking about A mobile web app technology stack. Here in his own words: “…Learn what it takes to build modern mobile web apps. We will start with the ideas of “adaptive apps” and “offline first”. Next, we’ll dive into some of the technologies, including MVC frameworks, templating engines, CSS frameworks, laying out views and multi-touch input. Finally, we’ll close off with mobile-specific tips and sweet demos.”

After Boris we had the pleasure to host David Kaneda (for the few that don’t know, David Kaneda is a creative web technologist. He created jQTouch, a jQuery plugin for mobile web development, and Outpost, the original iPhone app for Basecamp.) David gave another great talk on “Abstracting CSS for Complex Theming Systems.”

In the afternoon, Mr. Seth Ladd (The Michael Jordan of Dart) spoke about Dart and how it is a comprehensive effort to help app developers build complex, full featured, high fidelity apps for the modern web. He gave some nice short demos that showed the language, libraries, and editor of Dart.

Last but not least, Mr. Christos Apartoglou (The Chrome Web Store Chief) spoke about  Success stories in CWS. He talked about some bold success stories and showed what makes apps in the Chrome Web Store successful.

You can see the format of the day with the full descriptions of the talks over the public schedule that we kept for that day. It was a good tool to have a back channel (using the chat feature on the document) and to allow everyone to keep updated with the last minute changes. I hope to have some videos from that day public… I will post them here and on my G+ page.

See you all in our next Training day.

Standard