PureComponent in React JS

In React lifecycle, there is a method for comparing the current and new values of both state and props. It is called the shouldComponentUpdate() method but it is rarely used. It is generally used to let React know that the default will re-render itself if there is no change in the Component’s output due to the current state and props. It always returns a Boolean value (true by default).

Now PureComponent() has taken its place and is more likely to tell the difference between the two states as it performs a shallow comparison between the two and decides if the…

Changes made in React JSX fromReact v.17.0

BY Author

JSX stands for JavaScript XML. It is a syntax for writing JavaScript and HTML codes together, or to be exact, writing HTML codes inside JavaScript code.

JSX is a template language that comes with the full power of JavaScript.


const element = <h1>Hello World!</h1>;

As we can see in the above syntax, both HTML and JS code has been written in a single line. It is neither HTML nor JS code, it is JSX, the compilation of both languages in one code.

It is a great practice to write React codes in JSX, but it is not compulsory. We shall…

Creating Slider in React Js with pure React and Hooks without External sources.

Project Requirements

  1. Creating our React app for this project
  2. Running it on our localhost 3000
  3. Starting our code by deleting the default code
  4. Writing the JSX code
  5. Applying Hooks

Project Setup

Let’s start by creating the Slider React App with the help of your terminal by navigating into the main folder.

Git and GitHub

Git is a free and open-source Distributed Version Control System(DVCS).

It is used for tracking changes in the project directory and manage source code. It keeps a log of our complete history with all the comments we have made with their changes. By simply passing a command we can see all those changes with the names of the person who made them.

If you’re involved with a project you can clone the project’s Git repository, and then work on it as if it is your own copy.

Developers can even work independently and offline. They just have to push their…

Photo by Maik Jonietz on Unsplash

VS Code is mostly used as a code editor or as an IDE when it comes to making apps and websites in React due to its compatibility and adaptability with this framework and also because it provides you with many extensions which can increase your development process.

In this blog, I will list the top 8 VS Code extensions for React developers to make their coding process way more productive.

  1. ESLint

It is an error-finding extension and lets you follow the style guide making our code error-free and stylish. …

OOPS stands for Object-Oriented Programming System

It is a type of programming system that works on objects rather than the function which made the whole process a lot easier and consumes less space due to its reusability.

There are some basic terminology that one should know about moving forward in this concept -

What is an object?

The object is just a real-world entity with behaviors and attributes through which users can interact. We can also say that it is just an instance of a class.

What is a class?

A class is just a blueprint that contains some values…

Ateev Duggal

I am a front-end developer from India with over one year of experience in freelancing with skills like Git, HTML5, CSS3, Bootstrap 4&5, and React.

Get the Medium app

A button that says 'Download on the App Store', and if clicked it will lead you to the iOS App store
A button that says 'Get it on, Google Play', and if clicked it will lead you to the Google Play store