Android RecyclerView Add Load More Functionality

Hello,

Recently I was working on adding load more functionality on Android RecyclerView. The purpose was to load more data as soon as user scrolls to bottom and there are no records left.

Since we already have used swipe to refresh plugin other load more plugin was not working as the event was not attached and fired. If we remove swipe to remove then it worked but we needed both functionalities. So for that we did simple trick. Here is the code.

testRecyclerView.addOnScrollListener(new RecyclerView.OnScrollListener() {
    @Override
    public void onScrollStateChanged(RecyclerView recyclerView, int newState) {
        super.onScrollStateChanged(recyclerView, newState);

        if (!recyclerView.canScrollVertically(1)) {
            Toast.makeText(getApplicationContext(),"CALL LOAD MORE FUNCTION TO LOAD MORE DATA",Toast.LENGTH_LONG).show();
        }
    }
});

So trick is very simple, we added on scroll listener to recycler view and just checked it can not scroll any more vertically that means we reached at bottom and form here we can add logic to load more data.

Hope this helps you.

AngularJs - Get Controller Scope in Directive

Recently I was learning AngularJs 5 and where I faced problem. I have to call controller function from directive. After struggle of half an hour, I was able to solve it. In this blog I am going to explain how to do this.

First of all give id to HTML tag where you have added ng-controller directive.

<div ng-controller="MyController" id="myControllerDiv">
</div>

Now in directive or any external JavaScript code where you want to get contoller scope, use following code.

var element  = document.getElementById("myControllerDiv");

This will give us that element, we will find it's corresponding angular element.

var angularElement  = angular.element(element);

Now we will get it's scope and using that scope, we can all any function of MyController

angularElement.scope().myFunction()

This will call myFunction defined in MyController.

Hope this helps you.

Read from CSV file using Python

Hello,

In this post I am going to explain how to read CSV file using Python. For this I assume that you have python installed in your system. Now we have to install csv package.

sudo pip install csv

This will install csv package for python. Now to read CSV file use, following code.

with open('data.csv', 'rb') as csvfile:
       reader = csv.reader(csvfile, delimiter=',', quotechar='|')
              for row in reader:
                     print row[0]
                     print row[1]
                     print row[2]
                     print row[3]
That's it and now you can have read CSV file.

To run python script. Type command

python myscript.py

And that's it. 

Laravel Query Builder GroupBy Syntax error or access violation

Hello,

Recently I forked a Github project and was updating it. I faced strange issue in using GroupBy in query builder. I was trying to query model as follow.

$projects = ProjectReviews::groupBy('project_id')->orderBy('created_at','DESC')->get();

Basically I wanted to get recently reviewed projects and show dates. But in above query I was getting error Syntax error or access violation project_reviews.id isn't in group by.

That was really strange issue as that's the primary key of table and it should not be part of group by. If you run that query directly in PHP MyAdmin it was working fine. So I was not sure about this. Finally after spending couple of hours I was able to find out the problem.

It's because of strict config settings of database. If you look into config/database.php file there is strict config there.

        'mysql' => [
            'driver' => 'mysql',
            'host' => env('DB_HOST', '127.0.0.1'),
            'port' => env('DB_PORT', '3306'),
            'database' => env('DB_DATABASE', 'forge'),
            'username' => env('DB_USERNAME', 'forge'),
            'password' => env('DB_PASSWORD', ''),
            'unix_socket' => env('DB_SOCKET', ''),
            'charset' => 'utf8mb4',
            'collation' => 'utf8mb4_unicode_ci',
            'prefix' => '',
            'strict' => true,
            'engine' => null,
        ],

You have to set to false to make GroupBy working.

Following is mentioned in MySql Documentation for this config.

Strict mode controls how MySQL handles invalid or missing values in data-change statements such as INSERT or UPDATE. A value can be invalid for several reasons. For example, it might have the wrong data type for the column, or it might be out of range. A value is missing when a new row to be inserted does not contain a value for a non-NULL column that has no explicit DEFAULT clause in its definition. (For a NULL column, NULL is inserted if the value is missing.) Strict mode also affects DDL statements such as CREATE TABLE.

So basically it secures your database operations. However in Laravel it's not working properly. So I was not sure if it's laravel bug. But I had to disable it make this query working.

Disabling it wouldn't make your web app unsecured if you handle all validations in your controllers and follow best practices like Laravel already does.

However I still recommend to be careful, while using this.

Ubuntu Keep Process Running After SSH is Terminated

Hello,

Recently I was learning NodeJS and for that I faced an issue with node server. I installed node server via SSH and started server. But as soon as I closed terminal Node server stopped working. But I needed server up and running even if terminal is closed. So after struggle of sometime I found out solution. Here is what we have to do.

Basically when you type command on SSH and start server it runs on the foreground and wait for process to be finished. So as soon as you close terminal foreground process is also terminated and hence your server is stopped.

So in this case you have to run server as background process and if you are using ubuntu you can use nohup  and & to start running process in background hence it will not be terminated once the terminal is closed.

So here is the command you have to follow.

$ nohup "COMMAND" &

Here COMMAND is your command to start the server and since you have mentioned nohup and & it will run the process in background and will not be terminated when SSH is closed.

jQuery Submit Form with Ajax

Hello,

In this blog we are going to take a look at how we can submit for with Ajax using jQuery.

First of all add jQuery file in your head section of HTML page.

<script src="jquery.min.js"></script>

Now we will have following form.

<form action="">
      <input id="text" autocomplete="off" placeholder="Type here" />
</form>

If you want to submit this form with Ajax using jQuery, first you have to do is add submit event handler.

$(function () {
$('form').submit(function(){
var formData = JSON.stringify($('form').serializeArray());
$.ajax({
type: "POST",
url: "YOUR_API_URL",
data: formData,
success: function(data){

},
failure: function(errMsg) {
}
});
return false;
    });
});

So first we have added submit event handler and used return false so it does refresh the whole page and just use the Ajax request.  Inside event handler we are using HTML 5 FormData to get form data first and then using Ajax request to send data to server in APIs.

Hope this helps you.

Quick Tips Before You Start Working on IOT Project

Recently me and my team has completed an IOT project where we done GPRS Thermal printer integration with POS and Mobile App. We faced certain issues in project but later on we completed it successfully. Here I am sharing some quick tips before you start working on IOT project.

Readers who are new to the concept of IOT, please read my blog here on IOT.

IOT and IOT Examples, Read here.

1) Understand your IOT device and configure it

As we know IOT is all about connecting machine to Internet. For that you must understand the device and it's configurations. Most of the devices comes with user manual so it would be easy but still sometimes manuals are difficult to understand. For example in our case printer was manufactured in China so we got manuals with some Chinese languages so we had to figure out how it works and do some manual testings to connect printer to internet and get it working. Also you must understand the protocol on which device will work. For example most of the devices use Http protocol but some also work on socket. As per you web server and web services you have to decide protocol to be used.

2) Strictly follow protocol of Device.

This is again and important thing for IOT project. All the devices have some protocol to receive data and to get data back from device. You must follow that. If you don't, then your device will not work properly.

For example in our case if we have to send some data to printer we have to follow following syntax.

"&!*1Order*Item1*Item2#";

So here 1 stands for printer action

if it's 0 that means printer will just print the order and it will be accepted by default.

1 means printer will print it and user have to take action to accept or reject.

So in this case we thought 1 is the serial number so ignored it and printer stopped working.

So it's very important to strictly follow this syntax of devices because IOT devices are very strict in terms of syntax.

3) Have Patience, It will work for sure...

When you are working with hardwares and software together it's always difficult and time consuming. You have to deal with protocols and manual of devices to make it working and for that you should have patience. Also it's testing and development is not easy. First you write some code and trigger some events and then you check if that's working with device or not. So it really needs patience. Do not get frustrated and bang the device. Have patience and keep on working on it. It will work for sure. 

Using Google Translation API For Indian Language with PHP

Google translation API works good for Indian languages, if we type in proper language. For example, if you pass following in API. 

कैसे हो

Then it will translate properly to 

how are you

But if you pass it in english, like this.

"KAISE HO"

Then it will send the same text back but it only detects language. So it does not work properly. So what shall the possible solution for it. 

Here is how I worked out in one of my old project.

First I used Google input tools API to convert the input to regional language. 

So steps if First

KAISE HO is converted to

कैसे हो

and then pass it in translation API to convert it to English. Here is the code for the same.

$translatedText = "KAISE HO";

$detectedSourceLanguage = "hi";

$url ='https://www.google.com/inputtools/request?text='.urlencode($translatedText).'&ime=transliteration_en_'.urlencode($detectedSourceLanguage);

$ch = curl_init();

curl_setopt($ch, CURLOPT_URL, $url);

curl_setopt($ch, CURLOPT_RETURNTRANSFER,1);

curl_setopt($ch, CURLOPT_PROXYPORT,3128);

curl_setopt($ch, CURLOPT_SSL_VERIFYHOST,0);

curl_setopt($ch, CURLOPT_SSL_VERIFYPEER,0);

$response = curl_exec($ch);

$output = json_decode($response);

$resultText = '';

if($output[0] == 'SUCCESS'){

if(isset($output[1])){

if(isset($output[1][0])){

if(isset($output[1][0][1])){

$resultText = $output[1][0][1][0];

}

}

}

}

if($resultText != ''){

$url ='https://translation.googleapis.com/language/translate/v2';

curl_setopt($ch, CURLOPT_URL, $url);

curl_setopt($ch, CURLOPT_POST, 1);

curl_setopt($ch, CURLOPT_POSTFIELDS,

"q=".urlencode($resultText)."&target=en&key=YOUR_API");

curl_setopt($ch, CURLOPT_RETURNTRANSFER,1);

curl_setopt($ch, CURLOPT_PROXYPORT,3128);

curl_setopt($ch, CURLOPT_SSL_VERIFYHOST,0);

curl_setopt($ch, CURLOPT_SSL_VERIFYPEER,0);

$response = curl_exec($ch);

$output = json_decode($response);

$resultText = $output->data->translations[0]->translatedText;

}

Hope this helps you in proper translation.

Laravel Dynamic Mail Configuration With Values From Database

In Laravel we have config folder, where we have different files like app.php and mail.php etc where we can configure settings. For example for sending mail from Laravel application, we have to configure mail.php file with configs like mail driver, mail user name etc. This will work good for static information. But what if you want to override and use your own settings from database at run time.

For example you have different mail configurations for each users and you want to set it when user is logged in. I this blog I am going to show you how you can do this in Laravel 5.x

For example you have mail_settings table where you are saving mails settings for each user. Now when user is logged in we have to get settings of logged in user and set it in config. This is how you can do that.

We know that all laravel controller extends the Controller. So what you can do is in constructor of Controller.php file, you can set the mail settings.

Here is how you can do this.
public function __construct()
{
$this->middleware(function ($request, $next) {
if(Auth::user()){
//So user is logged in.
if(Auth::user()->parent_id != null){
//Get the mail settings.
$settings = MailSettings::where('user_id',Auth::user()->parent_id)->first();

if(isset($settings)){
//settting up mail config for the logged in user.
config( ['mail' => ['from' => ['address' => $settings->from_email, 'name' => $settings->from_name], 'host'=>$settings->mail_host, 'port'=>$settings->mail_port, 'username'=>$settings->mail_username,  'password'=>$settings->mail_password, 'encryption'=>$settings->mail_encryption, 'driver'=>$settings->mail_driver]]);
}
}
}
return $next($request);
});

}

So as you can see we are getting mail settings from table for logged in user and setting up it in config. This way you can override anything in the default config and set it run time.

Integrating GetStream with Laravel using stream-laravel for Real Time Notifications

Hello,

After a long time I am publishing a blog post. I am sorry to all my readers for not publishing blog for longer time. In this blog I am going to explain how you can have real time notifications in your laravel application using GetStream.io.

I will not go in installation details as it's very well documented on their Github page. You can refer it here.

GetStream/steam-laravel

After you have installed it and configured service provider. First thing you have to do is create table for notifications. For that create migration add following code to it.

Schema::create('notifications', function (Blueprint $table) {
$table->increments('id');
$table->integer('user_id')->index();
$table->string('name');
$table->string('message');
$table->string('link');
$table->timestamps();
});

Now create a model with name Notifications and add following code to it.


namespace App\Http\Models;

use App\User;
use Illuminate\Database\Eloquent\Model;

class Notifications extends Model
{
    //
    use \GetStream\StreamLaravel\Eloquent\ActivityTrait;
    /**
     * The attributes that are mass assignable.
     *
     * @var array
     */
    protected $table = 'notifications';

    protected $fillable = ['name', 'message','link'];
   
    /**
     * The attributes that should be cast to native types.
     *
     * @var array
     */
    protected $casts = [
        'user_id' => 'int',
    ];
    /**
     * Get the user that owns the task.
     */
    public function user()
    {
        return $this->belongsTo(User::class);
    }
    /**
     * Stream: Add extra activity data - task name, and user's display name:
     */
    public function activityExtraData()
    {
        return array('name'=>$this->name, 'message' => $this->message, 'link'=> $this->link);
    }
   /**
    * Stream: Change activity verb to 'created':
    */
    public function activityVerb()
    {
        return 'created';
    }

}

Now open your user model and add following code to it.

public function notifications()

    {

        return $this->hasMany(Notifications::class);

    }

So now we have notifications table setup and it's linked to user with hasMany relationship. Now next we will show how you can create notification.

$userObject->notifications()->create([

'name' => "NOTIFICATION_NAME",

'message' => 'NOTIFICATION_MESSAGE',

'link' => 'NOTIFICATION_LINK'           

]);

Here userObject is the object of user for whom you want to create notification. Now next we will show how to get all the notifications and show it user. For this we are going to use AngularJs. 

We are using client side library of GetStream.io you can download it from following link.

GetStream Browser Client

For this first of all we have to get token and that can be generated only from server side code. So create an API and call it from AngularJs controller. Here is the API code.

public function getStreamToken(){

$feed = \FeedManager::getUserFeed(Auth::user()->id);

$token = $feed->getToken();

return Response::json(array("success"=>true,"token"=>$token,"user_id"=>Auth::user()->id));

}

Now as soon as we get token, next you have to connect to client and get user feeds and register for push notifications. Here is the code for the same.

var client = stream.connect('YOUR_API_KEY', null, 'YOUR_APP_ID');

$scope.user = client.feed('user', $scope.user_id, $scope.token);

function successCallback() {

console.log('now listening to changes in realtime');

}

function failCallback(data) {

console.log(data);

}

$scope.user.subscribe($scope.gotNotification).then(successCallback, failCallback);    

$scope.user.get({limit:10, offset:$scope.offset}, $scope.gotUserActivities);

So above code will register you for the push notification and will get all your notifications. Now you have to display it using HTML and CSS as per your wish. 

For showing new notification, you can use below code in gotNotification function.

$.bootstrapGrowl(data.new[0].name + ' ' + data.new[0].message, { type: 'success' });

It will show nice pop up on screen.

 

Magento 1.9 Newsletter Unsubscribe Link Not Working

Yes.... still we are working on Magento 1.9 as Magento 2.0 is bit difficult to work with and there were some bugs in it. So recently we created magento store with Magento 1.9 where we faced an issue of adding unsubscribe link in subscription success email and other newsletter.

Subscriber object is shared with all the newsletter email templates. So to add unsubscribe link you just have to add following code.

<a href="{{var subscriber.getUnsubscriptionLink() }}"> Unsubscribe </a>

 But somehow this was not working. So after checking system log we found following error.

getUnsubscribeUrl function not found for Mage_Newsletter_Helper_Data class.

Now this was a strange issue as this is the basic functionality of Magento 1.9 and it is not working. So I checked the Mage_Newsletter_Helper_Data class in app/code/core/Mage/Newsletter/Helper folder and there was no such function but the function name was different.

Following is the function found in data.php

public function getUnsubscribeLink($subscriber)
    {
        return Mage::getModel('core/url')
            ->setStore($subscriber->getStoreId())
            ->getUrl('newsletter/subscriber/unsubscribe', array(
                'id'     => $subscriber->getId(),
                'code'   => $subscriber->getCode(),
                '_nosid' => true
            ));
    }

And in app/code/core/Mage/Newsletter/Model/Subscriber.php file following is the function.

public function getUnsubscriptionLink() {
        return Mage::helper('newsletter')->getUnsubscribeUrl($this);
    }

Which was used in template. So that was the issue. So to solve this issue replace above function with following function in app/code/core/Mage/Newsletter/Model/Subscriber.php file.

public function getUnsubscriptionLink() {
        return Mage::helper('newsletter')->getUnsubscribeLink($this);
    }

And now it should work. Hope this helps you.

Magento Amazon SES - Transactional Emails Not Working with SMTP Pro

Recently in one of our project, we were using Amazon SES service with SMTP pro extension in Magento 1.9. After verification of domain and sender email address, when we to test in SMTP pro, it was working fine. But when we try to send transactional emails such as new order, invoice etc. It was not working. So on debugging we found following exception.

Email address is not verified. The following identities failed the check in region US-EAST-1: hdave10@gmail.com

Now that was bit strange as that raised a question that do we have to verify all the receiver email as well and that was practically not possible as in Magento we can have any number of customers. 

So I checked docs of Amazon SES and after reading for a while I got the issue. 

The issue was we have configured three regions in Amazon SES. But we were still in sandbox mode for two regions and mail was sending from the region where we were still running in sandbox mode. 

To solve this issue log in to your Amazon SES console and select region from top left corner.

Once you select region, Go to SES Sending Limits Increase case.

and submit for limit increase. It will take a while to process your request. Once your limit is increased, you will come out of sandbox mode. You have to do this process for all the regions.

Hope this helps you.

Amazon EC2 Create Swap Space

Hello,

Recently in one of my project we have laravel application deployed on amazon ec2 instance. When running composer update command, we were facing issue of swap space as it was not defined. So in this blog I will explain how you can create swap space in your amazon ec2 instance. Please note these steps are specifically for ubuntu instance. If you are running other version of liunx, please check commands first and then use it.

1) Create swap file

sudo fallocate -l 1G /swapfile

2) Verify it

ls -lh /swapfile

It should show following output.

-rw-r--r-- 1 root root 1.0G Apr 25 11:14 /swapfile

3) Enable it and make it accessible by only root user.

sudo chmod 600 /swapfile

sudo mkswap /swapfile

sudo swapon /swapfile

That's it now you have swap space configured in your instance. 

Force Quit an App in Mac OSX from Terminal

Hello,

Recently I faced an issue with OpenOffice app on MAC. For some reason following open office window is displayed every time I open a document.

And then no matter what I do it does not go away. I tried force quit. Tried to close it from Activity monitor but it does not work. So then only option I had is to kill it with terminal. You can use this procedure to kill any unresponsive app in your OSX. 

First of all we have to find out process id of the unresponsive app. Since the app is unresponsive, it must be consuming lots of CPU resources. To find out this, open terminal and type following command.

top -o cpu

It will show following window. 

As you can see in first column we have PID and in second column we have app name. Find out PID from the name of unresponsive application and then type following command in terminal.

kill PID

 And it will kill unresponsive app. Hope this helps you.

PHP strtotime() does not work with dd/mm/yyyy Format

Hello,

This is quick blog regarding PHP strototime function. In our recent project we were importing data from CSV where we faced two issues.

1) If we try to import date like 01/05/2016 considering dd/mm/yyyy format, it saves date in database as 2015-01-05

2) If we try to import date like 31/08/2016 considering dd/mm/yyyy format, it saves data in database as 1970-01-01

In short month and day is swiped while saving. So in case of date like 31/08/2016,  31 is assumed as month and there is no such month in calendar so it gave error and returns date like 1970-01-01

This is first time we faced such issue. I was not sure what's the exact issue but I assumed it has something to do with separator. So we tried same dates with  - instead of / and it worked. So to solve this temporary, we had following solution.

$date = '31/08/2016';
$date = str_replace('/', '-', $date);
echo date('Y-m-d', strtotime($date));

So we replace / with - and it worked but solving problem is not enough, we shall go in deep to check why we had this problem so curiously I looked into function documentation of strtotime and found out following.

"Dates in the m/d/y or d-m-y formats are disambiguated by looking at the separator between the various components: if the separator is a slash (/), then the American m/d/y is assumed; whereas if the separator is a dash (-) or a dot (.), then the European d-m-y format is assumed. "

So indeed the problem here was with the separator.

Hope this helps you.

How to exit the Vim editor?

Every time I use vi editor on terminal in OSX or Linux, I face issue on exiting Vim editor on terminal. So in this blog I am going to explain complete procedure on exiting vim editor on terminal in OSX or Linux.

What is Vim editor?

Vim is a highly configurable text editor built to make creating and changing any kind of text very efficient. It is included as "vi" with most UNIX systems and with Apple OS X.

How to Use Vim on Terminal?

Go to terminal and type following command

vi "NameOfFile"

and it will open Vim editor like this.

This is blank file. To start editing file press "I" key and then you can start editing file.

Now the tricky part is exiting vim editor on terminal. Here are exact procedure.

Hit the Esc key, vim goes into command mode.

Type Shift key + : and you will see : at bottom of the file.

Now you have to type command to tell editor what you want to do with the file. Here are some options you have.

q to quit
q! to quit without saving
wq to write and quit
wq! to write and quit even if file has only read permission
x to write and quit
qa to quit all
Now press "Return key" and it will exit vim editor.

React Native undefined is not an object (evaluating 'this.props.navigator.push)

Hello,

Recently we have been working with React Native for one of our application where we faced an issue with Android Navigator. Basically we had two lists Category List and Sub Category List and on tap of category list item we wanted to render sub category list. Following is the code for that.

<TouchableOpacity onPress={()=> this.pressRow(rowData)} >
<CardSection>
 <View style={thumbnailContainerStyle}>
<Image
 style={thumbnailStyle}
 source={{ uri: rowData.image }}
/>
 </View>
 <View style={headerContentStyle}>
<Text style={headerTextStyle}>{rowData.name}</Text>
 </View>
</CardSection>
</TouchableOpacity>

And following is function where we were using navigator.push to go to next view.

pressRow (rowData) {

    if(rowData.subcategory == true)
    {
      this.props.navigator.push({
        name: SubCategoryList,
        passProps: {rowId:rowData.id}
      });
    }
    else if(rowData.subcategory == false)
    {
      this.props.navigator.push({
        name: ProductList,
        passProps: {rowId:rowData.id}
      });
    }

 }

Here we are getting problem with error, this.props.navigator is undefined so were not able to go to second screen.

The problem here is on scope as we were having category list rendered in app container like this.


<CategoryList />

So props of parent are not passed to child and hence navigator was not available. To solve this all you have to do it add your child component like this.

<CategoryList  navigator={this.props.navigator} />

And now navigator object will be available. Hope this solves your problem.

Step By Step Guide to Install React Native and Create Mobile App in OSX

Hello,

Recently in projects we decided to use React Native to create cross platform mobile application. I faced some difficulties in installing ReactNative so here in this blog I will explain getting started with React Native and create cross platform mobile application.

1) Install Xcode and Xcode command lines tools.

Get Xcode from Mac App Store. Click Here

2) Install Xcode Command Line Tools, Open terminal and run following command.

xcode-select --install

3) Install Homebrew, Homebrew is a package manager to install missing package on OSX. Open terminal and run following command.

ruby -e "$(curl -fsSL https://raw.githubusercontent.com/Homebrew/install/master/install)"

4) Install NodeJs and NPM. React comes package in NPM so we have to install it. Run following command in terminal

brew install node

After installation check with following command to see if it's installed.

node -v

npm -v

5) Install watchman with home brew.

brew install watchman

6) Install The React Native CLI

Node.js comes with npm, which lets you install the React Native command line interface.

Run the following command in a Terminal

npm install -g react-native-cli

7) Create React Native Project, run following commands in terminal.

react-native init ReactNativeTest

cd ReactNativeTest

Now run it with following command.

react-native run-ios

It will run application in iOS simulator.

react-native run-ios is just one way to run your app. You can also run it directly from within Xcode.

Step By Step Guide to Install and Create ReactJs Application in OSX

Hello,

Recently we have decided to use ReactJs for building mobile web applications and I faced some difficulties in setting up ReactJs in OSX so here in this blog I will explain step by step procedure from installation of ReactJS to creating and running application and Getting started with ReacJs in OSX

1) Install Xcode and Xcode command lines tools.

Get Xcode from Mac App Store. Click Here

2) Install Xcode Command Line Tools, Open terminal and run following command.

xcode-select --install

3) Install Homebrew, Homebrew is a package manager to install missing package on OSX. Open terminal and run following command.

ruby -e "$(curl -fsSL https://raw.githubusercontent.com/Homebrew/install/master/install)"

4) Install NodeJs and NPM. React comes package in NPM so we have to install it. Run following command in terminal

brew install node

After installation check with following command to see if it's installed.

node -v

npm -v

5) Next we will install React, run following command in terminal.

npm install react

6) Now we will install Command line utility to create react app. Run following command in terminal.

npm install -g create-react-app

7) Create new react app. Run following commands in terminal.

create-react-app ReactApp
cd ReactApp
npm start

It should display following message in terminal.



And it will open ReactApp in your default browser.




That's it, Now you can work on ReactApp code and just refresh it in browser to see effect. Hope this helps you.

Graduate From WhatsApp University

Strange title, right? Since WhatsApp was launched, it has phenomenal number of users. I should say people are addicted to it now. After WhatsApp many other messenger apps came and went but it could not affect WhatsApp. WhatsApp users were never decreased and it's increasing year by year. That is good, everyone should be connected to social world through technology and WhatsApp is doing phenomenal job in connecting people with features like chats, voice calls, video calls and groups it's allowing users to stay in touch with others. On WhatsApp daily billions of messages are sent and received.  If there is a breaking news it can go viral in matter of minutes in WhatsApp. But here question is are all those messages and facts exchanged over WhatsApp true? At what level we should trust the information on WhatsApp? 

Unfortunately the situation right now is everyone trust WhatsApp information blindly. They don't go in depth of information. They don't even try to verify it twice before assuming it to be correct. That's why I gave title to this post as 

"Graduate From WhatsApp University" 

I have seen this lot of time. Everyone believes that if it's on WhatsApp, it's true. Many of them show off their knowledge because they read it on WhatsApp and even when you ask for proof, they say it's on WhatsApp, isn't it enough?

No it's not enough, WhatsApp is not reliable source of fact of information. Sometimes it's true that informations on WhatsApp are correct but not every time. WhatsApp is the source used to mis lead the people and it's also a source to circulate propaganda and unfortunately this propaganda becomes fact as soon as it's over WhatsApp and every one believe it. 

So if you are addicted to WhatsApp, please make sure you don't become "Graduate From WhatsApp University" All the information on WhatsApp are not correct. Think twice before you believe it and forward it to someone else. It may create panic among users and you may become victim of fraud. For example, read one of my blog here on how fraud information are circulated on WhatApp and how you can be safe from it.

Online Shopping Fraud

I am not denying that, WhatsApp is source of knowledge and information. People share information on their fields and as well as other fields. But they don't check about facts of information of other fields. As soon as you got some information, you just forward it to others and it became viral. So it's possible that some information might be mis leading or wrong but since it is on WhatsApp it become fact. 

Take my example, I am a computer engineer but if I show off my knowledge of economics by reading it from WhatsApp, I will be a Graduate of Economics from WhatsApp University. But I don't want to be that and that's why I published this post.

So moral of the story is don't be a Graduate From WhatsApp University. First of all check for the facts and see if information is correct or not and then forward it to someone else and show off it to someone else.

Chatbots should be Smarter

Recently I published a blog on Why business will need a chat bot. You can read it here.

Why Each Business Will Need A Chat bot

In that blog I mentioned that this bots need to be very very smart to interact with humans. The algorithms should be powerful to have conversation with humans because humans will do every possible tricks to trap bots and sometime it fails. Survival of fittest, rule of Darwin is applicable to AI as well. Only strong and intelligent algorithm will survive. If you are creating bot make sure you make it really smart, then only it will survive.

Lets start blog by one incident I recently had with bots. I was working with Amazon AWS and faced some issue in it and solved it my self so as per my practice I immediately published a blog and published on twitter. Following is my tweet.

And I got reply from AWS twitter bot.

Technically bot is not wrong as I mentioned word "not working" in my tweet but that was my blog title but it understood as an issue and replied with suggestion so it's not complete fail but as I mentioned bots need to be smart enough to identify what exactly customer needs and reply to it.

Along with Artificial Intelligence a chat bot needs Emotional Intelligence (EI) to understand human emotions. As we move into the future, AI needs humanizing qualities to improve the way it interacts with us, meets our needs for information, and even controls the other technology around us. As AI becomes more ubiquitous, society needs chat bots to become emotionally intelligent if they are to be used to their full capabilities. Humanizing the chat bot is the next step toward a more connected and integrated future. Blending technology with human capabilities such as emotion and empathy can revolutionize the workplace and other facets of life. In my opinion, smarter AI is one of the most exciting prospects of the future.

Tips for Better Audio Recording

Hello,

This is again bit different blog than programming. Recently I worked on a video course for Packt Publishing. You can find more details on it from following link.

Beginning Laravel

This is video course where I have to speak and work on computer and my computer screen and audio will be recorded to create the course.  Packt Publishing team gave me good tips and suggestions for audio recording. In this blog I am going to explain some more tips which I used while recording and that really helped me lot.

Tip 1 : Prepare a script and stick it in front of you

When you are doing work on computer and at the same time you have to explain what you are doing. It may be possible that you may lost the flow and you forgot on what to speak. So to avoid this, it's better, you write down everything from beginning to end and put it on paper and stick that paper in front of you while you are recording so either you can simply read from it or in case when you forget something and confused in what you have to speak, you can look into the paper in front of you and start reading from it. If you can stick each single paper in front of you that will be good. This way you don't have to flip paper as flipping paper will also make some sound and that may spoil your recording. For one of the video which I recorded, the script was of six pages and I set each paper in front of me on cardboard so I can easily read it. You can either type the script and take print out or it can be hand written but make sure you have good hand writing so you don't have any difficulty in reading it.

Tip 2: Record after mid night

For audio recording, you need a quite place. Best place is recording studio but you can afford it for small course so either have do it at home or some other quite place. But at every place there is some disturbance of out side sounds. For example I tried a weekend home but it was remote place and there were lots of bird around it so there was constant sound of tweeting. My office is near to highway so there is constant sound of vehicle passing by.  So best time for the recording is at mid night at home around 3:00 AM in night. At this time you will not have any disturbance as people around are sleeping and there is no vehicles coming and even birds are sleeping so there will be a quite atmosphere and you can record everything easily.

Tip 3 : Practice it couple of times before final recording

As a programmer I can write code easily as nobody is watching my screen so if I make any mistake that will be fine. But recording the screen is different scenario. If you make a mistake you may have to redo everything again so it's better to have some practice before you go for final recording. Practice entire flow couple of times so that you will have good confidence. So when you go for final recording, you can easily do it without any issue as you had a good practice of it and you don't have much retake of your recording. 

Beginning Laravel Video Course

Here is something unusual I did apart from programming. My first ever video course "Beginning Laravel" with Packt Publishing

In this course you will learn about basics of Laravel Development. First section is about installation of Laravel. This section will start with introduction of Laravel and installation of Laravel in Mac, Windows and Linux. Then we will cover, basics of Laravel including, understanding of Framework Structure, basics of Artisan Commands, Composer, Core Concepts of Laravel, MVC structure, Database Migrations, Laravel Controllers, Models and Views etc. In last section
We will finish this course by creating simple Web application with Laravel which will have CRUD operations and basic validations in final section, this will help you getting started with Laravel Development. If you are interested in learning Laravel then this is the course you are looking for. You can buy it at following link.

Beginning Laravel Video Course

Hope you will like this course. Let me know your feedback in comments.

PHP Debugging - Look for Case Sensitivity In Variable, File Names and Class Names

This blog is coming out of conversation with one of the developer in my team. He recently made some changes in API in local development and push code to test server. But on server it was throwing an error and API was not working. So after trying hard for sometime he came to me and asked for help. He showed me lines of code he has added and as an experienced person I immediately caught his error. The problem was, he declared variable in lowercase and was using variable with uppercase in next line and that's what breaking on server. Something like this

$var = new Class();
$VAR->prop = value;

Case sensitivity is one of the major reason for errors while you are working on local development environment with XAMPP, WAMP in Windows. At this time case sensitive is not applied and it will  treat

$var;
$VAR;
$Var;

as one and the same variables. But when you are working on server, you have unix / linux operating systems like Ubuntu, Fedora etc. At this time case sensitivity is applied and

$var;
$VAR;
$Var;

Are treated as three different variables. So by mistake if you declare it with lower case and try to use it upper case, it will give you an error. So if you are facing this issue that, code works on your local machine, but does not work on server look for the case sensitivity.

Same goes for the filenames and class names. If you have adde file with name

Myclass.php

and if you include it with

include 'MyClass.php';
require 'MyClass.php';

Then it will not be able to find file and it will throw warning or fatal error if you are using require. So make sure that you maintain case sensitivity while naming your class, variables and files in PHP because ultimately your code will be pushed to UNIX / LINUX server and it is case sensitive. 

Why Your Business Needs A Chat bot

Recently we have been discussing to add a chatbot for our new venture and that lead me to write this article on why a business will need a chatbot and what are the advantages of it.

What is a Chat bot?

In a very simple definition, a chat bot is a computer program designed to simulate conversation with human users, especially over the Internet.

So yes a chat bot is nothing but a computer program which can handle communication with users over the internet using the smart and artificial intelligence programmed in it by the developers. So in a way chat bot is your virtual customer care executive which does not exits in real life but it's in computer. Many of the businesses and website have real time talk to customer care on their website. You start a chat and in few moments you got a reply from one of the executive. But may times it's not human it's bot replying to your queries and helping you in finding a solutions to your problem. It talks like human, it behaves like human and it lead conversions like human but the fact is it's chat bot program which is replying to you. Many of the businesses are using the chat bots successfully and many of the companies are developing chat bots. Real challenge right now in chat bot development is that you have to make it really really smart to handle all types of conversation and with the increasing use of Artificial intelligence, machine learning and deep learning, natural language processing chat bots are becoming smarter and smarter. Even smarter than human as well. 

One of the biggest trends in social media, specially social messaging apps, are bots and bot stores. Technology analysts predicted that bot stores will be the biggest thing since the rise of app stores. in 2017 we will see many developments on chat bots. Most of the businesses will opt for chat bot services to improve their business practices and customer care. Here are some reasons on Why Your Business Needs a Chat Bot

1) 24 X 7 Customer care

Computer do not eat, computer do not sleep, it needs only constant power to be on for 24 X 7 hours. So if you are using chat bot for the customer care, your customers will get 24 X 7 hours services. They can contact you any time and your bot will reply to them on behalf of you. This way your customer will be much satisfied and you can attend customers queries across the globe and different time zones. You don't need a call center and team of executives to handle it and it's cost effective too as you don't have to pay salary to customer care executives and do not need to invest in customer care center infrastructure, just invest in a chat bot and it will work for you all the time.

2) Better Customer Engagements with Buying Influence

Most of the companies selling online their services and products are using chat bots customer engagement. A customer browsing through your websites, products and services online on your website and chat bot can give more options to your customers based on customer preference and it will be more interactive experience to your customers and users as they feel it as a very personalized approach and they will be happy with this and you will get better customer engagements with this. Also chat bot can ask for the user preferences like what style they want and what brand they want and based on that, it will suggest the buying options thus influencing customer with more buying options.

3) Boost Social Media Engagement

In April, Facebook announced it would be opening up its increasingly influential Messenger platform in beta — and allowing brands to start using chatbots there. Not only can this help brands to achieve better sales, but it’s also a natural way with which to bolster social media engagement. By deploying a useful chatbot on Facebook, you’ll be far more likely to attract users on to your business page – where you are hopefully already bending over backwards in order to drive sales and engage with consumers on a personal level.

4) Simplify Your Business Processes

A chat bot is not just for the customer care and sales, it can even help you with your businesses. A custom chat bot designed for your business can help you simplify your business processes and let you be more productive in your business. A chat bot can also take business decisions based on certain parameters and help you in maintaining flow of your business.

In a way, chat bot is going to take industry by storm in upcoming years and chat bot will act as

• Your lawyer
• Your personal stylist
• Your personal assistant
• Your doctor
• Your financial advisor
• Your teacher
• Your Accountant

and many more you can imagine.

5 Best Examples of Internet of Things in Real Life

What is the Internet of Things?

Now a days we hear lot about this phrase, Internet of Things or IOT. The IoT refers to the connection of devices other than typical fare such as computers and smartphones to the Internet. So any device other which is able to communicate with Internet can be referred as IOT. So your smart car, wearable devices like heart monitors, your kitchen appliances or your smart TV can be considered as IOT as it's able to communicate with internet for different purposes. So a network of internet-connected objects able to collect and exchange data using embedded sensors and any stand-alone internet-connected device that can be monitored and/or controlled from a remote location is considered as Internet of Things. IOT is really growing in market. HP did a small survey in which they estimated the rise of connected devices over the years and the results are surprising. By 2025 1 trillion devices will be connected to internet. These devices will bridge the gap between physical and digital world to improve the quality and productivity of life, society and industries. 

Here are 5 Best Examples of Internet of Things in Real Life

1) Intelligent Fridge by Samsung

The ‘Family Hub’ refrigerator is equipped with a 21.5 inch HD LCD resolution screen, which allows consumers to use a calendar, post content, pin photos or write your notes. Additionally, you can look inside their fridge at any time with the help of cameras that are embedded in the fridge itself. Lastly, healthcarethe consumer can use the fridge to purchase things online, manage recipes and compile and compare shopping lists. You can read more about it from following link.

Samsung reveals 'Family Hub' fridge 

Family Hub Refrigerator

2) Apple / Samsung Smart Watch

And the most talked company of gadgets and devices. Apple has changed the world with its inventive and ultra-modern devices. Be it phones, laptops or any other electronic device, Apple has itself strongly established. The Apple watch is the example of how advanced the technology is at Apple. Apart from time and date, the Apple watch enables you to keep a track record of your health and daily activities.  Samsung also have launched the smart watch samsung gear S3 to take on Apple watch. You can read more about this at following links.

Samsung Gear S3

Apple Watch

3) Philips-Hue Bulbs

Philips hue bulbs have now stepped into a new stage of innovation with these smart bulbs. Linked with your mobile phones, you can now actually control the intensity of lights on your fingertips. The combination of bulb with mobile technology is next thing for your home. Instead of going for different watt of bulbs to suit the mood and the environment, simply change the intensity from dim to medium to full using your phone. You can read more about it from following link.

Philips-Hue

4) Connected Mascara by L’Oreal

L’oreal is working on interactive cosmetics, able to give its customers a useful how-to content. Imagine your mascara suggests you what type of make-up should you choose to match your outfit. Insane? Actually, it may become part of our everyday reality pretty soon. You can read more about it from following link.

Connected Mascara

5) Mimo Monitors

They have been around for some time now. Mimo Monitors are not only affordable but also presents a new technology. Used for several business purposes, this loT has been making things easier, simpler and is said to be very productive. But now Mimo Monitors offers something unique and unexpected. The technology now enables you get updated to your baby’s body position, their breathing level, body temperature, response to activities and health.  More you can read it following link.

Smart Baby Nursery

It's All About Object Oriented Programming (OOP / OOPS)

Hello and welcome to next post of the series "Freshers to Professional" blog. In case you missed previous blogs, you can read here.

Part 1 : Because All The Leaders Were Developers Once
Part 2 : Some of the Greatest Programmers of All Time
Part 3 : How to be a Good Developer and Professional

Now we will cover some of the basic fundamentals that you should be clear with, when you start your carrier as fresher. In this post we will see about Object Oriented Programming commonly referred as OOP or OOPS.

This is most important fundament of software engineering now a days. When I interview a freshers of the post of the developers, this is my first question to them. "Tell me Three Main Principles of Object Oriented Programming". When someone fails to answer this question, I do not go further in interview and let them go. In my opinion every fresher should know about concepts of OOP. That's the crux of software development. Now a days no matter what language you use, all of them supports OOP. Be it JavaScript, PHP, C# or Java or anything all of them support OOP only implementation if different and if you are clear with fundamentals of OOP then you can implement in any of the languages. As fresher this is what is expected from you and that's why language like C++ and Java is included in almost all the courses of Computer science.

During my tenure in IT industry, I have interviewed many freshers and very few time I get satisfactory answer on concept of OOP. Some freshers knows only the name of concept but they can not explain it further. Some of them can explain it but with great confusion. When I ask them why they don't know about it, they say "We think it's not important" Now that's the biggest mis understanding. OOP is followed in most of the development in business applications. So you should be clear with fundamentals of OOP.

Why OOP was introduced?

Object oriented programming concept was created because of the need to overcome the problems that were found with using structured programming techniques. In earlier days programmers used to write many lines of code because OOP was not there. With the the OOP number of lines of codes is reduced because it makes your code reusable and easy to maintain. Any business application is going to change over the period of time and these changes should be easy to do. With OOP it is possible now. Major frameworks are built on concept of OOP and when you are using that framework, you should be knows how the OOP is used in there. Then only you will be able to work with it. Major software design patterns like MVC also works on OOP.  So no matter what language you use, OOP is involved in it. So it is required that you understand OOP concepts and use it in your work.

Also there are other advantages of OOP

• Code Reusability
• OOP  provides a clear modular structure for programs
• OOP makes it easy to maintain and modify existing code 

Now lets see the three main principles of OOP.

Abstraction / Data Encapsulation / Data Hiding

Encapsulation is an Object Oriented Programming concept that binds together the data and functions that manipulate the data, and that keeps both safe from outside interference and misuse. Implementation details of a class are kept hidden from the user. The user can only perform a restricted set of operations on the hidden members of the class by executing special functions commonly called methods.

So for the simple example, when you implement a class and define private members of the class, those members will be accessible only inside of the class. If you want to expose some of the functions and members to outside world, it will be declared as public. Here are some of the key things related to Abstraction / Data Encapsulation

• Class
• Abstract Class
• Static Class
• Static Methods
• Modifiers like public, private
• Constructor
• Friend Functions

I will not give details about it as there are tons of articles available over the internet.

Inheritance

One of the most important concepts in object-oriented programming is that of inheritance. Inheritance allows us to define a class in terms of another class, which makes it easier to create and maintain an application. This also provides an opportunity to reuse the code functionality and fast implementation time. When creating a class, instead of writing completely new data members and member functions, the programmer can designate that the new class should inherit the members of an existing class. This existing class is called the base class, and the new class is referred to as the derived class.

Here are some the key things related to Inheritance.

• Single Inheritance
• Multiple Inheritance
• Multilevel Inheritance
• Hybrid Inheritance
• Overriding
• Modifiers

Polymorphism 

Polymorphism is the ability of an object to take on many forms. The most common use of polymorphism in OOP occurs when a parent class reference is used to refer to a child class object. One function with different parameters is also referred as polymorphism. Polymorphism usually comes to picture when we use inheritance and when we have parent and child class relationship.

Here are some the key things related to Inheritance.

• Method Overriding
• Method Overloading

So learn about OOP understand it's principles and other related stuff mentioned above if you want to establish yourself as good developer.

Top 5 Real Word Examples of Artificial Intelligence

The machines haven't taken over. Not yet at least. However, they are seeping their way into our lives, affecting how we live, work and entertain ourselves. From voice-powered personal assistants like Siri and Google Assistant, to more underlying and fundamental technologies such as behavioral algorithms, suggestive searches and autonomously-powered self-driving vehicles boasting powerful predictive capabilities, here are several examples and applications of artificial intelligence in use today.

1) Siri in iPhones and Google Assistnat in Android

Everyone is familiar with Apple's personal assistant, Siri. She's the friendly voice-activated computer that we interact with on a daily basis. She helps us find information, gives us directions, add events to our calendars, helps us send messages and so on. Siri is a pseudo-intelligent digital personal assistant. She uses machine-learning technology to get smarter and better able to predict and understand our natural-language questions and requests.

To take on Siri Google recently introduced Google Assistant. The same voice operated software like Siri to do things on your android phone . You can ask it anything like to search places, translate between languages, calculate something etc. You can tell it to do the things like setting up reminder, send message, call contact.

2) Tesla

Tesla is quite possibly one of the best cars ever made. Not only for the fact that it's received so many accolades, but because of its predictive capabilities, self-driving features and sheer technological "coolness." Anyone that's into technology and cars needs to own a Tesla, and these vehicles are only getting smarter and smarter thanks to their over-the-air updates.

3) Nest

Nest is the most famous name in Home Automation Technology. Most everyone is familiar with Nest, the learning thermostat that was acquired by Google in January of 2014 for $3.2 billion. The Nest learning thermostat, which, by the way, can now be voice-controlled by Alexa, uses behavioral algorithms to predictively learn from your heating and cooling needs, thus anticipating and adjusting the temperature in your home or office based on your own personal needs, and also now includes a suite of other products such as the Nest cameras.

4) Alexa

Alexa is other famous name in Home automation technology. When Amazon first introduced Alexa, it took much of the world by storm. However, it's usefulness and its uncanny ability to decipher speech from anywhere in the room has made it a revolutionary product that can help us scour the web for information, shop, schedule appointments, set alarms and a million other things, but also help power our smart homes and be a conduit for those that might have limited mobility.

5) Netflix

Netflix provides highly accurate predictive technology based on customer's reactions to films. It analyzes billions of records to suggest films that you might like based on your previous reactions and choices of films. This tech is getting smarter and smarter by the year as the dataset grows. However, the tech's only drawback is that most small-labeled movies go unnoticed while big-named movies grow and balloon on the platform.

Top 5 Real World Examples of Machine Learning

What is Machine Learning?

Machine learning is a type of artificial intelligence (AI) that provides computers with the ability to learn without being explicitly programmed. Machine learning focuses on the development of computer programs that can change when exposed to new data.  Evolved from the study of pattern recognition and computational learning theory in artificial intelligence, machine learning explores the study and construction of algorithms that can learn from and make predictions on data. The process of machine learning is similar to that of data mining. Both systems search through data to look for patterns. 

Machine learning is now widely used by many software manufactures. Most of the IT companies are now investing in Machine learning. Developers are working on creating complex algorithms to enhance machine learning in systems and provide more intelligence to end users. Here in this blog we will see five real world examples of machine learning.

1) Word prediction and corrections in Office 365 by Microsoft

Just when you thought Google's AI products are the best, Microsoft strikes back with AI in Microsoft Word that blows away Google Docs. The recent version of office 365 has mind blowing machine learning added in word prediction and corrections. It just don't correct it but it will also learn from your way of writing and learns the words which you use frequently. It's really awesome. You can read more about it on following link.

The machine learning in Microsoft Word's new Editor is scarily good

2) Facebook and Machine Learning

Facebook builds its business by learning about its users and packaging their data for advertisers. It then reinvests this money into offering us new, useful functionality – currently video and shopping - which it also uses to learn even more about us. Facebook achieve its goals of providing greater convenience to users, and enabling them to learn more about us. You can read more at following link.

The Incredible Ways Facebook Uses Machine Learning To Get To Know Us

3) JP Moragan Software COIN

The program, called COIN, for Contract Intelligence, does the mind-numbing job of interpreting commercial-loan agreements that, until the project went online in June, consumed 360,000 hours of work each year by lawyers and loan officers. The software reviews documents in seconds. COIN is just the start for the biggest U.S. bank. The firm recently set up technology hubs for teams specializing in big data, robotics and cloud infrastructure to find new sources of revenue, while reducing expenses and risks. Read more at below link.

JPMorgan Software Does in Seconds What Took Lawyers 360,000 Hours

4) Google's Self Driving Cars

Google's self-driving cars can tour you around the streets of Mountain View, California. Google has mapped 2,000 miles of road. The US road network has 4 million miles of road. Google's team uses machine learning algorithms to create models of other people on the road. Every single mile of driving is logged, and that data fed into computers that classify how different types of objects act in all these different situations. While some driver behavior could be hardcoded in ("When the lights turn green, cars go"), they don't exclusively program that logic, but learn it from actual driver behavior. You can read more about it on following link.

Waymo

5) Google Maps use Machine Learning to Predict Parking Difficulty

Google Maps now tackles parking problems as well. Google quietly launched a new parking feature for Google Maps on Android across 25 major US cities. If you are in these metro areas, you will now see a red parking sign that indicates limited parking availability to help you plan your trip. The interesting part of this update is that it does not rely on internet-connected parking meters; which often provide incomplete or wrong information due to illegal parkers or those who depart early from their spot. Instead, Google Maps combined crowdsourced data and relatively simple machine learning algorithms to classify parking difficulty. You can read more about it at following link.

Using Machine Learning to Predict Parking Difficulty