Human vs Artificial Intelligence – Quick Insight

Screen Shot 2017-12-27 at 1.31.33 AM

What makes your life easier than a technical secretary who says, “What can I do for you Anonymous? I can help you solve real-life problems, and I can also help you with things that I don’t understand by connecting you to a human”.

chat-bots

This is how a life of new-born bot starts. As a kid getting trained on real-world problems via Natural Language Processing- Artificial Intelligence Based Human Language Interpretation to invoke technical callbacks. Callbacks that invoke functions like triggering ON and OFF event for a switch in case of Smart Homes like Home,  wake me up at 7 AM tomorrow in case of smartphones virtual assistants like Siri & Google Assistant.

revolutionizing-procurement-with-artificial-intelligence-and-machine-learning-5-638

Artificial intelligence is in competition with humans by automating human work and reducing the human workforce. There are a lot of discussions around fact that there is a segment of humans who don’t like bots and technology, they just don’t want to lose their job to a bot.

F8111284-01.jpg

But for those who understand that we should rather try to automate things than doing everything by ourselves just to feel ownership, “We are not the owner of anything in our life. We cannot control mind and body”.  People were using landlines before they started using mobile phones, and with time they started learning about social media websites like Facebook, mobile messengers like WhatsApp and traveling with Uber.

If you are here and trying to understand IoT- any device that is connected to internet/ network and can be controlled over same using apps on mobile phones, smart watches or web apps is an IoT device. An IoT device can be a light, air conditioner, speakers, music system in your car, energy monitors etc. If you are techie you can buy one of RaspberryPi starter kit and unleash your creativity.

Merry Christmas!

Advertisements

Creating API documentation from source code comments in JavaScript, C#, PHP & JAVA

From past 5 years I have been working with lot of technical teams struggling to version APIs and create API documentation as per spec change. After boom of version control tools like Github & SVN teams are able to track source code but updating API specs for every minor change is still something that developers forget or don’t really care to update on time. It doesn’t matter much if nobody else is consuming their APIs but if APIs are exposed as REST- developer/app should know at same time that something was changed in API.

Teams are still able to track major API version releases but minor spec change in APIs are untracked most of the time, sometimes cause of communication gap and sometimes cause of improper documentation, leading to frustration within teams and products. As developers, how do we version our APIs without giving this responsibility to one more person who has to coordinate with each and every developer of team trying to figure out what was updated and manually updating documentation at end of the day?

Recently, I came across a tool that made my life as a product developer plain sailing. Now the developer who is working on server side API needs to add comments in his code in proper format and anyone from team will be able to generate API document out of it. Whenever server team works on any functionality they update comments in their own code giving it a minor release number if required and team will be able to generate documentation if they have access to latest updated server code without knowing server code language on my local. Take below example for instance


/**
 * @api {POST} /route/api/ Login
 * @apiName Login
 * @apiGroup Authentication
 *

 * @apiParam {Username} Username
 * @apiParam {Password} Password
 *
 * @apiParamExample {json} Request-Example:
*{
* "Username": "test",
* "Password": "Test123",
*}
 * @apiSuccessExample Success-Response:
 *{
 * "Code": 1,
 * "Message": "Signed in Successfully",
 *}
 *
 * @apiError User Id/Password Is Incorrect.
 *
 * @apiErrorExample Error-Response:
 *{
 * "Code": 1,
 * "Message": "User Id password is incorrect",
 *}
 */

/**
 * @api {POST} /route/api/ Signup
 * @apiName Signup
 * @apiGroup Authentication
 *

 * @apiParam {Username} Username
 * @apiParam {Password} Password
 * @apiParam {Email} Email
 * @apiParam {FirstName} FirstName
 * @apiParam {LastName} LastName
 *
 * @apiParamExample {json} Request-Example:
*{
* "Username": "test",
* "Password": "Password",
* "Email": "Email",
* "FirstName": "FirstName",
* "LastName": "test",
*}
 * @apiSuccessExample Success-Response:
 *{
 * "Code": 1,
 * "Message": "Signed up Successfully",
 *}
 *
 * @apiError User Id/Password Is Incorrect.
 *
 * @apiErrorExample Error-Response:
 *{
 * "Code": 1,
 * "Message": "Please check details again",
 *}
 */

The above code in your own JavaScript/C#/PHP will generate an API documentation for you with an awesome left menu and standard parallax style API documentation.

Install apidoc using npm

npm install apidoc -g

Create apidoctemplate directory in root of your project

apidoc -i js/ -o apidoc/ -t mytemplate/

Create apidoc.json

vi apidoc.json

Configure your apidoc.json

{
"name": "My REST API documentation",
"version": "0.1.0",
"description": "My REST API documentation",
"title": "Detailed REST API documentation",
"url" : "https://yourdomain.com"
}

Run apidoc

apidoc

You can find your documentation here.


/doc/index.html

Now each time your server-side developer friend updates any spec ask him to edit the comment in code and your updated REST API documentation is ready.

The rise of ECMAScript – Goodbye 2015

What is ECMAScript?

toptal-blog-image-1435169544237-7137138c9b6badce17ca1e6094598255

As per Wiki-  ECMAScript(European Computer Manufacturers Association) is a trademarked [1] scripting language specification standardized by Ecma International in ECMA-262 and ISO/IEC 16262. We use various implementations of ECMAScript for client side scripting on web. Examples are JavaScript, ActionScript and Jscript.

ECMAScript was developed by Brendan Eich- Father of JavaScript. It was named Mocha, then Livescript and finally JavaScript.

ECMAScript7: The rise of compilers

babel

After ES6 (2015), there was huge rise in number of developers switching from traditional way of writing JavaScript to start using compiled code generators. Compiled code generators compiles code written in other languages to JavaScript. Our favourite JS code compiler is Babel(https://babeljs.io/) as it is actively supporting ES7 (ECMAScript 2016). For example Babel compiles following code:

const input = [1, 2, 3];
console.log(input.map(item => item + 1)); // [2, 3, 4]

to

var input = [1, 2, 3];
console.log(input.map(function (item) {
return item + 1;
})); // [2, 3, 4]

which will run in any JavaScript environment.

 

Some more examples are Opal(http://opalrb.org/) for Ruby, Pyjamas(http://pyjs.org/) for Python, Perlito(https://github.com/fglock/Perlito) for Perl, j2js(https://github.com/decatur/j2js-compiler) for Java, Blade(https://github.com/vannatech/blade) for C# and so on.

Gulp and Grunt: Automate your workflows

gulp-grunt

Measuring programming progress by lines of code is like measuring aircraft building progress by weight. – Bill Gates

With active usage of tools like Gulp and Grunt companies and developers started automating workflows for JavaScript applications. These tools helped developers in doing lot of automated tasks like library upgrade, automated testing, folder structure creation and so on. If you didn’t use Gulp and Grunt in your projects till now and make a New Year resolution to automate your build process and automate JavaScript tasks for an easier life.

The incredible Node.JS

node

Node.js foundation grew to more than 3 million users. Companies like Intel, IBM and Joyent used Node.js to create software architectures, real-time location tracking services and IoT. With npm lives of developers became lot easier as they could do a lot of heavy architecture creation using CLI. Also I heard companies switching from traditional Java/PHP technology stack to next gen Node.js for their active products.

How rise of ECMAScript revolutionized cross-platform apps

This year we saw a lot of people moving from native to cross-platform and vice versa. Keeping same codebase across all platforms helped companies and developers to launch their products in really less time when compared to writing code in different languages for each platform. With tools like npm creating a Cordova application became one liner.

</pre>
$ cordova create hello2016 com.example.hello2016 Hello2016
<pre>

We can’t wait to see what ECMAScript7 will bring in for developers working on IoT and next generation apps in 2016. Wishing all readers Techie-Happy New Year.

Advanced JavaScript: Environment Setup, DB integration and Securing Client in MeteorJS

This tutorial is in continuation with previous tutorial. If you are new here, read first chapter of this series Advanced JavaScript: Introduction To Server Side JavaScript Using Meteor before reading this tutorial.

I will be skipping traditional TO DO app tutorial here, as you can find it anywhere on web. Rather, I will try to explain few scenarios that developers come across while developing apps using JavaScript frameworks in real-time.

In this tutorial we will be covering

  • Setting up development environment for Meteor?
  • How to integrate your Meteor application with Mongo DB?
  • How to secure your Meteor application?

Setting up development environment for Meteor
Most popular IDEs like Sublime, Webstorm and on-cloud IDE- Cloud 9 integrates seamlessly with Meteor. I am a fan of Sublime so I will explain how to set up autocomplete engine into Sublime Text 3. You can visit Meteor website and setup your own IDE.
Open Sublime Text-

  1. From menu bar select preferences-> Settings -Users
  2. If you have not made any changes from time you installed Sublime replace contents of file with following code-
  3. {
    	"color_scheme": "Packages/Color Scheme - Default/Sunburst.tmTheme",
    	"font_size": 12,
    	"ignored_packages":
    	[
    	], 
    	"auto_complete_triggers": [ { "characters": "<", "selector": "text.html" }, { "characters": ".", "selector": "source.js" } ]
    }
    
  4. Now press Cmd/Ctrl+Shift+P and type Install. You will see ‘Package Control: Install Package’ in menu. Select it and press Enter. Now search for TernJS and click on it. Package will install automatically. Restart Sublime and you will see your Sublime just got smarter and it can autocomplete Meteor code for you.

loading-library-sublime

How to integrate your Meteor application with Mongo DB?
We already have Meteor code running on local server. Now let’s add DB support. Meteor comes bundled with MongoDB so you don’t need to include it again, still if you wish you can do custom setup but let’s not discuss it in this tutorial as pre bundle itself is self-sufficient to create end-end application.

  1. Lets create Fishes collection.
    Fishes = new Mongo.Collection("fishes");
    

    It creates a MongoDB collection called Fishes and creates a cache connected to server.

  2. Replace if (Meteor.isClient) with this code
    if (Meteor.isClient) {
      // This code only runs on the client
      Template.body.helpers({
        fishes: function () {
          return Fishes.find({});
        }
      });
    }
    }
  3. From terminal type
    meteor mongo
  4. meteor-mongo-terminal

  5. Now write this insert query to add a new fish

    db.fishes.insert({ text: "pygmy angelfish",imageurl:"http://www.seascapestudio.net/reference/fishes/centropyge_argi.jpg", createdAt: new Date() });
  6. check-db-for-fishes
    mongo-insert-singleton

  7. Now go to http://localhost:3000 and check if you are can see live fish coming from live data. If yes, you just added DB connectivity to your meteor application.

Now add some more blue fishes to grow your list-

db.fishes.insert({ text: "pygmy angelfish",imageurl:"http://www.seascapestudio.net/reference/fishes/centropyge_argi.jpg", createdAt: new Date() });
db.fishes.insert({ text: "blue dot grouper",imageurl:"http://www.richard-seaman.com/Underwater/Egypt/Highlights/PeacockGrouper.jpg", createdAt: new Date() });
db.fishes.insert({ text: "blue line grouper",imageurl:"http://www.aquariumdomain.com/images/fish_marine/grouper_blueline2.jpg", createdAt: new Date() });
db.fishes.insert({ text: "teira batfish",imageurl:"http://www.aquariumdomain.com/images/fish_marine/tieraBatfish8.jpg", createdAt: new Date() });
db.fishes.insert({ text: "convict blenny",imageurl:"http://www.roslyndakin.com/wp-content/uploads/2011/01/convictadult.jpg", createdAt: new Date() });

How to secure your application?
One of main concern while using JavaScript for both server and client side code is security. Try running following code from console:

Fishes.insert({ text: "Fighter",imageurl:"http://bongotimes.com/wp-content/uploads/2014/11/beautiful-fish.png", createdAt: new Date() });

From MongoDB console run

db.fishes.find()

and you will see both client and server have a new beautiful red fighter fish. If you noticed, you were able to alter DB using Javascript without authenticating with server which is a security breach. This is beacause Meteor has insecure package selected by default.

  1. To remove insecure package navigate to your project folder in Command Line /Terminal and run-
  2. meteor remove insecure
    

    meteor-remove-unsecure

  3. Now enable the accounts system and UI using following command from root directory of project-
  4. meteor add accounts-ui accounts-password

    accounts-addition
    I find package control really useful. They make your life lot easier by taking care of entire setup for useful technical modules, as in this example entire user management. Few years back implementing secured login module was estimated around 100 hours which came down to 1 minute with recent advancement in web technologies.

  5. Now add login buttons to your app. Paste following blaze template anywhere in code. I will paste it in header.
  6. {{> loginButtons}}
    
  7. Now signup for new account and run this command from console-
  8. if (! Meteor.userId()) {
          throw new Meteor.Error("not-authorized");
        }
    Fishes.insert({ text: "Fighter",imageurl:"http://bongotimes.com/wp-content/uploads/2014/11/beautiful-fish.png", createdAt: new Date() });
    

    meteor-not-authenticated

    You will notice you are not able to insert data any more. Meteor.user() will return user data to you.

We will discuss security, Blaze templates and routing in detail in next chapter of this tutorial. Till then Happy Coding!

Now you can follow this tutorial on GitHub.

References-
https://github.com/Slava/tern-meteor-sublime

Images credits-
http://bongotimes.com/

Advanced Javascript: Introduction To Server Side Javascript Using Meteor

Server Side Javascript has come long way, and after launch of Node.js in July 2011 gained lot of popularity as idea of using same language on client and server bought in code and software architecture uniformity in software applications. Even though Brendan Neich‘s Netscape already had vision to use same programming language on client and server but at that time people were using Pentium I/II processors which were not powerful enough to support Javascript Interpreters. In case you don’t know Brendan Neich he’s creator of Javascript and co-founder of Mozilla. In present generation of more than 2 billion smartphones you can get Phone with 1.2 GHz processor for less than $40. Seeing boom in processing speed of devices software developers started integrating Javascript interpreters like SpiderMonkey & Rhino in their applications. Some started using Jaxter server that embeds entire Mozilla Firefox Browser Engine in web server giving access to Ajax and Javascript within application.

Now when we have brief history of Javascript let me explain how to setup Meteor and create a simple server side Javascript application.

Go to this link and install Meteor.

Once you are done with setup go to command like and create a directory named bluefish if you would like to follow remaining series of tutorial.

Nikhils-MacBook-Pro:bluefish nikhil$ meteor create bluefish
Created a new Meteor app in 'bluefish'.
Nikhils-MacBook-Pro:bluefish nikhil$ cd bluefish/
Nikhils-MacBook-Pro:bluefish nikhil$ meteor
Started proxy.
Started MongoDB.
Started your app.  
App running at: http://localhost:3000/

Screen Shot 2015-10-24 at 4.10.07 pm Screen Shot 2015-10-24 at 4.16.08 pm

Now navigate to http://localhost:3000/ and if everything if fine you will see following webpage-
Screen Shot 2015-10-24 at 5.07.16 pm

Now you can use your favourite code editor to change HTML and CSS and see if changes are getting reflected in your application without refreshing browser. If you can see updated HTML in your browser, congrats you deployed your first Javacsript Server Side Application. It’s called hot code push.

Now lets dig in a little and make our first bluefish list.

Edit your HTML and change it to

<head>
  <title>bluefish!</title>
</head>
 
<body>
  <div class="container">
    <header>
      <h1>bluefish!</h1>
    </header>
 
    <ul>
      {{#each fishes}}
        {{> fish}}
      {{/each}}
    </ul>
  </div>
</body>
 
<template name="fish">
  <li><img src={{imageurl}} height="80" width="100"/>{{text}}</li>

</template>

Change your Javascript to

if (Meteor.isClient) {
  // This code only runs on the client
  Template.body.helpers({
    fishes: [
      { text: "pygmy angelfish",imageurl:"http://www.seascapestudio.net/reference/fishes/centropyge_argi.jpg" },
      { text: "blue dot grouper",imageurl:"http://www.richard-seaman.com/Underwater/Egypt/Highlights/PeacockGrouper.jpg" },
      { text: "blue line grouper",imageurl:"http://www.aquariumdomain.com/images/fish_marine/grouper_blueline2.jpg" },
      {text:  "teira batfish",imageurl:"http://www.aquariumdomain.com/images/fish_marine/tieraBatfish8.jpg"},
      {text:  "convict blenny",imageurl:"http://www.roslyndakin.com/wp-content/uploads/2011/01/convictadult.jpg"}
    ]
  });
}

You can write your custom styling in CSS file.

Screen Shot 2015-10-24 at 5.02.14 pm

For further information, visit https://www.meteor.com/tutorials/ or wait for next chapter of tutorial. Happy coding!

Image credits-

http://www.seascapestudio.net/
http://www.richard-seaman.com/
http://www.aquariumdomain.com/
http://www.aquariumdomain.com/
http://www.roslyndakin.com/

References-
https://developer.mozilla.org/ja/docs/Web/JavaScript/Server-Side_JavaScript
https://www.meteor.com/

I just submitted my app to store. What do I do now?

app submission ios

Most of the developers feel so happy after submitting their app to Stores and say its time for a party. It is time to grab few beers and relax after all the hard work team did in developing, conceptualising and ideating that app and it even passed strict guidelines provided by Apple App store. Phew!

After 2 days, a developer comes to me and asks, we did a small press release, asked few blog platforms to blog about our new app and we have 2k downloads for our new app. Great! What’s next? Post release process is one of the main question that I come across ( e.g. http://linkd.in/1HfEzPO ). I will try to answer this question in this post-

    apps press release

  1. Approach few blogging companies or personal bloggers, the keywords you are targeting will have few articles on search engine. You can approach those companies/personal bloggers and ask them to write an article/press release about your app. For inspiration look at- http://noodlecake.com/ssg2/
  2. app review guidelines

  3. If you are releasing app for all platforms make sure that your follow app review guidelines for each platform, especially for iOS as Apple ensures that apps you submit are reliable, perform as expected, and are free of offensive material.
  4. mobile app analytics, infographics

  5. Make sure you track analytics from day 1. There are different tools available to track performance, basic and most important but ignored-crash analytics. If your app crashes even once, probability that user will open app again is really low. You also loose on review here. There are a lot of tools to choose from. Depends on kind of app. If you are developing a game you will track where did your character die & for information display app you will need a heatmap so that you can focus on blue areas. I have used http://www.flurry.com/, http://www.google.com/analytics/mobile/ & https://count.ly/. https://www.appsee.com/ is bit unique and different. It gives you session playback and it identifies UI bugs automatically. Willing to try this in my next project.
  6. Make sure you respond to all reviews from day 1 via support email or review comments on store. Even if it is bad.
Splash Math Logo

SplashMath- Silicon Valley edtech startup with 5 Million K-5 kids in US

StudyPad, Inc. is a Silicon Valley company that is the publisher of award winning Splash Math app series andwww.splashmath.com. It all began in 2010 from a garage in Delhi, around the time when the iPad was launched along with Common Core Standards that were introduced in the U.S.
Splash Math brings fun in the learning and practice of math with interactive games that enable kids master math skills with ease. Aligned to the Common Core State Standards curriculum for Grades K-5, Splash Math prepares kids for the standardized tests. As Common Core fever grips K-12 this year, Splash Math fits the bill as perfect the math practice solution.
Splash Math is platform agnostic. All kinds of devices find their way to today’s classrooms. From iPads and Android tablets to Chromebooks and Windows tablet PCs. Splash Math aims to replace Paper Worksheets with Fun Games and gear iPads/tablets, laptops/desktops for the classroom. Math practice anytime and anywhere is possible with Splash Math that works equally well on iPad/android tablets and on laptop or desktop. Once downloaded, it can be used on multiple devices with the same login and the progress of the kid can be saved and tracked in real time.
More than 5 million downloads & 30,000 classrooms – uncountable smiles and unlimited hours of fun are brought by the multi-award winning app that is recommended by the teachers and praised by parents!