프론트엔드/Component
https://mui.com/material-ui/getting-started/installation/ mui를 꼭 npm한 후 진행 import * as React from "react"; import { useTheme } from "@mui/material/styles"; import Box from "@mui/material/Box"; import MobileStepper from "@mui/material/MobileStepper"; import SwipeableViews from "react-swipeable-views"; import { autoPlay } from "react-swipeable-views-utils"; import styled from "styled-components"; ..
//렌더링 ; // 스타일 밑 컴포넌트 const PromotionContainer = styled.div` background-color: #4d207a; width: 100%; height: 150px; display: flex; flex-direction: column; justify-content: center; `; const SlideTextContainer = styled(PromotionContainer)` overflow-x: hidden; display: flex; flex-direction: column; `; const SlideText = styled.div` white-space: nowrap; `; const MotionSlideText = ({ direction, text }..
const Component = () => { const [genderMale, setGenderMale] = useState(null); const [genderFemale, setGenderFemale] = useState(null); ////////// 성별 변경(남자) const ChangeGenderMale = () => { setGenderFemale(false); setGenderMale((prev) => !prev); }; ////////// 성별 변경(여자) const ChangeGenderFemale = () => { setGenderMale(false); setGenderFemale((prev) => !prev); }; return ( 남자 여자 ); }; const GenderBut..
미리보기 사용방법 1. MUI 설치 1.1 작업 폴더에서 터미널을 켠다 VSC단축키(Ctrl + ` (esc 밑에 있는 거)) 1.2 아래 코드를 순서대로 터미널에 입력한다. npm install @mui/material @emotion/react @emotion/styled npm install @mui/material @mui/styled-engine-sc styled-components npm install @fontsource/roboto npm install @mui/icons-material // 참고 링크 //https://mui.com/material-ui/getting-started/installation/ 2. 컴포넌트 만들기 2.1 ChatTest.jsx 파일을 생성하고 아래 코드를 ..
