React/Material-UIで簡単なUI

$ npm install @material-ui/core

import React from "react";
import {
  AppBar,
  Container,
  Toolbar,
  Typography,
  Grid,
} from "@material-ui/core";

const MySample = () => {
  return (
    <div>
      <AppBar position="static">
        <Toolbar>
          <Typography>Iris Dashboard</Typography>
        </Toolbar>
      </AppBar>
      <Container>
        <Grid container>
          <Grid item xs={12}>
            AAA
          </Grid>
          <Grid item xs={6}>
            AAA
          </Grid>
          <Grid item xs={6}>
            BBB
          </Grid>
          <Grid item xs={4}>
            AAA
          </Grid>
          <Grid item xs={4}>
            BBB
          </Grid>
          <Grid item xs={4}>
            CCC
          </Grid>
        </Grid>
      </Container>
    </div>
  );
};

export default MySample;

import logo from "./logo.svg";
import "./App.css";
import MySample1 from "./components/MySample";

function App() {
  return (
    <div className="App">
      <MySample />
    </div>
  );
}

export default App;