Mui 컴포넌트 style설정하는법, 텍스트 Area 사이즈를 조정하고 싶다거나, Margin을주고싶다거나 할때 style={{ width: 200 }} 속성을 사용해주면 된다. {setSearch(event.target.value)}} onKeyPress={(e) => { if (e.key === "Enter") { router.push( { pathname: "/SearchTextResult", query: { textResult: search, }, }, `/SearchTextResult` ); } }} /> 이와같이 텍스트필드 사이즈를 조절할때 위와같이 style={{width:150}}으로 사용해 주었고 { router.push( { pathname: "/SearchTextResult", que..

검색 결과에 따른 리스트를 뱉어내는데, 목록이 10개 이하일 때 도 있고, 100개가 넘을 때 도 있어서 PC나 모바일화면 양쪽에서 편하게 사용하려면 페이지네이션 기능이 필요하다 생각했다. 사진도 넣을거니까 더더욱 필요해짐, Django를 쓸때는 파이썬으로 slice를 사용해서 배열에 원하는 갯수만큼 저장한다음 페이지네이션으로 뱉어내는 형태 였는데 javascript도 마찬가지다. 오랜만이라 삽질을 조금했다. 1. for문을 사용해 처음엔 구현했다. [1,2,3,4,5,6,7,8,9,10,11] 이런식이면 5개씩 저장한다치고 [[1,2,3,4,5], [6,7,8,9,10], [11]] 아래와 같이만든다음 페이지네이션에 집어넣었다. 하지만 매우 비효율적인 방식이란걸 깨닫게 되고... JS에서도 2.slic..

간단한 Grid시스템은 Bootstrap을 사용하는데 전체적인 내브바부터 여러 필요한 디자인 컴포넌트들을 Mui로 구성하기로 했다. React와 사용방법은 거의비슷하다. https://mui.com/getting-started/installation/ Installation - MUI Install MUI, the world's most popular React UI framework. mui.com npm To install and save in your package.json dependencies, run: // with npm npm install @mui/material @emotion/react @emotion/styled // with yarn yarn add @mui/material @em..

https://stackoverflow.com/questions/37669391/how-to-get-rid-of-underline-for-link-component-of-react-router How to get rid of underline for Link component of React Router? I have the following: How do I get rid of the blue underline? The code is below: Team 1

https://mui.com/getting-started/installation/ Installation - MUI Install MUI, the world's most popular React UI framework. mui.com https://mui.com/styles/basics/ @mui/styles - MUI The legacy styling solution of MUI. mui.com 맨위에 2개는 MUI관련 세팅 페이지들이다. 1)npm이나 yarn으로 우선 리액트 프로젝트내에 설치해준다. 2)index.html 에 CDN넣어준다. 3)그리고 style관련해서 문제가 생기거나 필요해지면 위에 2번재링크의 style관련한 것도 설치해주면 크게 문제없이 사용가능! 사용법은 부트스트랩과 거의 유..