top of page
Logo der Online Agentur mdwp

Module

In JavaScript and therefore in React JS, a Module is a part of code that is encapsulated and can be imported or exported for use in another file. Modules enable developers to split their code into various reusable, logical, and independent parts.

Modules also help to avoid scope issues as all members (variables, functions, objects, etc.) within a module are private until explicitly exported.

Here is an example of how to use modules in React JS:

1. We can create a module in a file,`Message.js`:

```jsx
import React from 'react';

export class Message extends React.Component {
render(){
return (
<h1>Hello from Module</h1>
)
}
}
```

In this file, we are exporting a React component named `Message`.

2. We can import `Message.js` in another file called `App.js`:

```jsx
import React from 'react';
import { Message } from './Message'; // import module

class App extends React.Component {
render() {
return (
<div>
<Message /> {/* Use the imported module */}
</div>
);
}
}

export default App;
```

In `App.js`, we are importing the `Message` module from `Message.js` and using it within our `App` component.

bottom of page