MUI

<TextField/>

: variant = “filled” , “outlined”(테두리)

color=”secondary”(빨강)

type=”date” (날짜, 드롭다운)

type =”time”(시간, 설정)

label= (플레이스홀더와 비슷함, 애니메이션가능 (variant filled))

placeholder=

makeStyles


import { makeStyles } from '@material-ui/core/styles'
const useStyles = makeStyles({
	root: {
		background: 'linear-gradient(45deg, #333, #999)',
		border:0,
		borderRadius:15,
		color:'white',
		padding: '0 30px',
	}
})

function ButtonStyled() {
	const classes = useStyles();
	return <Button className={classes.root}>버튼스타일테스트</Button>
}

ThemeProvider


import { ThemeProvider, createMuiTheme } from "@material-ui/core/styles"
const theme = createMuiTheme(
	{
		palette: {
			primary: {
				main: orange[500],
			}
			secondary: {
				main: green[500],
			}
		}
	}
)

Typography

: varient=”h1”

카드 내용 가로로 뿌리기

Using the Grid Component in Material-UI to Create Responsive Layouts

In this article, we will learn about how to use the Grid component in Material-UI to create a responsive layout for a React application. We will first learn about how the Grid container and Grid item work. Then, we will...

https://levelup.gitconnected.com/using-the-grid-component-in-material-ui-to-create-responsive-layouts-7b9de0d11c6

Material-ui Autocomplete warning The value provided to Autocomplete is invalid