<index.js>
import React from 'react';
import ReactDOM from 'react-dom/client';
import './index.css';
import MonoButton from './MonoButton';
const root = ReactDOM.createRoot(document.getElementById('root'));
root.render(
//<React.StrictMode>
<MonoButton />
//</React.StrictMode>
);
<MonoButton.js>
import ArrangeButton from './ArrangeButton';
const MonoButton = ()=>{
return(
<div>
<ArrangeButton buttonText="PUSH"/>
</div>
)
}
export default MonoButton;
<ArrangButton.js>
const ArrangeButton = (props)=>{
return(
<div>
<button style={{'color':'#FF0000','backgroundColor':'#00FF00'}}>{props.buttonText}</button>
</div>
)
}
export default ArrangeButton;
という感じです。