React - Komponensek

• Szerző: Sallai András
• Copyright © Sallai András, 2023
• Licenc: CC Attribution-Share Alike 4.0 International
• Web: https://szit.hu

npx create-react-app app01
code app01

app01/
  |-public/
  |-src/
  |-pages/
  |  |-Welcome.css
  |  `-Welcome.js
  |-App.css
  |-App.js
  |-App.test.js
  |-index.css
  |-index.js
  |-logo.svg
  |-reportWebVitals.js
  |-setupTests.js
  |-.gitignore
  |-package-lock.json
  |-package.json
  `-README.md

src/App.js

import './App.css';
 
function App() {
  return (
    <div className="App">
      <h1>Valami</h1>
    </div>
  );
}
 
export default App;

src/App.css

.App {
  text-align: center;
}

src/pages/Msg.js

import './Msg.css'
export default function Msg(props) {
    return <h1>Helló {props.name}</h1>
}

src/pages/Msg.css

h1 {
    background-color: aqua;
}

src/App.js

import Msg from './pages/Msg';
import './App.css';
 
function App() {
  return (
    <div className="App">
      <h1>Valami</h1>
      <Msg name='János' />
    </div>
  );
}
 
export default App;