JavaScript Promise Example | JavaScript Promises | Promise.all() | Promise.race()

In JavaScript we uses promises for handling async API calls.  In JavaScript the  Promise takes one argument as a callback containing 2 parameters resolve and reject.

If promise is fulfilled the resolve function will be called and if promise is not fulfilled  reject function will be called.

Let me explain with some example:

Here in this example I have defined 2 promises one is classResult and other is gotMedal. classResult and gotMedal returns promises. If promise resolved then code block executes else catch code block executes. ...  Read More

Share This:


React application setup with webpack 4 and babel 7 | React setup from scratch | React setup tutorial

react-setup

Now a days React.js is very popular library for the front end developers. Today I'm going to discuss a very important topic to start the react.js development.

Just to start with React.js we should know how to setup react js application.

I'm assuming you have installed node.js and NPM in your system.

Actually there are 2 ways to setup the react.js application at your system.

  1. React.js provides you facility to create the react application through the CLI (command line interface). Let me tell you how ? You know you just need to run only 2 command and you are ready for development.

    You'll can install create-react-app globally to your system so that in future you will not need to install it again. What you will need is just type create-react-app your-app-name .Here my-app is your application name. You can change it whatever name you wanted to your application.
  2. You can setup the react application with your custom configuration with the help of webpack and babel. Without going more theoretical let me explain the steps to setup the react application using webpack and babel.

 

Let suppose I have a directory react-setup and I'm into this directory.

Create a file named as package.json and inside package.json I have added all the dependencies which I need to run a react application. I also have setup the script commands for running project in development and to create the production build.

Now go to project directory which is react-setup. And run the command

This will install all the dependencies inside node_modules folder. All the dependencies has been added in package.json ...  Read More

Share This:


Switch PHP Versions on Ubuntu | How can I downgrade from PHP 7 to PHP 5.6 on Ubuntu 16.04? | How to install PHP on Ubuntu?

We often work on multiple projects and there might be possibility the you are working on a project which has been developed in latest PHP version and another project has been developed in older PHP version.

I faced the same challenge in my projects and here in this article I'll explain the installation of PHP version 7.0 and 5.6.

We also will be upgrading and downgrading PHP versions. We will not uninstall and PHP version we will keep both versions of PHP but we will switch PHP version according to our need. ...  Read More

Share This:


Securely Hash Passwords with PHP | How to work with users' passwords and how to securely hash passwords in PHP?

Hashing passwords with md5 (or sha1, or even sha256) is not safe anymore, because these hashes can be decrypted very easily.This is still not good enough though (rainbow tables). PHP 5.5+ came with a password_hash function to generate secure, one-way hashing along with a password_verify function to match a hashed password with the given password. For a developer security is always a priority so you should always be securely storing user passwords. We has passwords due to security concern and information leakage concern. If we store passwords in plain text then it can be compromised of information very easily. ...  Read More

Share This:


Laravel folder permissions

After installation of Laravel you will require to configure some folder permissions. Currently till Laravel version 5.2 we require to set the permission of 2 folders.

  1. storage
  2. bootstrap/cache

These both folder need writable permission. Because we write the logs in storage folder and save cache in bootstrap/cache folder. Most of the developers set permission 777 to these folders.

Never ever set permission 777 to the folders until it is required. If you are giving 777 permission you are allowing anyone to Read, Write and Execute the files. If you are giving writable and executable permission then it's big security concern. ...  Read More

Share This:


Copy to clipboard example in JavaScript/jQuery | How To Copy to Clipboard

copy-clipboardCopy to clipboard can be used to make easy for a user to copy a particular text. User will not need to select the text first and then copy it. This can be achieved with just a button click.

I'm going to explain copy to clipboard by using JavaScript/jQuery. It also execute copy command to copy the content.

Here is the code for copy to clipboard in JavaScript/jQuery. Like i have created a index HTML file.



index.html

When you click on copy button we get the text and pass it to copyToClipboard() function. There I created a temporary input text field and assign that message to the input text field. Then I select the input text by select() function and execute the copy command by execCommand() function. After executing the copy command I removed the temporary text field. Whenever the message is copied you will see the copied! message also. ...  Read More

Share This:


Draw Lines on Google Map using JavaScript API

draw-path-on-google-map (2)If you wanted to represent geographical locations on Google map, You might need to draw the lines on Google map. Here in this article I'll explain how to draw the path among the locations by using Google map JavaScript API.

I'll create an array of locations in PHP and I'll also define the API key in PHP. Later I'll iterate every address and draw the path among all the locations.

You can change the center of the map by changing the latitude and longitude here:

You also can change the zoom level of the map here:

Here is the source code for drawing the path on Google map:



index.php

  ...  Read More

Share This:


Node.js & Redis App | Search user in Node.js and Redis | Register user in Redis database in Node.js | Delete user from Redis database in Node.js

Many of the applications use Redis for improving the application performance. Redis is not only used for the caching purpose. Redis supports many of the data types. Redis also support publish and subscription functionality. We can cluster the Redis database. Redis serve as in-memory, key-value data stores, although Redis is more accurately described as a data structure store.



Here in this article I'm going to use Redis with Node.js. I'll register the user in Redis database by using hmset command. I'm assuming that you have installed Redis, Node.js and NPM on you machine. ...  Read More

Share This:


How to draw the route in a map with points on Google Maps

Draw path on google mapMany of the location Apps we need to draw a path from origin to destination. We need to draw path between some locations.

I'll be drawing the path by two modes. Either you are walking or you are driving. I'll be showing optimize way points for the travel path.

Here I'm using Google Map JavaScript API for drawing the route between the points on Google Map. You can draw the path among multiple points so it is not restricted to create path between two points or three points.



I have created a PHP file where I have defined the Google map API key and the way points where you can draw the route path. I have created an array of way points you also can fetch these way points from your database if needed. ...  Read More

Share This:


How to pretty JSON fromat using JavaScript/jQuery?

Pretty JSON example

Pretty JSON example

So many time we required ti print the JSON in pretty format because it is easy to read and understood. As we know JSON (JavaScript object notation)  is a lightweight data-interchange format. It is easy for humans to read and write.
In this article you will learn how to print JSON in pretty format at browser.



Here is the CSS code create a new css file named as stylesheet.css.
stylesheet.css

I have used CSS for highlighting the key, value and strings.
Here is the JavaScript and HTML code to print the JSON in pretty format.



index.html

Here in JavaScript I have cerated a function to make the JSON in pretty format. Here we have a products JSON and we are printing products JSON in pretty format. ...  Read More

Share This: