DEV Community: MD Rokibul Islam

Javascript Data structure

MD Rokibul Islam — Mon, 20 Nov 2023 02:49:30 +0000

           **  Javascript Data structure **
                   (Big O Notation)

Time Complexity
O(1): no matter how big the job is, it takes the same amount of time to complete. It's like saying, "It's a one-size-fits-all speed, and the size of the task doesn't matter."
O(n): If you have a process with O(n) complexity, doubling the size of the input will roughly double the time it takes to finish the task. It scales linearly with the input size.

Space Complexity
O(1) space complexity: This means that the amount of memory used by an algorithm or operation remains constant, regardless of the size of the input data. It's often considered very efficient because the memory usage doesn't grow as the input size increases.

O(n) space complexity: This means that the amount of memory used by an algorithm or operation grows linearly with the size of the input data. As the input size increases, the amount of memory used also increases proportionally.

You should know this about Node JS

MD Rokibul Islam — Fri, 18 Feb 2022 11:35:17 +0000

What is Nodejs? Difference between Nodejs and javaScript
Node js is a Javascript runtime and open-source server environment. Node js run a web application outside the client browser. Node js non-blocking means asynchronous.
Javascript is a programming language other side nodejs is a javascript runtime. Javascript is mostly used for client-side and nodejs is used to server-side of a web application. Node.js is a very powerful JavaScript-based platform built on Google Chrome's JavaScript V8 Engine. It is used to develop I/O intensive web applications like video streaming sites, single-page applications, and other web applications. Node.js is open source, completely free, and used by thousands of developers around the world.

**
CRUD OPERATION**
C for Create
R For Read
D for Delete
U for Update

This CRUD operation is used to read , write, update and delete data from database from UI. CRUD stands for create, read, update and delete. These are the four basic functions of persistent storage. Also, each letter in the acronym can refer to all functions executed in relational database applications and mapped to a standard HTTP method, SQL statement or DDS operation.
Json Web Token(JWT)
JWT token used for secure API .
JWT token has three parts. they are below
header
payload
signature
Header
Header consist of two parts. the type of the token, which is JWT, and the signing algorithm being used, such as HMAC SHA256 or RSA.
Payload
Second part of the token is payload. It contains claims.
There are three types of claims: registered, public, and private claims.
Signature:
To create the signature part you have to take the encoded header, the encoded payload, a secret, the algorithm specified in the header, and sign that.

Benefits of using Node and Mongo with React project
Because Node, MongoDB, React has close relation with Javascript. MongoDB is designed to store JSON data natively, JSON is a javascript object notation that represents data on javascript object syntax. React is a javascript library and nodejs is a javascript run time. For this reason, we use NODE MONGO with REACT.

What are the differences between SQL and NoSQL database
SQL is a relational database and NoSQL is a non-relational database.
SQL databases are vertically scalable and NoSQL are horizontally scalable.
SQL database is table-based other hand NoSQL is document-based.

Some Important Topics of React

MD Rokibul Islam — Fri, 18 Feb 2022 11:03:48 +0000

JSX

JSX stands for javascript XML. It looks like HTML but it comes with the full power of Javascript.JSX allows us to write HTML code in React and convert HTML code into React elements. we don’t need to use appendChild() or ceateELement() method to put HTML element in DOM.

Virtual Dom & React
We can say virtual DOM is a copy of a Browser DOM. Virtual DOM is a virtual representation that is saved in memory and linked up with Browser DOM with ReactDOM.
The main difference between virtual DOM and Real DOM is that real DOM directly changes the content of the screen and virtual does not change any screen content it only changes the specific content of REAL DOM. Virtual DOM wastes less memory But Real DOM waste too much memory. Manipulation in REAL DOM is very expensive because it reloads the whole DOM But Virtual DOM manipulation is less expensive.

Props and State
state is mutable other hand Props are immutable
Props are used to pass data other hand state is managed within components.
Props are read-only and state can be changed
state does not make components reusable and Props make components reusable.

React Hooks
Custom hook allows us to reuse functions made by me. When I need a function that will be reused in many components, then we can get those functions extracting custom hooks. Here reusable function and hook are made by me not built-in hook or function.
example:
import react from “react”
const useCustomHook =()=>{
Here we can create our common function for component re use
}
export default useCustomHook

Optimize a react js application

Use state where necessary: We should avoid state passing down as a prop.
By Memoizing and Preventing unnecessary rendering
By using React.memo() or useMemo() we can avoid unnecessary re-rendering
By avoiding rendering all images at once we can also optimize react app . this called lazy loading images