Category

Courses

Search

Trending blog posts

Introduction to Mongo DB

MongoDB, a highly scalable No-SQL database, is used for storing information in the form of JSON strings, where the structure of the table is not fixed (unlike in SQL database). So, the advantage here is that with the help of MongoDB, we can make quick changes in our entities without actually changing the database. MongoDB is available in multiple variants and what you choose would depend on the type of development you are looking for. You can download and install the relevant server as per your operating system from here.  If you are already a Mongo user then you may have had the chance to work with the huge number of operations that Mongo provides for storing and retrieving information in a database.If you want to brush up the same before starting on this article, refer to the basics of MongoDB here. In this article, we will learn about how we can use a MongoDB database with NodeJS.  But before do that, let’s delve a little into NodeJS. Getting started with NodeJS  So what is Node JS, and why do we use it? NodeJS is a backend JavaScript runtime environment that has become a favorite with developers and designers alike, due to the marvellous advantages it offers such as minimalism, speed, and compatibility with JavaScript. Not just individual programmers but world-class top tech companies around the world are using NodeJS as their backend tech stack because of the advantages it offers.   The beauty of NodeJs lies in the fact that it allows developers to write frontend abstractions with backend written in NodeJS. We will write our first NodeJS program here but before that, we have to install NodeJs, which is pretty straightforward. Installing NodeJs Plugin for MongoDB:Follow these steps to install Node JS  Install NPM (Node Package Manager).  The Node Package Manager) plugin is used to install various NodeJS plugins with a single command. Double-check that you have npm installed in your system by simply running this command in your terminal: $ npm -v[Text Wrapping Break]6.13.6  Install the Node from NodeJs Website >> NodeJS.   See the type of Operation system and download the version as per your platform compatibility.  Follow the installation guide as suggested by the installer.  Check the node version by running this command in your terminal  $ node -v[Text Wrapping Break]v8.11.4  If you have installed Node before NPM, you will probably need to update your NPM.   npm install npm@latest -g  Installing MongoDB Node.js Driver  The Mongo NodeJS driver allows us to interact with the MongoDB databases from NodeJs applications. To install MongoDB Node.js driver, run this command in your terminal.   npm install mongodb   To see the list of current drivers installed in the system, run the following command:  npm list mongodb  If you are stuck or have issues with installation of the drivers, then this official documentation is a good reference to go through.  Now that we are ready with both the database and NodeJS backend, let’s move ahead and create a simple NodeJs project. The aim of this project is to insert and retrieve information from the database. Using Node.JS to connect to MongoDB database   To do this, we will write a simple Node.js script which will connect to our database. And then we will perform an operation to list all the databases in our cluster.Cluster? What is a cluster?     A cluster is nothing but a set of nodes that carry the copies of your database. At a high level, you can say, your database is stored inside a cluster. To work on databases with Node, the easiest way is to use Atlas service which is MongoDB’s fully-managed database. If you are still unfamiliar with these terms, you can go through the complete documentation here.    Connecting MongoDB  Now that we have all our installations in place, let’s get started with connecting our database from NodeJs. Let’s Code! We will begin with Importing the Mongo Client as shown below: const {MongoClient} = require('mongodb');  To connect to the MongoDB database we have to import the MongoClient class from the MongoDB module, the instance of which can be used to connect to the cluster or for accessing the database from that cluster. Next step is to use a Main() function, where we can call other functions and can get connected to MongoDB cluster. const uri = "mongodb+srv://<put-your-username>:<put-your-password>@<write-your-cluster-url>/test?retryWrites=true&w=majority";   Note: You need to update your password and username for the user. Now that we are ready with our URI, create an instance of MongoClient as below: const client = new MongoClient(URI);  Your instance is ready, so now you can use MongoClient to connect to the cluster by calling client.connect() as below:  await client.connect();  We have used the await keyword so as to ensure that it blocks any further execution until our operation is completed. And that’s it. We are ready to interact with our database. Let’s try it out by simply printing the list of all the databases in our cluster.  await listAllDatabases(client);  You can put any name to the above function. The next step is to finally put all the functions together and wrap them in a try/catch block in order to handle any errors. try   await client.connect();   await listAllDatabases(client);catch (e) {    console.error(e);}  And, close the connection as below:  finally { await client.close(); }  No, let’s put everything together and call our main function() as:  async function main(){ const uri = "mongodb+srv://<your-username>:<your-password>@<your-cluster-url>/test?retryWrites=true&w=majority"; const client = new MongoClient(uri); try {// Connect to the MongoDB cluster await client.connect(); // Here make the DB calls or some operations await  listAllDatabases(client);  catch (e) {    console.error(e); } finally { await client.close(); }  Break]main().catch(console.error);  //To see if there are aby errorsLet’s use our function “listAllDatabases” to list all the databases in our cluster.  async function listAllDatabases(client){  databasesList = await client.db().admin().listAllDatabases(); console.log("Databases List Is:");[Text Wrapping Break]    databasesList.databases.forEach(db => console.log(` - ${db.name}`));};  If you can’t wait to see your output, then all that is left to do is to save it. Save your file as list.js.  Time to execute the NodeJs script. Let’s execute the script by running the following command in our terminal:  (Ensure that the server is running and up!) node list.js  The output should come as below:  Databases: - data_books - data_gates - data_houses - data_nodes- data_tables- admin - local  Now that we are running with the database, let’s see the different data types they are supported on.  Mongo DB data types Have you heard of BSON? BSON is a binary-encoded format of JSON. Documents in MongoDB are stored in the format of BSON. Here is a list of typically used data types supported by MongoDB: String − It is used to store the data. It should be UTF-8 valid. Integer − This data-type is used to store a numerical value. Depending on our server, Integer can be either of 32 bit or 64 bit. Boolean − To store a boolean (true/ false) value we use this type of data type. Double − Used for storing floating-point values. Arrays − This type of data-type is used for storing list or arrays. Timestamp - This type of data-type is used to check if an element has been modified or added. Min/ Max keys − We can use min or max data types for comparing the value against the lowest and highest BSON elements and vice-versa. Object − This data type stores embedded documents. (A document that contains another document in the form of the key-value pair) Null − This type of data-type is used by MongoDB to store a Null value. Symbol − It is not supported by a shell, but if it gets a symbol from the database, it is converted into a string. So it’s quite identical to a string data type. Regular expression − These MongoDB data types stores regular expressions in MongoDB. It maps directly to JavaScript Regular Expression. Date −  This type of data-type is used to store the date or time. We can also use our date or time by simply creating an object of Date and passing elements like day, month, year into it. Object ID − Mongo uses this type of datatype to store the document’s ID. Binary data − Typically used to store binary data. Mongo DB and Collections  A database can have multiple collections. A collection is a table that contains all your documents. We can create a collection as follows:  const collection = db.createCollection(name, options), or  const collection = db.collection(‘books’);     where, name is the connection name which can be anything, The option is a configuration document used for specifying the collection and is optional. We can list the following options while creating a collection: capped, autoIndexId, max, and size. createCollection() is an inbuilt method in MongoDB, which is used to create a new collection in database as shown above. Note: In MongoDB, a collection is never created until it gets some content!  db.collection('check', {strict:true}, function(err, collection) {});    So, this code will never create a collection until and unless you specify and insert it in the document.  ConclusionToday we learnt the basics of MongoDB, and how and why MongoDB is compatible with NodeJS. We also looked at how we can connect to our MongoDB database from NodeJS script, and found a cool demo of listing out the names of all the databases in our cluster. There are many activities that we can do with NodeJS in our database which involves the basic CRUD operations like insert, update, remove, or making a query in our collection.  And if you get stuck, see the official documentation of all of them here. It has plenty of features that make our job easier.  Happy Learning! :) 
Introduction to Mongo DB
KnowledgeHut
KnowledgeHut

KnowledgeHut

Author

KnowledgeHut is an outcome-focused global ed-tech company. We help organizations and professionals unlock excellence through skills development. We offer training solutions under the people and process, data science, full-stack development, cybersecurity, future technologies and digital transformation verticals.

Posts by KnowledgeHut

Introduction to Mongo DB

MongoDB, a highly scalable No-SQL database, is used for storing information in the form of JSON strings, where the structure of the table is not fixed (unlike in SQL database). So, the advantage here is that with the help of MongoDB, we can make quick changes in our entities without actually changing the database. MongoDB is available in multiple variants and what you choose would depend on the type of development you are looking for. You can download and install the relevant server as per your operating system from here.  If you are already a Mongo user then you may have had the chance to work with the huge number of operations that Mongo provides for storing and retrieving information in a database.If you want to brush up the same before starting on this article, refer to the basics of MongoDB here. In this article, we will learn about how we can use a MongoDB database with NodeJS.  But before do that, let’s delve a little into NodeJS. Getting started with NodeJS  So what is Node JS, and why do we use it? NodeJS is a backend JavaScript runtime environment that has become a favorite with developers and designers alike, due to the marvellous advantages it offers such as minimalism, speed, and compatibility with JavaScript. Not just individual programmers but world-class top tech companies around the world are using NodeJS as their backend tech stack because of the advantages it offers.   The beauty of NodeJs lies in the fact that it allows developers to write frontend abstractions with backend written in NodeJS. We will write our first NodeJS program here but before that, we have to install NodeJs, which is pretty straightforward. Installing NodeJs Plugin for MongoDB:Follow these steps to install Node JS  Install NPM (Node Package Manager).  The Node Package Manager) plugin is used to install various NodeJS plugins with a single command. Double-check that you have npm installed in your system by simply running this command in your terminal: $ npm -v[Text Wrapping Break]6.13.6  Install the Node from NodeJs Website >> NodeJS.   See the type of Operation system and download the version as per your platform compatibility.  Follow the installation guide as suggested by the installer.  Check the node version by running this command in your terminal  $ node -v[Text Wrapping Break]v8.11.4  If you have installed Node before NPM, you will probably need to update your NPM.   npm install npm@latest -g  Installing MongoDB Node.js Driver  The Mongo NodeJS driver allows us to interact with the MongoDB databases from NodeJs applications. To install MongoDB Node.js driver, run this command in your terminal.   npm install mongodb   To see the list of current drivers installed in the system, run the following command:  npm list mongodb  If you are stuck or have issues with installation of the drivers, then this official documentation is a good reference to go through.  Now that we are ready with both the database and NodeJS backend, let’s move ahead and create a simple NodeJs project. The aim of this project is to insert and retrieve information from the database. Using Node.JS to connect to MongoDB database   To do this, we will write a simple Node.js script which will connect to our database. And then we will perform an operation to list all the databases in our cluster.Cluster? What is a cluster?     A cluster is nothing but a set of nodes that carry the copies of your database. At a high level, you can say, your database is stored inside a cluster. To work on databases with Node, the easiest way is to use Atlas service which is MongoDB’s fully-managed database. If you are still unfamiliar with these terms, you can go through the complete documentation here.    Connecting MongoDB  Now that we have all our installations in place, let’s get started with connecting our database from NodeJs. Let’s Code! We will begin with Importing the Mongo Client as shown below: const {MongoClient} = require('mongodb');  To connect to the MongoDB database we have to import the MongoClient class from the MongoDB module, the instance of which can be used to connect to the cluster or for accessing the database from that cluster. Next step is to use a Main() function, where we can call other functions and can get connected to MongoDB cluster. const uri = "mongodb+srv://:@/test?retryWrites=true&w=majority";   Note: You need to update your password and username for the user. Now that we are ready with our URI, create an instance of MongoClient as below: const client = new MongoClient(URI);  Your instance is ready, so now you can use MongoClient to connect to the cluster by calling client.connect() as below:  await client.connect();  We have used the await keyword so as to ensure that it blocks any further execution until our operation is completed. And that’s it. We are ready to interact with our database. Let’s try it out by simply printing the list of all the databases in our cluster.  await listAllDatabases(client);  You can put any name to the above function. The next step is to finally put all the functions together and wrap them in a try/catch block in order to handle any errors. try   await client.connect();   await listAllDatabases(client);catch (e) {    console.error(e);}  And, close the connection as below:  finally { await client.close(); }  No, let’s put everything together and call our main function() as:  async function main(){ const uri = "mongodb+srv://:@/test?retryWrites=true&w=majority"; const client = new MongoClient(uri); try {// Connect to the MongoDB cluster await client.connect(); // Here make the DB calls or some operations await  listAllDatabases(client);  catch (e) {    console.error(e); } finally { await client.close(); }  Break]main().catch(console.error);  //To see if there are aby errorsLet’s use our function “listAllDatabases” to list all the databases in our cluster.  async function listAllDatabases(client){  databasesList = await client.db().admin().listAllDatabases(); console.log("Databases List Is:");[Text Wrapping Break]    databasesList.databases.forEach(db => console.log(` - ${db.name}`));};  If you can’t wait to see your output, then all that is left to do is to save it. Save your file as list.js.  Time to execute the NodeJs script. Let’s execute the script by running the following command in our terminal:  (Ensure that the server is running and up!) node list.js  The output should come as below:  Databases: - data_books - data_gates - data_houses - data_nodes- data_tables- admin - local  Now that we are running with the database, let’s see the different data types they are supported on.  Mongo DB data types Have you heard of BSON? BSON is a binary-encoded format of JSON. Documents in MongoDB are stored in the format of BSON. Here is a list of typically used data types supported by MongoDB: String − It is used to store the data. It should be UTF-8 valid. Integer − This data-type is used to store a numerical value. Depending on our server, Integer can be either of 32 bit or 64 bit. Boolean − To store a boolean (true/ false) value we use this type of data type. Double − Used for storing floating-point values. Arrays − This type of data-type is used for storing list or arrays. Timestamp - This type of data-type is used to check if an element has been modified or added. Min/ Max keys − We can use min or max data types for comparing the value against the lowest and highest BSON elements and vice-versa. Object − This data type stores embedded documents. (A document that contains another document in the form of the key-value pair) Null − This type of data-type is used by MongoDB to store a Null value. Symbol − It is not supported by a shell, but if it gets a symbol from the database, it is converted into a string. So it’s quite identical to a string data type. Regular expression − These MongoDB data types stores regular expressions in MongoDB. It maps directly to JavaScript Regular Expression. Date −  This type of data-type is used to store the date or time. We can also use our date or time by simply creating an object of Date and passing elements like day, month, year into it. Object ID − Mongo uses this type of datatype to store the document’s ID. Binary data − Typically used to store binary data. Mongo DB and Collections  A database can have multiple collections. A collection is a table that contains all your documents. We can create a collection as follows:  const collection = db.createCollection(name, options), or  const collection = db.collection(‘books’);     where, name is the connection name which can be anything, The option is a configuration document used for specifying the collection and is optional. We can list the following options while creating a collection: capped, autoIndexId, max, and size. createCollection() is an inbuilt method in MongoDB, which is used to create a new collection in database as shown above. Note: In MongoDB, a collection is never created until it gets some content!  db.collection('check', {strict:true}, function(err, collection) {});    So, this code will never create a collection until and unless you specify and insert it in the document.  ConclusionToday we learnt the basics of MongoDB, and how and why MongoDB is compatible with NodeJS. We also looked at how we can connect to our MongoDB database from NodeJS script, and found a cool demo of listing out the names of all the databases in our cluster. There are many activities that we can do with NodeJS in our database which involves the basic CRUD operations like insert, update, remove, or making a query in our collection.  And if you get stuck, see the official documentation of all of them here. It has plenty of features that make our job easier.  Happy Learning! :) 
Introduction to Mongo DB
Blogs
10459
Introduction to Mongo DB

MongoDB, a highly scalable No-SQL database, is use... Read More

What Is Ethical Hacking?

The internet brought with it the third revolution; a revolution that has interconnected the world like never before. There are currently 5 billion internet users in the world. And this number only increases day on day. From education to healthcare to communications to transport, the internet has permeated every industry to make our lives easier and more convenient. But is the internet a manna from the heavens? Sadly not. While it has brought with it immense opportunities and innovations, it has also brought with it, threat; threat of breach, fraud and attacks. And foremost among these threats is the threat from hackers.  Hackers are sophisticated criminals who can breach cyber security systems and cause loss of money, credibility and trust. In 2017 alone, hacking cost people $172 billion, while it is predicted that by the end of 2020, the average cost of data breaches will be about 150 million. Apart from the money that is lost, a company that is vulnerable to cyber-attacks also loses face with its customers, making it unreliable. Which is why, to counter these attacks, more and more organizations today are investing in sophisticated cyber security, to protect their data and reputation from hackers.  But how does one know if the security they have in place is fool proof and not susceptible to cyber-attacks? This is where ethical hackers come in. An ethical hacker is a security professional who assesses a system for vulnerabilities that can be exploited for a malicious attack.  Ethical hackers break and build the security for an organization.  They have become an indispensable resource in the security market. Right from ecommerce websites to banks, all organizations are investing in ethical hackers who can assess and put a security system in place.    So, how does one become an ethical/white hat hacker? And what’s the career path in this role? Understanding Ethical HackingEthical Hacking is a legitimate and structured way of hacking, performed to expose the vulnerabilities in the software, web application, or in the network, that can be accessed and exploited by an unauthorized person. Ethical hacking helps secure both your personal as well as an organization’s IT assets.  There are many threat vectors which attackers use to get the access to a website, software or network. Ethical hackers are trained to identify these and fix them before they are discovered by malicious hackers. In organizations, they are often given the role of a security analyst, security consultant security architect etc.  Some of the tasks of an ethical hacker include: Detecting loopholes in a database that can be exploited by any unauthorized person  Finding vulnerabilities in networks that can be exploited by any attacker Educating the employees on how to identify phishing mails and tackle them  Establishing proper security controls on all the devices. Securing your Web applications and websites Securing your organization's network  Regular patching of Infrastructure devices like routers, switches, firewall and servers. Establishing perimeter security to protect the organizational network. Ensuring User and Access based controls are setup and implemented.  Input validation on Websites. Security analyst, security consultant or security architect...these are some of the names given to ethical hackers in the corporate world.What Ethical Hackers Do In essence an ethical hacker uses the same tools and techniques that would be used by a malicious or black hat hacker to breach a system. The only difference is that what an ethical hacker does is legitimate, ethical and with the consent of the organization quite contrary to a malicious hacker who hacks a system’s security without user consent.An ethical hacker’s job involves identifying loopholes and developing and discussing their assessment methods and findings with various IT team and  the higher management.  Ethical hackers perform vulnerability assessment on the network, software, and servers. Later they fix those incompetencies so that no unauthorized user can compromise the system’s integrity. What qualifications does one need to become an Ethical Hacker?A Computer Science or Information Technology degree is not required to become an ethical hacker. There are many professionals who come from non-technical background and go on to become excellent ethical hackers. What you need is expertise on the latest hacking tools and techniques that you can use to test the system and identify its loopholes.   Some of the defensive approaches ethical hackers use to protect organizations include:  Regular patching of Infrastructure devices like routers, switches, firewall and servers. Establishing perimeter security to protect the organizational network. Ensuring User and Access based controls are setup and implemented.  Input validation on Websites.  And many more.History of Ethical Hacking:- The term ‘hacker’ was coined in 1960 at Massachusetts Institute of Technology where some great minds were trying to redevelop mainframe systems using FORTRAN programming. With the dawn of the digital age, hacking became one of the top methods of conducting cyber-attacks. Nation sponsored attacks are a new form of cyber terrorism that can bring countries to their knees.   One of the biggest examples is Stuxnet; a virus attack on the Nuclear program of Iran, which according to Wikipedia was carried out jointly by USA and Israel. Some of the other victims of hacking are organizations such as: Adobe hack: 2013 Yahoo Hack: 2013 eBay hack: 2014 Sony hack: 2014 Mariott hack: 2018 Dubsmash hack: 2019 Evolution of the Ethical Hacking role:Ethical hackers play an important role in securing us in this era, and can be said to be the unsung heroes of the IT industry.  Organizations have greatly expanded the investments made on cyber security after realizing that a breach could cost them more than their turnover. The digital demand in today’s world has ensured that the responsibilities of and the need for ethical hackers is on the rise.  How does Hacking become Ethical? Hacking can be legal or illegal depending on the intention of the act. If hackers use their knowledge for providing security and protection to any organization, it becomes legal or ethical. When a hacker has the user’s consent to check the security of their system by breaching the system, it is ethical hacking. However, if the security of a system is breached without the user’s consent to perform a malicious act such as stealing passwords, sending spam, damaging/stealing data, making unlawful transactions etc, then that makes it a cybercrime.   Recent Hacking Attacks:- What do hackers do? Perform a data breach Get details of the Server Get sensitive details from a database Crash a website Some of the more prominent attacks of data breach in recent years include In 2015, Barack Obama, Joe Biden, Jeff Bezos, Waren Buffet, Bill Gates, Mike Bloomberg, Elon Musk, Kanye West, and others were victims of hacking.  Myerscough College, in Billsborrow, Lancashire was attacked by an attacker on their result day. This compelled the staff to email each student about their grades, individually, Even their online enrolment system was affected by the attack.  A ransomware Wannacry, was used to derail thousands of computer systems including those of Government organizations and private organizations.  Ashley Madison is a website with the slogan 'Life Is Short, Have an Affair.' This website was attacked by attackers in July 2015, which resulted in the personal data of 37 million users being leaked on public websites. The results were catastrophic and it ruined the reputations and marriages of many. In June 2015, the records of 21.5 million people, including social security numbers, dates of birth, addresses, fingerprints, and security-clearance-related information, were stolen from the United States Office of Personnel Management (OPM). Most of the victims are employees of the United States government. This attack was also considered to be serious due to the leak of private information of the officials. The attackers used asymmetric cryptography, in which they encrypted the complete system using a public key and stored the private key on their own server. The owner of the system was blackmailed into giving money in exchange for the private key to decrypt that system.  According to McAfee "Rise in Cyber Attacks Amid Covid-19 Resulted in 375 Threats Per Minute in Q1 2020" What is Vulnerability: - Vulnerability is a loophole in the system which allows any unauthorized user to get access into the system.  Vulnerability is often a result of misconfiguration of the logic which is implemented for operation or security of the system. Any weakness in a system that can be used to exploit the organization's property is called vulnerability. A flaw in the system makes it vulnerable to attacks. A small configuration error can become a high-level vulnerability.  Generally, vulnerabilities are categorized according to the severity and frequency of occurrence. These are:  Critical  High Medium Low Below are some of the different types of vulnerability: If Database default credentials are used If Server is not properly patched  If Session time out is not properly configured If Server is executing data entered in input field as a command If handling of data is not properly implemented.What types of Systems do Hackers target?Hackers often want to hack those computers or networks from which they know that they will surely get some valuable/sensitive information. Government and Private organizations that store large amounts of sensitive data are especially vulnerable to hacking. Individual hacking is also on the rise were hackers attack individuals to steal money or passwords. In the times we live, knowledge of hacking and security is a must for every individual and organization to protect themselves.  Ethical hackers are the modern-day vigilantes who protect and serve organizations and individuals by fixing security issues of systems and keeping them safe from attacks. 
What Is Ethical Hacking?
Blogs
7319
What Is Ethical Hacking?

The internet brought with it the third revolutio... Read More

What Is React-js State?

You must have already learned about the basic building block of any React application which is a Component.  A component represents a feature that may be made up of several smaller components. Components can be broadly classified into functional or class components.  Components may take in some values as properties (prop) to render a page. These props decide how to render a page. function Welcome(props) {   return < h1 >Hello, {props.name}; }In addition to props, a component can also have a state that holds a value that can keep a track of all the information within a component. In this article, we will focus mainly on what is State, how we can define and utilize State and how components can use it in data management.  Defining React StateSo what exactly is state? What is it used for?    State represents a component’s underlying data model and is rendered by the component. But more importantly, whenever data in the state changes, it causes the component to re-render to reflect the change. This facilitates declarative programming where you can simply manipulate state; while React takes care of implementing updates to ensure your component reflects the data in the State accurately.  In Class component we can use State as follows:  class Welcome extends React.Component {     constructor() {         super();         // Space To define the state         this.state = {            isDisabled: false,            totalCost: 0,            products: []         }     }     // To Define render method  } We can also use state in Functional components using the useState Hook. Hooks are a new addition in React 16.8 which let us use State and other React features in functional components.  When should I use a Hook?If you are writing a functional component and realize that you need to add a State to it, the only option previously was to convert it to a class. Now you can use a Hook inside the existing function component.  For this, you can directly read the React documentation of Hooks here. In this article, we will mainly focus on “what is a State” and how is it different from Props. Difference of Props and State Most of the developers who are new to React often think about when to use State and when to use a Prop. Let’s understand this dilemma with an example.   A React component is akin to a JavaScript function.  A State can only be utilized in class components natively and is quite similar to a Prop, with the only exception that it is fully private, which means it can only be fully controlled and accessed by a component. In functional components, you have to opt-in to the useState hook to include stateful features.  Props, on the other hand, allow you to reuse the component by giving it an ability to receive data as input from the parent component.   We will learn more about the State and its usage later in this article, but here is the practical difference between the two:  A fictional example of Using a State: class MyComponent extends React.Component {     state = {         name: 'Tom'  //defining the name property inside component state     }     render() {         return Hello {this.state.name};     }  }  Here, we can use the state ‘name’ anywhere in the component named “MyComponent” with the value ‘Tom’, or we can assign a new state also in the same component. And, Using a Prop:A Prop is a short name for properties. React is nothing without a Prop. Earlier we saw an example where we used the same data over and over again, but what if we have a scenario where we need the same component but not the same data? For example, I might want the theme component, but instead of a dark theme, I would like to use a light theme! What I mean here is that basically, I want to re-use “MyComponent” again, but not the data defined in it. This is where Props will come in useful; in cases when we want to change the content inside the reusable component.     class ThemeProvider extends React.Component {     render() {         return Current theme is {this.props.theme};     }    }  // when re-using the component with differnt data                It’s absolutely fine if you are not familiar with this code snippet. The idea is to understand when to use state or prop, and not the code as of now!  For now, just know that Prop is just a state, which is passed from parent to child. And because props can’t change their value in the child component, they take the help of an event listener or callback function in the parent component.    Now let’s quickly jump into the basics of a State.    Creating the State Object  React component has a built-in state object. Before you think that state is a very simple concept, let me stop you right there!  It’s not!  You should not forget the data flow in React! In React there is a uni-direction flow of data, which is from parent to child. This can be a bit confusing, in that different components will never know what is changing in their component and when. Besides, they might be unaware of whether a component is stateless or stateful.   This is why the state is usually said to be encapsulated or having a local scope.This is why the state is usually said to be encapsulated or having a local scope. And therefore, you initialize the state in the class component by simply using a constructor.    Inside the Constructor  To declare a local state in the component, we can use a constructor as follows:   class Welcome extends React.Component {     constructor() {         super();         this.state = {             name: 'Michael Jackson',             currentTimer: 0,             hasPicked: false,             themeRed: false,             todoList: []         }     }     render() {         return My name is {this.state.name};     }  }    And the output or the result of the above < p> tag will be rendered as:     Hello, my name is Michael Jackson However, this was the older convention of declaring a state. We can also declare a state without the ‘constructor’ and ‘super’ keywords with the help of Property Initializer which came in 2017.    Wait, what is Property Initializer?     If you have a lot of code, it becomes harder to understand what is what. And if there are any arguments in the constructor, then it becomes an extra overhead to keep track of all of them.      Therefore, the idea behind using an Initializer is to use a cleaner ES6 component, by assigning an arrow function to a property that will act like a normal method. In other words, it can also be termed as class field syntax.         Without the Constructor       Take a look at the representation below:         class Welcome extends React.Component {  state = {       name: 'Michael Jackson'     }  }  render() {    …  }  }  In the following example, we have added a state to the “Welcome” component.         Let’s see how we can consume the data from the object — not outside the component, but within it!           Rendering data from state                 A state is either initialized in the constructor or by using the class fields syntax to directly initialize it in a class component. Now let’s see how we can consume the state from the component in the render.           A point to note here while using state is we use “this.state” to get the value of the name property and it can be accessed in the render() method as follows:             ~~~Wrong Approach~~~  class Welcome extends React.Component {     constructor() {         super();         this.state = {             name: 'Michael Jackson'         }     }     render() {         const { name } = this.state         return < h1 >My name is {name};     }  } or an alternative to the above is:  ~~~Right Approach~~~ class Welcome extends React.Component {  constructor() {     super();     this.state = {       name: 'Michael Jackson'     }  }  render() {    return < h1 >My name is { this.state.name };  }  } The only difference in both is that in the first snippet I used State as:  const { name } = this.state  But we have already initialized the state in the constructor, why should we do it again?  We should not reassign it, and hence we should never update the component state directly.  A state should always be accessed using this.state.propertyName.  Updating the State So far, we have seen how to create state and use state in the component.      Now let’s understand why and how to update state and what happens after updating a state.           A state can’t be changed directly and the only permissible way of updating it is by using setState as follows:             this.state.site = "Welcome"; // wrong implementation    this.setState({ // correct implementation     site: "Welcome"  });    // Or  this.setState((prevState, props) => ({ site: "Welcome" })))  The setState( ) method makes the component re-render; and hence when a state changes the component re-renders and updates the changes.   Each time setState is called, it sends a request to React to update and re-render and give it back a newly updated state.   Let’s understand this with an example:  Let’s suppose we have a component and want to change the name in the component with a method called handleNameChange(). It should look as follows:          handleNameChange(name) {     this.setState({ name })  }   The above method receives an argument and it uses that argument to update the state.              Component Demo to update a state should look as follows:             class App extends React.Component {     constructor() {         super()         this.state = { name: 'Michael Jackson' }     }     handleNameChange(name) {         this.setState({ name })     }     render() {         const { name } = this.state         return (                              < div>                     < input                         type="text"                         value={this.state.name}                         onChange={event => this.handleNameChange(event.target.value)}                     />                                  My name is, {name}                      )     }  }  When is setState asynchronous?React doesn’t have just one job to do, or only one component to observe for. It is possible that different components will be asking for different updates and DOM manipulations at the same time, hence the state updates are merged!      When setState() is called, React merges the object provided into the current state object.            For example, if we have different variables in our state like this:           constructor(props) {     super(props);     this.state = {         likes: [],         names: []     };  }  And both states can be independently updated by using setState() calls as follow:componentDidMount() {     fetchLikes().then(response => {         this.setState({             likes: response.likes         });     });       fetchNames().then(response => {         this.setState({             names: response.names         });     });  }  Here we are calling multiple setState during one update cycle, so this.setState({names}) will leave this.state.likes unmarked but will completely replace this.state.names.  Hence you will not get the recently updated data in {names} and previous changes will be lost.  A quick fix to the above problem is as follows: Instead of giving a new state directly we can provide a function that can automatically provide the current state into a new state. There are two approaches to this:  // Method #1  this.setState({ foo: this.state.counter + 1 }, this.anyCallback);  Or              // Method #2  this.setState((prevState) => { return { counter: prevState.counterfoo + 1 } }, this.anyCallback);  The main difference is that in example #1, the counter gets incremented by 1 based on the state at the time when you have called the setState() method, whereas In the example-2, the counter will be incremented by 1 only depending on the value that the previous state had while the arrow function was called.  So if we have multiple setState() which happen at the same time before the actual state update, it is possible that they may conflict or have outdated state data, but if we go with approach #2 they are guaranteed to have the most recent updated state because they update synchronously! To learn more about setState() and its powers, head over to this official link.Bonus Section:  Changing Title on Click Example Using StateSo far you have understood how to use State in React and what are the basic principles that define when to use State and when to use Prop. Here is a simple Demo for using State in a component and using Props to reuse the component.    Try this code to understand the power of State and reusable components.         let imgLogo = 'https://apod.nasa.gov/apod/image/2009/CrabNebula_Hubble_960.jpg';    class BonusExample extends React.Component {      constructor() {          super();          this.state = {              newTitle: false          };          this.changeTitle = this.changeTitle.bind(this);      }      changeTitle() {          this.setState({              newTitle: !this.state.newTitle          });      }      render() {          let title = this.state.newTitle ? 'Here is my New Title - Google Page' : 'Here is my Old Title - Facebook Page';          let link;          if (this.state.newTitle) {              link = ;          } else {              link = ;          }          return (              < div>                                                          {link}                                                < button style={{ margin: '20px' }} type="button" className="btn btn-primary" onClick={this.changeTitle}>Change Name                                                          < HelperComponent />                        );      }  }    class OldPageLink extends React.Component {      render() {          return (                                http: //www.facebook.com                        );      }  }    class NewPageLink extends React.Component {      render() {          return (                                http: //www.google.com                        );      }  }    class Header extends React.Component {      render() {          return (                                {this.props.children}                        );      }  }    class Main extends React.Component {      render() {          return (                                {this.props.title}                  {this.props.children}                        );      }  }    class Footer extends React.Component {      render() {          return (                                {this.props.children}                        );      }  }    class LogoComponent extends React.Component {      render() {          return (                        );      }  }    class HelperComponent extends React.Component {      render() {          return (              Changing the title from one to Another          );      }  }    ReactDOM.render(, document.getElementById('example'));  Conclusion       I hope you have understood the concept of State and its usage. We have learned the basic difference between State and Props and when each should be used. We have also understood the data flow in a React component and how to consume and update a State object in React.  Now that you have understood all the fundamentals of State, there are some high-level pointers that you should always keep in mind while using a State. State is private to a component State Updates have shallow merging You should never modify a State Directly Updates in a State may Be asynchronous State is only used when you want to change component dataWe hope you have found this article useful. Happy Learning!   
What Is React-js State?
Blogs
10465
What Is React-js State?

You must have already learned about the basic buil... Read More

Who Should Get CSPO® Certified?

In this article you would learn who is a Product Owner, and what are their roles and responsibilities while playing the role of a PO on a Scrum project. You would also learn about the CSPO® certification and its prerequisites, who all can attend the CSPO certification training and why should a PO get CSPO certified.  Who is a Product Owner?A product owner in Scrum is one of the three core roles and responsible for maximizing the value of the products and the work of the Scrum development team. This is a one-person role and is a bridge between the end-user and the development team. On the project, a PO plays different roles such as business strategist, product manager, product designer, market analyst, customer liaising and rarely Scrum Master. He or she has to be well versed with Agile/Scrum methodology.  What are the PO’s roles and responsibilities on a Scrum project? 1. Developing and maintaining a Vision and a product roadmapThe Scrum product owner is the point of contact on the product development team and uses a high-level perspective to define goals and creates a vision for the project. The PO is responsible for communicating with all stakeholders including customers, end-users and the development team to make sure that the goals are clear, and the vision is aligned with business objectives. This ensures that the team maintains a cohesive vision.The PO is also responsible for creating a product roadmap for the Scrum project. This product roadmap is a high-level, strategic visual summary that outlines the vision and direction for the product offering over time and acts as a strategic guide for stakeholders to reference and is also used as an execution plan.2. Ordering and managing the product backlogThe development team’s to-do list and one of the most important responsibilities for a Scrum Product Owner is managing the product backlog throughout the project.  Based on the overall strategy and business objectives the product owners create the list of backlog items and prioritize them. They will also need to map out project dependencies with the required sequence of development. The product backlog is a live document which is continually updated based on evolving project needs throughout development. Because it gets updated frequently, the product owner must make it accessible and available to all stakeholders, specifically the development team, to ensure optimized performance and project outcomes. 3. Overseeing development stagesWith the vision, product roadmap and product priorities set, the product owner should spend a significant amount of time overseeing the actual development of the product. They are a key contributor throughout each Sprint event including Sprint Planning, Backlog refinement, Sprint Review and Sprint Retrospective. During the planning stages, the product owner works with end-users to identify high-value items from the Product Backlog so that these items can be considered for the next Sprint or Iteration. At the end of every Sprint they will meet with the team to refine the process, identify areas for improvement and plan for the next sprint. 4. Anticipating and Prioritizing client needsThe Scrum Product Owner will be an expert at judging and anticipating the client’s needs to effectively manage the project and deliver a high-value product which can be used by everyone in the organization.5. Acting as primary liaisonThe product owner acts a link and is the primary communicator between the end-users and the development teams. They must be expert communicators, ensuring there’s buy-in from end-users on all major decisions strategically with clear instructions on deliverables for the developers.  6. Evaluating product progress at each iterationThe product owner is held accountable for each stage of the development process and the final product. They also take a prominent role in inspecting and evaluating product progress through each Sprint. The product owner is the one who makes the judgment call on the team's performance and decides if the team need to go back to the drawing board or they can move on to the next Sprint or next steps. A Product Owner is also responsible for defining high-level stories and should possess good decision-making and interpersonal skills while working on a Scrum project. What is a CSPO® certification?  CSPO stands for Certified Scrum Product Owner. It is an industry recognized certification for Product Owners who are already in the role of a Product Owner, or novices who would like to understand the insights of a Product Owner role.  After attending the training, each attendee would have the necessary knowledge to play the role of a PO on any Scrum project.  What are the pre-requisites to become a CSPO®? There are no specific prerequisites to attend a CSPO certification training course.Who can attend the CSPO® training? CSPO training can be attended by anybody who is knowledgeable and confident about the product under consideration, who is very good in communication, who is a good listener, who is focused on product development and who can quickly resolve issues and take decisions. Before selecting a person to attend the CSPO training and later play the role of a Product Owner it is always advisable to estimate the time and effort required for the Product Owner role. The estimates will come handy when the person who wishes to play the role is made aware of the period of time for which they are required to be available for the Scrum project. Suggested target audience could be – Business Analyst: Business Analysts are better suited to play the role of a Product Owner as they have the required knowledge on how to handle the business requirements and supplement it with business analysis. They play a critical role in decision-making during business analysis. Project Manager or Manager:  Project Manager is another role that is available to a Product Owner. Project Managers are involved in project planning and executing of a project i.e. throughout the lifecycle of a project right from ideation to closure. Hence, they would be more effective on a Scrum project to play the role of Product Owner.  In many organizations the Business Analyst also plays the role of Project Manager. It is for this reason that many organizations prefer Project Managers to play the role of a Product Owner. If these Project Managers have a Certified ScrumMaster certification then it would add value. Product Manager: Product Managers make very good Product Owners, as they have all the necessary knowledge about the product requirements based on strategic requirements and current market trends. If the Product Manager has Business Analysis experience, then this can add tremendous value to the Scrum project if he or she is appointed to play the role of a Product Owner. Functional Managers: Many organizations are structured by Functions and the Functional Managers report to the CEO. Functional Managers from any function would also be ideal to play the role of a Product Owner as they already have the necessary knowledge about the product, strategy and market trends. They understand the business requirements and they have been working with other functions during business as usual. They would also add value to the Product Owner role. Chief Executive Officer (CEO): CEOs can be very good Product Owners as they would be having first-hand and complete information about the product, strategy and market trends. The CEO’s experience would be an asset to the Scrum project as they would be constantly thinking about how to achieve a high return on investment, how to engage the customers throughout the Scrum project, etc. All these qualities are already part of the CEO’s roles and responsibilities.  Every individual needs to decide, if they think certifications add value to their career. Certifications are proof of their achievement. Ultimately, it would be their expertise on the job, along with hands-on experience to play the role that matters for career advancement. Individuals can take up a Product Owner certification  To gain knowledge and understanding of the role To refresh their knowledge and get to know the responsibilities and best practices employed by a Product Owner. Why should a PO get certified?    The industry is looking out for Certified Product Owners who can take up the role of a Product Owner in their organizations. The certification is a proof of your achievement, the knowledge you have gained and demonstrates that you would be able to work effectively throughout the Scrum project.  If you are a CSPO certified, your potential employers will be assured that you are the right person for handling the job and the project is in the safe hands.  How can you get CSPO certification?  Attend a live online or classroom course taught by a Certified Scrum Trainer® (CST®), or receive private coaching from a Certified Agile Coach (CAC) in order to get the necessary knowledge and skills to be a successful PO.   Please note, classroom course offers an added value as a lot of doubts can get cleared during the training sessions. If you have attended a training conducted by a Scrum Alliance CST, then on successfully completing the course, you will be asked to accept the CSPO License Agreement and complete your Scrum Alliance membership profile.ConclusionIn this article you learnt who is a Product Owner, and the roles and responsibilities of a PO on a Scrum project. You understood more about CSPO certification and its prerequisites and why a PO should get CSPO certified. You also got to know who all can attend and benefit from the CSPO training.    
Who Should Get CSPO® Certified?
Blogs
9871
Who Should Get CSPO® Certified?

In this article you would learn who is a Product ... Read More

What Are React.Js Prop

Understanding data manipulation in React is never an easy job. React has a unidirectional data flow due to which the technique of data manipulation in React is slightly different than in other frameworks.   To understand the concepts like Props or State, I’d recommend you brush up or go through the data flow concepts in React first. In this article, we’re going to focus only on the Props feature and how to use it in React. We already know that components are reusable, and we can use our component multiple times in our application. To understand props, you should have a solid understanding of the components and how data flows inside the components.  If you don’t know much about React components, I recommend you stop here and read about React components first before continuing! Let’s now learn what are “props” and how to use them?What is Props in React?   We all know that React Components allow you to split the application interfaces into reusable, independent segments.  “Props” stands for properties. It is a special keyword in React which is used for passing data from one component to another.   Logically, components are just like JavaScript functions. They accept random inputs (called “props”) and return React elements which tell what should be displayed on the screen.   Props can be used to pass any kind of data such as:  String Array Integer Boolean Objects or, Functions Understanding ReactJS Props   We are all quite familiar with parent and child components. If you aren’t, then before delving deep into ReactJS props, it’s important to revisit concepts on parent and child components.class ParentComponent extends Component {   render() {    return (      < h1 >        I'm the big parent component.                  ); } }And here is the child component:const ChildComponent = () => {   return I'm a small child! };And did you realize that when we called the child component inside the parent component, we end up rendering the same data again and again? The problem we want to solve here is, we want to render the dynamic data and not static data! Let’s understand this with a simple example. Here we have two components:     One is the parent component which is a class component://this is Parent component import React, { Component } from 'react'; import MyComponent from './MyComponent.jsx'; class App extends Component {    render() {        return (                                                        < /div>        );    } } export default App;And we are rendering the child component ( MyComponent ) which is a functional component inside the parent as follows:import React from 'react'; const MyComponent = () => {    return < h1 > Hello Michael } export default MyComponent;The result will be like this:Hello Michael Hello MichaelThis is coming twice, because we have used twice in our parent component. We can re-use this component any ‘n’ number of times as we want. Now, what if a certain scenario demands that we don’t require this static data in the child component, and we want some dynamic data when the component renders? What I meant is that I want to reuse the child component not with the data it has, but with some other data like:Hello Michael Hello ProfessorHere we can make use of Props or properties. We can add props in the component in the same way that we add attributes in our HTML.Let’s add Props in our older component and see the results:  import React, { Component } from 'react';  import MyComponent from './MyComponent.jsx';  class App extends Component {     render() {         return (                                                                     );     }  }  export default App;  In the above file, we have used a name attribute with the desired dynamic value we want after rendering the data. Now, the most important point here is to pass props to the child component.Passing Props >>>>>  import React from 'react';  const MyComponent = (props) => {     return < h1 > {props.name}   }  export default MyComponent;  If you try to console the value of Props, you will see nothing but a plain JavaScript object with key-value pairs. We can access the value as key of “name” using (.) dot notation like this >>> “props.name“,  In the final step, we have used interpolation to use the props and we enclose it in curly brackets because it is a JSX expression.  Now after calling the child component inside the parent component, here comes the desired output which isHello Michael  Hello Professor Now that we’ve successfully rendered the data of the child component from the parent component, let’s dig deeper!Props in the Constructor:In the above example, we have used a functional component.   What if we have a class component and we want to use props in that component?  Normally, a constructor() method is invoked when a class in a component is created without using the newer public class fields syntax. Most of the times when a constructor() is invoked, the super() method is invoked inside of it. Otherwise, the parent’s constructor will not be executed.  See the snippet below for the class component:  class MyComponent extends React.Component {     constructor(props) {         super(props);         console.log(this.props); // props will be logged here.     }     render() {         return < h1 >Hello {this.props.name};    }  }  To access the props we use this.props.  To summarize the above: If we want to use this.props inside the constructor, we need to pass it in super, or else we can use it in render() without using super()  Using Props in React & Passing Data using Props  Props are mainly used for passing data from the parent component to child component. It motivates us to reuse the components and reduce redundancy as well. But as a growing app, you might see a lot of bugs with typechecking.  In React there is a special inbuilt feature that is used to check the basic validations during typechecking using PropTypes.  See the depth and power of propTypes here:  import PropTypes from 'prop-types'  export default class Mycomponent extends React.Component {     render() {         // .... Your code goes here     }  }  Heading.propTypes = {     content: PropTypes.string.isRequired,     message: PropTypes.array.isRequired,     onClick: PropTypes.func.isRequired,     length: PropTypes.number.isRequired,     styles: PropTypes.object.isRequired,     isReady: PropTypes.bool.isRequired  } PropTypes, a built-in-type checker, ensures that the right type of props is passed to a component. We can define components without propTypes as well, but why risk our application with any wrong data type that might lead to a crash?  NOTE: propTypes can only be checked in development mode (for performance reasons) PROPTYPES exports a huge range of validators which can be used to make sure that the data you receive is checked and valid, completely bug free!   To use typechecking on the props for a component, let’s use and assign the special propTypes property as follows:   import PropTypes from 'prop-types';  class MyComponent extends React.Component {     render() {         return (             < h1 >Hello, {this.props.name}         );     }  }    MyComponent.propTypes = {     name: PropTypes.string  };  In this example, we have used “PropTypes.string”. When an invalid value is provided for a prop, for-ex, other than a string, a warning will be thrown in the JavaScript console. To learn more about prop types, head over here.   Default PropsThere could be certain scenarios in which we need some default props so that props are set even if a parent component doesn’t pass the props down. In this case, we can also define default values for the props directly to the constructor by assigning to the special property known as defaultProps provided by React.  class MyComponent extends React.Component {     render() {         return (             < h1 >Here comes the, {this.props.name}         );     }  }    // Specifies the default values for props:  MyComponent.defaultProps = {     name: 'new value'  };    // Renders "Here comes, new value":  ReactDOM.render(     ,     document.getElementById('dummy')  );        Default props work great in the situation when the same default value can be utilized again and again for every instance of the component. Again reduce the LOC (line of code).  Why are Props useful?  Props provide a medium so that components can talk to each other.  In fact, we can reduce thousands of lines of code just by using Props!     Whenever we declare any component it can be either a class component or a functional component. One thing to notice here is, no matter what kind of component is, it should never change its props value.      Hence the components should act like pure functions (which can’t change their own input) to their props.     But, if you really want to change or introduce some dynamic UIs that should change within the component, you should learn about “State”.     State allows React components to change their values over time without any violations. A state is usually called as an encapsulated one or having a local scope of the component.     It is not accessible to any component other than the one that owns it and sets it.     You can learn about the state in this article.     Can we use Props and State Together?   Absolutely  ! Let’s understand with the following example how we can combine both state and props in our component.    import React from 'react';    class App extends React.Component {     constructor(props) {         super(props);         this.state = {             heading: "Heading from props...",             content: "Some Content from props..."   //Line-8         }     }     render() {        //Line-11         return (                                                                     );     }  }  class Header extends React.Component {     render() {         return (                              < h1 >{this.props.headingProp}                      );     }  }  class Content extends React.Component {     render() {         return (                              < h2 >{this.props.contentProp}                      );     }  }  export default App;          An explanation for the above snippet:  Here we have initialized and used the state in our parent component (line number 7-8) and we have used that state by passing it down the component tree using props.   Inside the render() (line number 11), we are setting the props data as headerProp and contentProp used in child components which are component and component.   Now, if you change the state in the parent component, all the child components get updated, because the single source pf data is State here!    What are the differences between props and state?  Let’s  take a look at some high-level differences between state and props. Although they do similar things, they are used differently.   While both are used for data manipulation, one is of private and the other is of dynamic context.      Props are used to pass data from parent to child whereas the state is used for data manipulation inside the component.  We can get the value of props from the parent component, where we get the value of state object from the initial data defined in the constructor() method.  While this.props is set up by React itself, with this.state we are free to add additional fields to the component manually to store something or in a scenario that doesn’t participate in the data flow.   Props are immutable, i.e We can't change props passed to a component whereas we can change the State, i.e React uses the setState() method to update the object of a state (but within the component itself) Conclusion :    Props is a very crucial concept while learning React. In this article, you have learned about the lifeline of React, which is Props, and how we can use props in React. You have got clarity on why a component updates or re-renders when data in the props changes. We also saw that whenever data changes in props, the component will re-render. Last but not the least, let’s just recall the pointers of all of the above: Props are like parameters to a function  Props cannot be changed, they are immutable  A prop is a special keyword in React, that stands for properties  Props can only be passed in a uni-direction i.e (parent to child)  Props can be used to pass dynamic data to a component A component re-renders when data in the props changeHope you find this article useful! Happy Learning!      
What Are React.Js Prop
Blogs
9829
What Are React.Js Prop

Understanding data manipulation in React is never ... Read More

How to Interpret R Squared and Goodness of Fit in Regression Analysis

Regression Analysis is a set of statistical processes that are at the core of data science. In the field of numerical simulation, it represents the most well-understood models and helps in interpreting machine learning algorithms. Their real-life applications can be seen in a wide range of domains, ranging from advertising and medical research to agricultural science and even different sports. In linear regression models, R-squared is a goodness-fit-measure. It takes into account the strength of the relationship between the model and the dependent variable. Its convenience is measured on a scale of 0 – 100%. Once you have a fit linear regression model, there are a few considerations that you need to address: How well does the model fit the data? How well does it explain the changes in the dependent variable? In this article, we will learn about R-squared (R2), its interpretation, limitations, and a few miscellaneous insights about it. Let us first understand the fundamentals of Regression Analysis and its necessity. What is Regression Analysis? Regression Analysis is a well-known statistical learning technique that allows you to examine the relationship between the independent variables (or explanatory variables) and the dependent variables (or response variables). It requires you to formulate a mathematical model that can be used to determine an estimated value which is nearly close to the actual value. The two terms essential to understanding Regression Analysis: Dependent variables - The factors that you want to understand or predict. Independent variables - The factors that influence the dependent variable. Consider a situation where you are given data about a group of students on certain factors: number of hours of study per day, attendance, and scores in a particular exam. The Regression technique allows you to identify the most essential factors, the factors that can be ignored and the dependence of one factor on others.  There are mainly two objectives of a Regression Analysis technique: Explanatory analysis - This analysis understands and identifies the influence of the explanatory variable on the response variable concerning a certain model. Predictive analysis - This analysis is used to predict the value assumed by the dependent variable.  Why use Regression Analysis? The technique generates a regression equation where the relationship between the explanatory variable and the response variable is represented by the parameters of the technique. You can use the Regression Analysis to perform the following: To model different independent variables. To add continuous and categorical variables having numerous distinct groups based on a characteristic. To model the curvature using polynomial terms. To determine the effect of a certain independent variable on another variable by assessing the interaction terms.  What are Residuals? Residuals identify the deviation of observed values from the expected values. They are also referred to as error or noise terms. A residual gives an insight into how good our model is against the actual value but there are no real-life representations of residual values. Source:  hatarilabs.comRegression Line and residual plotsThe calculation of the real values of intercept, slope, and residual terms can be a complicated task. However, the Ordinary Least Square (OLS) regression technique can help us to speculate on an efficient model.  The technique minimizes the sum of the squared residuals. With the help of the residual plots, you can check whether the observed error is consistent with the stochastic error (differences between the expected and observed values must be random and unpredictable).  What is Goodness-of-Fit?  The Regression Analysis is a part of the linear regression technique. It examines an equation that reduces the distance between the fitted line and all of the data points. Determining how well the model fits the data is crucial in a linear model. A general idea is that if the deviations between the observed values and the predicted values of the linear model are small and unbiased, the model has a well-fit data.  In technical terms, “Goodness-of-fit” is a mathematical model that describes the differences between the observed values and the expected values or how well the model fits a set of observations. This measure can be used in statistical hypothesis testing. How to assess Goodness-of-fit in a regression model? According to statisticians, if the differences between the observations and the predicted values tend to be small and unbiased, we can say that the model fits the data well. The meaning of unbiasedness in this context is that the fitted values do not reach the extremes, i.e. too high or too low during observations. As we have seen earlier, a linear regression model gives you the outlook of the equation which represents the minimal difference between the observed values and the predicted values. In simpler terms, we can say that linear regression identifies the smallest sum of squared residuals probable for the dataset. Determining the residual plots represents a crucial part of a regression model and it should be performed before evaluating the numerical measures of goodness-of-fit, like R-squared. They help to recognize a biased model by identifying problematic patterns in the residual plots.  However, if you have a biased model, you cannot depend on the results. If the residual plots look good, you can assess the value of R-squared and other numerical outputs. What is R-squared? In data science, R-squared (R2) is referred to as the coefficient of determination or the coefficient of multiple determination in case of multiple regression.  In the linear regression model, R-squared acts as an evaluation metric to evaluate the scatter of the data points around the fitted regression line. It recognizes the percentage of variation of the dependent variable.  R-squared and the Goodness-of-fit R-squared is the proportion of variance in the dependent variable that can be explained by the independent variable.The value of R-squared stays between 0 and 100%: 0% corresponds to a model that does not explain the variability of the response data around its mean. The mean of the dependent variable helps to predict the dependent variable and also the regression model. On the other hand, 100% corresponds to a model that explains the variability of the response variable around its mean. If your value of R2  is large, you have a better chance of your regression model fitting the observations. Although you can get essential insights about the regression model in this statistical measure, you should not depend on it for the complete assessment of the model. It does not give information about the relationship between the dependent and the independent variables.  It also does not inform about the quality of the regression model. Hence, as a user, you should always analyze R2   along with other variables and then derive conclusions about the regression model. Visual Representation of R-squared You can have a visual demonstration of the plots of fitted values by observed values in a graphical manner. It illustrates how R-squared values represent the scatter around the regression line. As observed in the pictures above, the value of R-squared for the regression model on the left side is 17%, and for the model on the right is 83%. In a regression model, when the variance accounts to be high, the data points tend to fall closer to the fitted regression line.  However, a regression model with an R2 of 100% is an ideal scenario which is actually not possible. In such a case, the predicted values equal the observed values and it causes all the data points to fall exactly on the regression line.  Interpretation of R-squared The simplest interpretation of R-squared is how well the regression model fits the observed data values. Let us take an example to understand this. Consider a model where the  R2  value is 70%. This would mean that the model explains 70% of the fitted data in the regression model. Usually, when the R2  value is high, it suggests a better fit for the model.  The correctness of the statistical measure does not only depend on R2  but can depend on other several factors like the nature of the variables, the units on which the variables are measured, etc. So, a high R-squared value is not always likely for the regression model and can indicate problems too. A low R-squared value is a negative indicator for a model in general. However, if we consider the other factors, a low R2 value can also end up in a good predictive model. Calculation of R-squared R- squared can be evaluated using the following formula: Where: SSregression – Explained sum of squares due to the regression model. SStotal – The total sum of squares. The sum of squares due to regression assesses how well the model represents the fitted data and the total sum of squares measures the variability in the data used in the regression model. Now let us come back to the earlier situation where we have two factors: number of hours of study per day and the score in a particular exam to understand the calculation of R-squared more effectively. Here, the target variable is represented by the score and the independent variable by the number of hours of study per day.  In this case, we will need a simple linear regression model and the equation of the model will be as follows:  ŷ = w1x1 + bThe parameters w1  and  b can be calculated by reducing the squared error over all the data points. The following equation is called the least square function:minimize ∑(yi –  w1x1i – b)2Now, to calculate the goodness-of-fit, we need to calculate the variance:var(u) = 1/n∑(ui – ū)2where, n represents the number of data points. Now, R-squared calculates the amount of variance of the target variable explained by the model, i.e. function of the independent variable. However, in order to achieve that, we need to calculate two things: Variance of the target variable: var(avg) = ∑(yi – Ӯ)2Variance of the target variable around the best-fit line:var(model) = ∑(yi – ŷ)2Finally, we can calculate the equation of R-squared as follows:R2 = 1 – [var(model)/var(avg)] = 1 -[∑(yi – ŷ)2/∑(yi – Ӯ)2] Limitations of R-squared Some of the limitations of R-squared are: R-squared cannot be used to check if the coefficient estimates and predictions are biased or not. R-squared does not inform if the regression model has an adequate fit or not. To determine the biasedness of the model, you need to assess the residuals plots. A good model can have a low R-squared value whereas you can have a high R-squared value for a model that does not have proper goodness-of-fit.  Low R-squared and High R-squared values Regression models with low R2 do not always pose a problem. There are some areas where you are bound to have low R2 values. One such case is when you study human behavior. They tend to have R2  values less than 50%. The reason behind this is that predicting people is a more difficult task than predicting a physical process. You can draw essential conclusions about your model having a low R2 value when the independent variables of the model have some statistical significance. They represent the mean change in the dependent variable when the independent variable shifts by one unit. However, if you are working on a model to generate precise predictions, low R-squared values can cause problems. Now, let us look at the other side of the coin. A regression model with high R2  value can lead to – as the statisticians call it – specification bias. This type of situation arises when the linear model is underspecified due to missing important independent variables, polynomial terms, and interaction terms.  To overcome this situation, you can produce random residuals by adding the appropriate terms or by fitting a non-linear model. Model overfitting and data mining techniques can also inflate the value of R2. The model they generate might provide an excellent fit to the data but actually the results tend to be completely deceptive. Conclusion Let us summarize what we have covered in this article so far: Regression Analysis and its importance Residuals and Goodness-of-fit R-squared: Representation, Interpretation, Calculation, Limitations Low and High R2 values Although R-squared is a very intuitive measure to determine how well a regression model fits a dataset, it does not narrate the complete story. If you want to get the full picture, you need to have an in-depth knowledge of R2  along with other statistical measures and residual plots. For gaining more information on the limitations of the R-squared, you can learn about Adjusted R-squared and Predicted R-squared which provide different insights to assess a model’s goodness-of-fit. You can also take a look at a different type of goodness-of-fit measure, i.e. Standard Error of the Regression. 
How to Interpret R Squared and Goodness of Fit in Regression Analysis
Blogs
9863
How to Interpret R Squared and Goodness of Fit in ...

Regression Analysis is a set of statistical proce... Read More

Drop A Query
Corporate