Moving private repos to bitbucket

As much as like github for repos - I didn't feel it was *yet* worth to pay the monthly fee to get unlimited private repos. So I decided to move all my private repos to bitbucket, which is free!

If you ever need to do the same, here's a link that explains it really well:

http://befused.com/git/github-bitbucket-move

Chrome dev tools - secret weapon?

When I started working back in 2010, we used to support IE7. I still remember how much of a paint it was to debug javascript code. With IE8/IE9 debuggers, what I learned is patience, rather than figuring out how to fix all those weird bugs that *always show up *only in IE. The debuggers were so slow. Also back then, firebug was the norm. Chrome dev tools was relatively new and most people I knew did not use it. I liked Chrome so I sticked with it. Now, it's a tool that I use almost every day. In fact, I try to spend some time and follow what's new with the dev tools. I also spend some time experimenting with soon to be features/apis on Chrome Canary. This year, well last year... (2016), I've been pretty busy and haven't had much time to look at the new features. But today, I spent a few hours catching up on the last Google I/O and watch what's new with the dev tools. I wanted to share this link and give back some love to the chrome dev tools by writing this post.

https://developers.google.com/web/updates/2016/06/devtools-digest?hl=en

css position: sticky

This links highlights what's new in Chrome 56:

https://developers.google.com/web/updates/2017/01/nic56?utm_source=frontendfocus&utm_medium=email

One cool thing amongst others (bluetooth access is also cool but this one css feature is something I wish we had a while back) is position:sticky.

It's available in Chrome 56 (stable as of Jan 2017) and to summarize, it allows to fix an element into the viewport when it's within a threshold.

.header {
 // Element will be "fixed" when it is 10px from the top of the viewport
 position:sticky;
 top: 10px
}

You could set top : 0; to make it stick directly to the top of the viewport.

Have to be conscious that this positioning might not be available in other browsers as of yet.

There's this site I use to check what's available: http://caniuse.com/#search=sticky

As of now, it's not available in IE (not very surprising...)

Git bisect

Ever used git bisect?!

https://www.metaltoad.com/blog/beginners-guide-git-bisect-process-elimination

async promises in a sync way?

This blog post title is pretty confusing - but if you get to read this blog post by Google, it actually makes sense.

It's actually pretty cool. Not that I don't like callbacks or promises, but I can see this being useful in more complex examples.

async function fetchDogPics(url) {
  try {
    //this looks synchronous but it isn't...
    const response = await fetch(url);
    await response.text();
  } catch (err) {
    console.log('failed', err);
  }
}





Enums in Javascript

Found this tiny library that implements Enums in JavaScript:

https://github.com/rauschma/enumify

npm install enumify

Babel syntax highlighting for Sublime 3

In case you are looking for an ES6 syntax highlighting in sublime, check the babel-sublime project. Here it is: babel-sublime