Am I importing a component in React correctly?

Question

React

I am learning React.

Working code.

An example of a component that I will be importing.
MyComponent.jsx

import React from 'react';
const MyComponent = () =>
{
return (

<div className="MyComponent">
Содержимое компоненты, JSX код и т. д.
</div>

);
}

export default MyComponent;

I import the component into the main file.
App.jsx

import React from 'react';
import Header from './components/MyComponent';

const App = () => {

return (
<div className="App">
<div className="wrapper">
<MyComponent />
</div>
</div>
);

export default App;

Am I doing everything right? Namely:
1) import React from 'react'; in each component file. Or maybe it is enough to import only in one?
In App.jsx for example? And so it turns out we re-insert the extra code.
In php, there is include_once for this - insert the content only 1 time.

2) Is it customary to save the component file with the jsx extension? (MyComponent.jsx)
3) When you include a component file, is it customary to write it without an extension?
(import Header from './components/MyComponent';)

Answer 1

1) Not enough. The component itself requires self-sufficiency in the use of other components in it.
2) It is possible in js as well. But in this case, templates will have to be built through cumbersome functions. jsx is an extension that allows you to build a component template in much the same way as writing regular html
3) Yes