Scopes in IT

•Analytics •Automation

•Artificial intelligence •Cloud computing

•Communications •Cybersecurity

•Data/database management •Infrastructure

•Internet of things •Machine learning

•Maintenance and repair •Networks

•Robotics •Software/application development

•SCADA (Supervisory Control And Data Acquisition)

Company Roles

•Project Manager •Network Administrator

•Database Administrator •Management

•Tester •Network Engineer

•Web Developer •Technical Support

•Full stack developer •Computer Network Architects

•Designer •User Experience Design

•Analyst 

MERN stack Development

M     mongo db

E     express js

R     react js

N     node jS

Git

Git Installation steps for windows

https://gitforwindows.org/

1) Go to this link👆 and click on Download and Installed git.

2) Go to the command prompt and type git command.

You get this type of message that means your git is successfully installed.

Git Basic Commands

• git status
• git add [file name] / git add .
• git commit -m "[Your commit]"
• git push

React

It was created by Jorden Walke, who was a software engineer at Facebook. It was first used in 2011 for Facebook's Newsfeed feature. Next used in Instagram 2012 and WhatsApp. And in 2013 it was made available to the public.

DOM

React is fast the main reason for that is the virtual DOM (Document Object Model). DOM represents the structure of the document as a tree of objects.

Virtual DOM is a carbon replica of a real DOM. In short, react creates a duplicate DOM of the real DOM. It’s called virtual DOM. When a web application is modified the virtual DOM is updated first. Check the difference between both and then it's changed in real DOM. So it changes as much as the part has been changed.

Components

Components are the heart of the react application. This is a building block of react applications. The best use is its reusable code. That makes code development faster and more efficient.

Every component has its structure and methods. There are mainly two types of components. Let’s see the meaning of class components and class components with simple examples.

Class Component

A class component includes the extends React. Component statement. That creates an inheritance. This component are render function. Class components are also known as stateful components. 

Function Component

Function components are simply JavaScript functions. That’s powerful using Hooks. You can see a simple example of a function component. They are easier to understand and developers need to write less code compared to class components.

State and Props

State

It helps to manage data inside a component. State is mutable means state value can change. The class component used this. state for state management. States can be used for rendering dynamic changes with the component.

This is a class component state example.

Function component used useState for state management.

ex.,

Props

It helps to pass data from one component to another component. Props are used to communicate between components. Props are immutable means that value can’t change. Let’s take simple examples of props.

The class component used props 

The Function component used props 

Hooks

Hooks new feature introduced in React 16.8 version. It allows to use of state and other react functionality without using class. The function is powerful only and only uses Hooks. Hooks are created for function components. Hooks are used only in function competence. We can’t use in class component.

Let’s first simple example of hooks.

In the above code, useState is one type of hook. That worked instance of class component state. 

Hooks are three rules.

1. Hooks can only called inside function components.
2. That is called at the top level of the component.
3. That cannot be conditional.

The below list are hooks list. They are present in react.

1.     useCallback
2.     useContext
3.     useDebugValue
4.     useDeferredValue
5.     useEffect
6.     useId
7.     useImperativeHandle
8.     useInsertionEffect
9.      useLayoutEffect
10. useMemo
11.      useReducer
12. useRef
13. useState
14. useSyncExternalStore
15. useTransition

JSX

It is generally known as JavaScript XML and also known as JavaScript Syntax Extension. JSX is an extension of the JavaScript programming language. That allows developers to wright HTML in React. It’s based on ECMAScript 2015(ES6).

Let’s see that example.

It made work a lot easier. Developers can do a lot of work in less time due to JSX. Because if the same code is written with the help of JavaScript, it makes the code lengthy and complicated.

But this code is converted and compiled in the original javascript at compile time. And Babel does the job of converting JSX to native JavaScript. So the work of developers becomes easy.

Babel.js provides a mini compiler. We can write their JSX code and convert it to pure JavaScript.

https://toforzero.com/blog/introduction-to-jsx

Variables (let, var, const)

You can declare react variables using let, var, and const keywords. But all are different work and limitations.

Let’s get them intro and difference.

Let

Let is the block scoped. This means you can’t use the Let variable out of loop or component. That defines Where you declare it. Plus the best point is to let value you can change.

Const

Const is also the block scoped. This means you same the let variable you can’t use the Const variable out of loop or component. That defines Where you declare it. Const value you can’t change. And that is declared only one time.

Var

Var is a global object. That can be used outside of function. You can say it in other words var is a function scope. This is a reassignable variable.

Spread Operator

This is a new addition to JavaScript ES6. It takes in an iterable and expands it into individual elements. Let’s learn the spread operator in simple words with examples.

ToDo List Program