React Js End - End

What is React Js?

React is a JavaScript-based UI development library. Although React is a library rather than a language, it is widely used in web development.

• So, this is used for a single-page application.

• Create a User Interface from components.

Why does ReactJS load data very quickly?

React Uses the virtual DOM
example:-

<ul>
    <li>apple </li>
    <li>dog</li>
    <li>mango</li>
</ul>

In the above code, if we want to change the data of the second list, with the help of the Virtual DOM, we can change that specific list without needing to alter the entire data.

Why learn React JS?

1. Maintained by Facebook

2. Highest demand due to the fast speed

3. React is simple to learn.

4. Large community for your support

Which companies are using React?

• Facebook

• Airbnb

• Walmart

• Discord

• Pinterest

• Uber Eats

• Atlassian

• Netflix

• Salesforce

How to get a module in Javascript?

How to import and export modules in Javascript?

Modules are a way to organize your JavaScript code into reusable units. They promote code separation, maintainability, and better code structure. Here's a breakdown of importing and exporting modules:

Exporting Modules

1. Default Exports:

   • Use the export default statement before a function, class, or variable to make it the module's default export.

Only one default export is allowed per module.

export default function greet(name) {
    console.log("Hello, " + name + "!");
}

2. Named Exports:

• Use the export statement with curly braces {} to export multiple functions, variables, or classes.

• You can give them custom names using as for convenience.

export function add(x, y) {
    return x + y;
}

export function subtract(x, y) {
    return x - y;
}

export const PI = 3.14159;

Importing Modules

1. Importing Default Exports:

   • Use the import statement followed by the default export name to import the default export from a module.

import greet from './greet.js'; // './' indicates current directory

greet("Alice");

2. Importing Named Exports:

• Use curly braces {} with the import statement to import specific named exports.

• You can optionally give them aliases using as.

import { add, PI } from './math.js';

const result = add(5, 3);
console.log(result); // Output: 8

console.log(PI); // Output: 3.14159

Additional Points

• Modules are typically saved with the .js extension.

• For browser environments that don't natively support modules, you might need a bundler like Webpack to handle them.

• You can also import modules from external libraries using a module bundler or a CDN (Content Delivery Network).

By effectively using modules, you can keep your JavaScript code organized, maintainable, and reusable across different parts of your application.

Note: There are 3 types of Modules