This is EMBARRASSING

There are blogs in draft state. While I want to share about many things. I am not able to proceed with that. Why?

No Discipline

When a thought arises, I just pull out mobile and put the title for the post using the WordPress app and save it as a draft. Then I forget about it. I sincerely don’t have any sort of discipline. It is embarrassing.

YouTube Addiction

I closed my Facebook account a year ago; hoping that I will invest that time elsewhere. That elsewhere was YouTube. While I started following channels which help in my skill set. I slowly started slipping into areas of YouTube which does not add any value to my life, but rather give the ability to brag about things with people which they are not interested. Living in India, following the U.S. Presidential Election does not help anyone here. It was informative (to an extent) but mostly fun to watch. Kind of realized politics is politics everywhere. Presidential Elections are always important, but the amount of pun and fun people have with that is more than the actual election itself.

Started following someones vlog. Why!? Why!? – I don’t know, something addictive in watching how others lead their life. There are some useful stuffs, I wouldn’t deny that.

I am not going to stop it, rather put it last in priority and have a time box.

Procrastination

The biggest problem. The beauty about procrastination is – it doesn’t matter how many articles you read / watch video about procrastination; unless you take the step you are not going to move anything. Yes obvious, tell me about it.

OSMC On Raspberry Pi2

OSMC – An Open Source Media Centre which is available for Raspberry Pi 2. This can turn your old TV into a smart one, as long as your TV has a HDMI port. I have been playing around with OSMC a bit and I liked its capabilities. In no way I am going to be comparing this with Chromecast / Apple TV / Any other casting devices. This is purely to see the capabilities of OSMC or at least whatever I could explore.

IMG_20150705_122414

Hardware Requirements

Here is the list of items that I had required to set it up

  • Raspberry Pi2 (duh!)
  • A micro SD card reader / writer. Fortunately I had one with me
  • A micro SD card (Class 4 or above preferably)
  • A HDMI cable – I bought this one from Amazon
  • Internet Access – via an ethernet cable / a Wifi Dongle – There was a Wifi dongle which was not being used.
    • I would still recommend an ethernet cable, as the WiFi dongle is going to take the juice from the 5v power supply of the micro USB. So I had a problem the first item I booted with the dongle. I had to disconnect it from the device, post the OSMC installation, things were fine. I did not have to unplug it at any point.
  • A micro USB charger for the power supply
  • An Android / iOS device – this will be your remote control for the media center
  • A keyboard – It is required for the first time setup; after which I did not really see the need of it.

Setting it up

This was quite easy. The NOOBS from the official Raspberry site has OSMC OS which can be installed along with another OS. However it doesn’t contain the latest version of OSMC, so I went ahead and downloaded the latest version from the OSMC site [1]. Flashing the OS to the micro SD card was simple; the steps are straightforward as mentioned in their site.

Once done, put the micro SD card into Raspberry Pi2, plug in only the required stuff and boot it up. Your TV should now show an installation screen of OSMC. At this point do not connect any un-required peripherals as this might come in the way of installation; which was the case for me.

Post installation, it will prompt you to configure the internet, either wired or wireless connection. I had went for wireless connection and this is the only point where the keyboard was required. Once you are connected, you would need to enable the following services

  • UPnP – Universal Plug and Play basically it can connect to any UPnP server and take media from that.
  • Webserver – This is required in case you want to access the OSMC through a browser
  • Remote Control – Enabling this feature will let Android or iOS based device control your OSMC
  • Zeroconf – This is important, by enabling this feature the OS publishes itself so that any remote can listen and get attached to it
  • AirPlay – Yes, thats right AirPlay is available, so iOS based users can enable this.

The Remote

There are number types of remotes which it supports, you can check it out at KODI site[2] and the chances are your existing remote control can be used. I went ahead and used my Android phone and iPad mini as the remote control. And I believe any HDMI-CEC remote can be configured as per the forums.
I used Kore[3], an official app available for both Android and iOS. There are other third party apps, I encourage you to try others as well. I have been sticking with Kore for Android. Connect to the same network of as your RPi and then Kore will be able to detect your device automatically. From that point your mobile / tablet becomes the remote.

Features

There are many, however I had got the time only to experiment few.

Videos

Youtube

Under the videos, you can install add-ons. One of the add-ons is for youtube; installed it and signed in. Now all my subscriptions were available. There is a lot of things which can be controlled in the add-on; the interface was not super intuitive  but I was able to adapt to it after a while. I was able to play video’s at 720p but 1080p was not available for some reason.

IMG_20150705_122458

External Disk

I have an external disk loaded with movies. Attached it to the USB port of the Raspberry and made the necessary configuration to treat the folder as a movies library. And what happened next was cool, just by looking at the folder names, files names it went to the movies database, got a nice little poster, included the genre, cast and basic plot of the movie. The videos section looked alive and so did my mobile. From there on all I had to do is just tap on the movie I am interested and it starts playing.

Best Part: So me and my family sat down to watch a movie and they insisted they wanted subtitles for the movie. No problem, went to the add-ons there was a subtitle add-on. Installed it, and it got the subtitles for the movie in more than one language. Selected the language I was interested, it downloaded and synched it with the movie. That was mind blowing.

Others

AirPlay – My experience with AirPlay was not smooth, mirroring is not supported; I am working with release OSMC 3.

UPnP and NAS – Universal Plug and Play and Net Attached Storage is also an option available to stream media. I have not tried either of them.

Conclusion

All in all, the experience I had was good. No major complaints, there were certain hiccups here and there but I was able to get around. For a free open source OS this is really great. Caution – this is not meant for everyone. You need to understand that the media center is raw – which is wrapped around with a nice UI. This means if you have to get it working with its full potential you need to be little geeky. I have just scratched the surface of it, I will leave you with the OSMC wiki[4] for further read.

References

  1. OSMC Download Page
  2. Remote Types
  3. Smart Phone Apps for Remote
  4. OSMC Wiki

The Taste Of Raspberry Pi 2 Mod B

Intro

Definitely not a pie made of raspberry. It is a personal computer. …. in the size of a credit card …. and inexpensive. No really, it is in the size of the credit card.

You might have already heard about it through various sources or you could be a person who is already owing one. Either ways this post is going to be about some basics and my personal experience. Specifically with the Raspberry Pi 2.

As I understand it, the main purpose is to educate kids on programming. Said that, I found through resources that people have used it to bring out their creativity. What is a Raspberry Pi [1] on the official Raspberry site talks more about it.

Now it is not a full-blown computer. The peripherals like mouse, keyboard and monitor does not come along with it. It is like the CPU (Central Processing Unit) box you would have seen in the desktop world. Of course there is some investment around the other peripherals but that’s the idea, you might be already owning some of it and it is a just matter of re-usability and personal choice.

BTW, Raspberry Pi is not the only player out in the market, there are others similar products as well; but I am leaning towards Raspberry Pi.

Specs

Raspberry_Pi_2_Model_B_v1.1_front_angle_new

It has a Quad Core ARM processor (ARM: is the processor most mobile phone has) and 1 GB RAM.

Has 4 USB ports, 1 HDMI, 3.5mm Stereo output, a Ethernet port, a micro sd card slot (micro sd; will hold the OS) and the power supply is through a micro USB. There is also a camera and display interface. On top of all this there is 40 pin GPIO (General Purpose Input Output). Detailed Specs is available in their site [2].

Yet, I think it is important to understand some gotchas as well; so that you can get the right stuffs to get the full setup.

  • Power supply – if you have a mobile charger which is micro usb and planning to use as power for the unit, check the volts and amps before plugging in. I have read in certain forums and learnt that power variations does cause the device to behave a little weird.
  • Connectivity – It does not have a built-in Wi-Fi, however USB Wi-Fi dongle is supported and of course Ethernet port is available.
  • Micro SD – You need a micro SD card class 4 preferably. One SD card can have multiple Operating Systems (OS). So if you want to have multiple OS in the same SD card, go for one with some extra gigs.
  • HDMI cable – For folks who are planning to use this with a monitor and not a television; you need the right converter cable.  Keep in mind HDMI supports both video and audio. However don’t expect sound to be played out of the box, while using it with a monitor unless the monitor supports HDMI directly.
  • Hard disk – If you own a hard disk and try to plug in, you are probably going to run into some problems. This is because, the whole unit is powered by a mobile charger of 5v which will not be sufficient for the hard disk power. So if you have a hard disk which has a separate power cord; use it and power it using the USB port of your tv or laptop.
  • Case – You might also want to invest on a case for the unit. What I have realised is at times the unit feels delicate while connecting and disconnecting peripherals. Or go ahead and create own on your own case 🙂

Operating Systems

There are at least 7 OS to my knowledge which are officially supported by vendors. The default and recommended one is Raspbian. Windows 10 (IoT – Internet of Things) is the Microsoft version available for Raspberry Pi 2.

If you are looking for multiple OS on the same micro SD card, do check out NOOBS[3].

There are enough resources for each OS, however in my next post I will be focusing on OSMC; a media centre.

(My) Goals

  • Check the media centre specific OS and feel its glory. So far whatever I have experienced with OSMC is mind blowing and I am loving it – There were some hiccups while setting up, which I will share in the next post.
  • Programming – This requires a ramp up for me on Linux and Python; and that is what I will be doing.

Reference Links

  1. What is Raspberry Pi
  2. Specs of Raspberry Pi 2
  3. New Out Of the Box Software 

Understanding Web Fundamentals – Part I

When I speak about technologies pertaining to web development, with people who have worked on web earlier and as well as people who are new to web development; the challenge at times is to ramp them up on the fundamentals of web, specifically the things that happen behind the scene between your browser and the sites server. This post is going to talk something of that sort.

Prerequisite

You don’t have to be a technologist to understand this article, I will try to explain it in the simplest terms.

Scope

I wanted to call the scope out because there are many more topics. This is a basic version; which covers the following –

  • Request Methods / HTTP Verbs
  • Status Code
  • Headers
  • The Submit Event

Scenario

Open a browser, type a valid URL and press enter. In my case – yahoo.com

I am using Google Chrome; with the developer tools open. Developer tools is that thing which will give you geeky information. All popular browsers have developer tools, you don’t have to really install any other software; it is already part of your browser. You can access developer tools for various browsers – Chrome, Firefox, Safari and Internet Explorer

Here is mine –

DevTool

As you can see above there are certain things happening under the hood. Well thats what we will start looking at. Or at least few of them 🙂

Terminologies

InternetFew terminologies to get comfortable with.

  • Client – Is the browser, you are using to view a site
  • Server – Web Server to be precise, think of this as a computer sitting somewhere in the world, a really powerful computer.
  • Resources – In simple terms, anything that is served by the web server is a resource, like HTML page, image, file or any other content.

Request Methods / HTTP Verbs

Do you remember what a verb is in English grammar?

Verb –  a word used to describe an action, state or occurrence

And that is exactly what HTTP Verbs mean, each verb is used to describe an action; like – GETting something from the server. So in the above picture, the client has provided a URL and the browser is going to get the resources in that URL. Below are some of the common HTTP Verbs

  • GET – Gets a resource from the server, the majority of the internet traffic is GET. Why? When you a visit a website it is GET operation that is happening for getting the necessary resources from the server to render the page. Think for a moment; you don’t require a stats to prove this.
  • POST – Well, When you want to create a new resource on the server it is post. The word resource might be slightly misleading here. Apart from HTML page, image, etc.,  a resource can be also an entity or a model or a business object. Consider a scenario where you are filling a form to create a new user account in certain site. The information that you have entered are captured and posted / submitted to the server to create a new resource of user.
  • PUT & DELETE – While POST is for creation, PUT is for updating an existing resource if it is there and DELETE is for .. what the verb suggests 🙂

Basically these are the CRUD operations – Create Read Update Delete being signified here.

In my example, when I typed yahoo.com in the browser. The client issued a GET operation as shown below.

GET

The complete list of verbs can be found here.

Status Code

Consider a travel ticket, the status of which could be Confirmed / Cancelled / Waiting ..

The status code in web, as well talks about the status of a particular call the browser has done. It is a number which represents certain status. There are different ranges which signify different status. The server will respond with a certain status code which will be then interpreted by the browser.

For example –

The 2xx series define success. And in my case the call indeed succeed and hence I can see the 200 status code like below –

statuscode

The different series and their representation can be found here.

Headers

Request Headers

When I go to office, I need to display my id card at the gate. I need to swipe the card at the door to get access to the floor I work on. While the main subject in focus is the employee (a resource) there are certain information that he needs carry so that he can get something. In this particular scenario an access (don’t confuse this with authentication / authorization). So headers are additional information your browser sends which can be controlled / tampered / sniffed on. This particular headers are known as request headers. The simplest of all headers is the ‘Accept’ header. As the name suggests, the client tells what he accepts. Like – Image, html, xml etc.

Response Headers

Like the way the client sends response headers, the server as well sends response headers. The simplest example would be content-type. The server is indicating – hey here is the data and it is of this type (image, html. xml etc.)

headers

As you can see, there are many other information that gets passed along with the request headers and server too passes many other information to the client through the response headers. This headers can be synonymical to the handshake that happens between a client and a vendor who provides some service.

The Submit Event

This is something which is very important to understand. People with the background of Microsoft Asp .Net Webforms think that there is a really a server side click event. In reality that is not true.

Okay, the focus is not here on the technology used for implementation, so lets get back.

Form –  You should be familiar with the physical form you used to submit to get some service in the real world. On the web, a form is a section in a page where are there are controls to get inputs from the user, this can be compared to the boxes you will fill in a physical form using a blue pen or black (or whatever is recommended color)

Take an example of a user account creation screen, like in Google or any other service. You are required to fill in some form and then you click a button. What happens when you click the button is called a submit event. Not getting into the intricacies of it, it basically takes all the values that you have given inside those controls and sends it over the wire in the form of a key-value pair. The key being the controls ‘name’ –

firstname:Dee

lastname:D

location:Bangalore

In the developer tool, you will see a section called form data in the specific network call which happens after you click the button. Generally, the HTTP Verb for this will be either PUT or POST for this call. Check it out the next time you are creating a new account.

Conclusion

I understand this is a lean version, but like I mentioned it is meant for a wider audience with / without the background of web technology. Keep your developer tools open anytime you visit the website and you will see a lot of interesting things that happens behind the scenes. The title of this blog says Part I, I just wanted to keep it open, in case if I had to continue on the same topic in the future.

Cheryl’s Birthday Problem Solution – Explained

Once again, the internet went viral on a topic, this time a math problem from Singapore.Here is the problem –

150415100018-math-problem-goes-viral-exlarge-169

Image Source

Now if you are not looking for the solution. Stop now. Else read further.

BTW I did not figure out the solution on my own, however the solution I got also was not easily understandable. So here is my interpretation of the solution.

Breaking down the possibilities

Before we look at what Albert and Bernard had to say lets take look at the options that Cheryl has provided.

Here is tabular representation of the same 10 possible dates from the image.

May 15 May 16 May 19
June 17 June 18
July 14 July 16
August 14 August 15 August 17

From the above table, lets separate out Months and the Dates. We will also put a count of how many times each month / date is repeated. Just to iterate – Albert knows the month and Bernard knows the date.

Months

Months May (3) June (2) July (2) Aug (3)

Dates

Dates 14 (2) 15 (2) 16 (2) 17 (2) 18 (1) 19 (1)

Notice something interesting in the dates.18 and 19 is only once. Which means if Bernard was given either one of these, he would have known Cherly’s birthday very easily and there wouldn’t be a complex conversation. He might have just called out saying that he knows the birthday directly. But he did not. So 18th June and 19th May is out of the equation. Which leaves with 8 options.

Lets update our tables with these observations –

May 15 May 16 May 19
June 17 June 18
July 14 July 16
August 14 August 15 August 17

Count of Months

Months May (2) June (1) July (2) Aug (3)

Count of dates

Dates 14 (2) 15 (2) 16 (2) 17 (2) 18 (1) 19 (1)

Consider Albert, the guy who knows the month. Instead of figuring out what month Albert has got, we will try to figure what month he wouldn’t have got. If Albert was told June then the options are June 17 / June 18. However, Bernard the guy who knows the date did not say that he knows the birthday initially which means Albert has a potential clue to narrow down to the only remaining date which is June 17. Yet Albert says that he does not know the birthday. Which means that June was not the month which was given for him. Don’t agree with me? its fine. Read on.

Albert Says

Another way to look at it is or the another clue is in Albert’s statement. He says – I don’t know when Cherly’s Birthday is, but I know that Bernard does not know too.

Now, how can he be so confident? Lets take a month and apply his confidence. Assume that May was the month given to Albert. In May there are three options.

May 15 – So if 15th was the date which Bernard was given, Albert confidence is valid because 15th appears twice in the original 10 options.

May 16 – Similarly if 16th was the date which Bernard was given, Albert confidence still holds good, because there are two 16th in the options.

May 19 – Now if 19th was the date which Bernard was given, then there is a problem with Albert’s confidence and statement. Because 19th appears only once.

So if at all it was May that was given to Albert he wouldn’t have said I know that Bernard does not know too, rather he would have said that Bernard might know!

But that was not the case with his statement, he is 100% confident. Why? Because the month that was given to him does not have unique date values rather all the date values are repeated. Which means May is not the month that was given to him.

The same holds good for June as well. Because June has a unique value again. So this eliminates the months May and June from the options.

Table Update –

May 15 May 16 May 19
June 17 June 18
July 14 July 16
August 14 August 15 August 17

Now it is filtered down to 5 possible dates –

Bernard Says

Lets take a look at what Bernard says – At first I don’t know when Cherly’s Birthday is, but I know now.

Bernard has a date with him. When Albert said that he confidently know’s that Bernard does not know, he has a given a clue to Bernard saying the Month that Albert holds does not have unique dates. Which leaves Bernard to look at the 5 options.

With those 5 options in hand, Bernard confidently says that he knows now. How? Because the date that Bernard has does not repeat in those five options. Take a look at the five options above. 14th is the only date which is repeating twice. Bernard’s confidence remove that redundant dates from the list. So July 14 and August 14 goes away.

May 15 May 16 May 19
June 17 June 18
July 14 July 16
August 14 August 15 August 17

 Albert Says

Finally Albert says – Then I also know when Cheryl’s Birthday is. The confident in his statement is because the Month he was given does not repeat in the three options left out. August is the only redundant values in those three options, removing that leaves only one which is –

May 15 May 16 May 19
June 17 June 18
July 14 July 16
August 14 August 15 August 17

Has my explanation helped you in understanding the solution? Or it has confused you even further!

Shout-out to my family and friends for their inputs while trying to understand the solution which shaped this blog indirectly.

Framework & Library – The Difference

I have been asking myself what is the difference between library and framework. Being a developer there are many places I hear these terms conveniently interchanged. So here is my understanding –

Framework

Lets first go by the dictionary meaning of the word framework, choosing the one that fits the context here –

a basic structure underlying a system, concept, or text.

Most probably you have many frameworks in your life already. A framework is there in place when you commute. A framework is there in your work. You are part of a bigger framework known as government. So framework is more or less which have ‘rules‘ or ‘governance‘ which you need to adhere so that it works for you. The ones who embrace this governance are more successful in using this to achieve their goals. AngularJS is a framework, it expects you to follow certain guidelines so as to build a powerful dynamic web site. They quote,

AngularJS — Superheroic JavaScript MVW Framework

On the other hand…

Library

Dictionary meaning –

a building or room containing collections of books, periodicals, and sometimes films and recorded music for use or borrowing by the public or the members of an institution.

It is a place where you can go and enrich your knowledge. A collection of books categorised, each category speaking about one or more topics respective to that category. In symmetry, the technology world has its own set of library, only here a library can be used to achieve a task in a convenient way and it is portable. Lets take an example of jQuery. They quote,

jQuery: The Write Less, Do More, JavaScript Library.

It helps in minimizing redundant code, perform complex operation with few lines of code. Re-usability being the primary purpose of its existence a library can help you a lot – provided you know the right methods and techniques to use it. In case of jQuery you do not have to worry about which browser it is running, call the right jQuery API and it will get the required control by traversing the DOM. Internally they check what is the current browser the user is on and use the appropriate browser API all that happens behind the scenes. As such a library does not dictate anything, you can use it in any possible way and its job is to take the input and give you an output. If you give junk input it gives you a junk output. Simple!

From my experience at least a framework may contain one or more libraries. Durandal JS another UI Framework that I work with closely, kind of glues many libraries to achieve its functionality.

framework

TL;DR

  • A framework may contain one or more library
  • A framework dictates to an extent on how to use it
  • A library – reusability & encapsulation
  • A library does not dictate
  • There are in-house libraries & third party libraries

P.S.

The difference between framework and library is quite obvious. Yet at times it is nice to call out the obvious to make it crystal clear.

While the primary focus of this particular blog was to try and understand the difference between frameworks and libraries, I am not calling out architecture nor toolsets here..

Understanding when a site is HTML5

HTML

Hyper text markup language: As the name suggest it is a markup language used for describing web pages.  Simply put it it contains a set of tags <div></div> and inside the tags a content goes like <div>Hello Visiter!</div>. The markup language is not what you see on the browser but rather used behind the scenes for rendering the page on to your browser window.

HTML5

is a W3C specification that defines the fifth major revision of the HTML. Its core aims have been to improve the language with support for the latest multimedia while keeping it easily readable by humans and consistently understood by computers and devices. And more..

Misconceptions

I have seen in many discussions including my work place and around other developers whom I meet where they use the term HTML5 while really what they meant is HTML.html5

All right HTML5 is the new cool, but it is more than that. A site is HTML5 when it uses any of the features listed here. Else it is just a plain old HTML site. Just because you use a library does not mean that it is HTML5.  But developers like to glorify saying that it is HTML5 when it is really not.

Q: Do you use <nav> semantic tag for placing all your navigation related content?

Ans: No, we just use div and a bunch of span because we are comfortable with it.

Q: Do you use any new input type date? N

Ans: No, we use jQuery UI so that the UI is consistent across all browsers.

Clearing Misconceptions

  • HTML5 is still a markup language. Except for the semantic tags, multimedia and new input control others HTML5 API’s are exposed through JavaScript. Yes JavaScript!
  • You can build build a HTML5 web site without using any third party library.
  • Not all libraries are using HTML5. Sure, they would call that out if they are using so.
  • A client side UI framework library has nothing to do with HTML5, it is basically a framework for having clean separation of concerns.
  • Not all browsers / version support all of HTML5. It is still a rolling ball. You can see who is supporting what in which version. Like this.

Personally there is nothing wrong in saying the page is HTML. In fact, when you make a statement like that then the probability of the site working on all browsers is greater than just working on the evergreen browsers.