Chrome, JavaScript, webdev

Online Editors For Web Developers

One of the most powerful aspects of the web is the ability to share your ideas and work with others quickly.

Over the years, I tried several options to share code and do demos. It’s true that you can always start your own server and serve your site, but in many cases, you want to focus on your demo and not do administrative work again and again. Here are some tools that I enjoyed using and I still find myself returning to check them from time to time. In most of them you got a nice ability to move (even) faster and to use GitHub for your code. Continue reading

Standard
Chrome, JavaScript, webdev

Protect Your Website With HTTPS

TL;DR

  1. Create (for free) an SSL certificate.
    One resource for that is letsencrypt.org
  2. Install it on your website’s server: letsencrypt.org/docs/client-options/ – You just quickly choose the client that will match your server environment or do everything in your browser.
  3. Change all your website’s links from HTTP to HTTPS so that search engines are notified and users will get the HTTPS version.
  4. Go have a drink.

Why?

You should always protect all of your websites with HTTPS, even if they don’t handle sensitive communications. HTTPS helps prevent intruders from tampering with the communications between your websites and your users’ browsers. It might be a malicious attacker or legitimate (but intrusive) companies, such as ISPs or hotels that inject ads into pages. Your users will think that your site is ugly or worst because they can’t tell who is doing what to the pages.
If you care about your users, always protect them and serve them with HTTPS. It will also prevents intruders from being able to passively listen in on the communications between your website and your users. Another benefit we gain from HTTPS is the ability to work with new powerful web platform features: Continue reading

Standard
Business, webdev

How To Rapid Prototyping?

One of the strength points that startups got over big companies is the ability to run fast and try new things. That’s why it’s important to improve your prototyping abilities.

Rapid prototyping composed from quick iterations of these three steps:

  1. Prototype – Draw, sketch or code something that can be reviewed.
    Convert the description of the solution into mock ups that everyone can see and review. You should take into considerations what is the story that will drive the user interaction. What will be the best experience?
  2. Review – Share the prototype with stakeholders (=users, developers and designers) and evaluate whether it meets their needs and expectations. If you can, let them try it and watch what they are doing. Try to mimic the real world as much as you can. For example, if it’s a mobile web app, let users try it with 3G networks (or even 2G) and see what is working and what is not.
  3. Refine – Based on feedback and data that you collected, identify areas that need to be refined or further defined it in the prototype. Now jump to step #2 and see if the result improved or, like in some cases, they did not.

The key to a successful rapid prototyping is revising quickly based on feedback. You should say ‘no’ to a lot of suggestions and let the data leads you. This approach helps teams experiment with multiple approaches and ideas on their way to a new product. It also reduces the risk by putting everyone on the same page (or in this case, the same image).

What to Prototype?

Use the 20/80 rule.

As a starting point, you can impress your colleagues when you suggesting it… You can start by saying something like: “Let’s work with Pareto distribution“. At this point of the meeting, everyone will look at you with admiration.

But more importantly, it’s helpful – For real.

Focus on the 20% of the key functionality that will be used 80% of the time. You wish to showcase how your product will work and later how it will look like. So ignore all the ‘little’ features that are not part of these core functions.

Continue reading

Standard
Android, Chrome, mobile

Earn More Revenue With Firebase And AdMob

grow your userbase

Firebase is a mobile platform that helps you quickly develop high-quality apps, grow your user base, and earn more money. In the slides below, we will focus on the growth part. In other words, we will talk about ways to acquire and engage the right users at the right time.
There are several features that Firebase is giving developers out of the box in order to help with growth:

Continue reading

Standard
Chrome, HTML5, webdev

Accelerated Mobile Pages Tips

AMP description

TL;DR

AMP is an effort to build an open solution that would improve the mobile web experience for everyone. It is a new way to build web pages for static content that render fast (e.g. an article, a tasty recipe, blog post). AMP in action consists of three different parts:

  • AMP HTML is HTML with some restrictions for reliable performance and some extensions for building rich content beyond basic HTML.
  • AMP JS library ensures the fast rendering of AMP HTML pages.
  • Google AMP Cache can be used to serve cached AMP HTML pages.

amp-logo

Tips

Make sure that your AMP pages are valid

Continue reading

Standard
Chrome, mobile, webdev

From AMP To PWA

PWA 2016The slides from my talk today at Google IL office.
It’s all about building a great mobile experience for your users.
From AMP (=Accelerated Mobile Pages) as a starting point up to PWA (=Progressive Web Apps).
As a bonus, we also showed new APIs like: Payment API, One Tab Sign-in and Physical Web that expending the web even farther.

Continue reading

Standard