#grid

css flex, grid 질문

풀스택 웹개발자로 현재 공부중인데 레이아웃 관련해서 flex와 grid를 배우고 신세계를 알았습니다. 다만 우리나라에서는 아직도 float, absolute등으로 아직도 레이아웃을 많이 해서 배워도 안쓴다는 이야기를 들었는데 현업에 계신분들 정말인가요?

CSS 그리드 레이아웃 질문드립니다.

최근 Next.js로 프로젝트를 진행하며 여러 페이지를 벤치마킹하다가 궁금한 내용이생겨서 질문드립니다. CSS의 grid속성의경우 2차원속성으로 가로세로 전체 레이아웃을 지정하거나 특정 컴포넌트 내부에서 레이아웃을 잡는데 사용한다고 배웠습니다. 몇몇 페이지의 경우 부트스트랩을 사용한것같은데 n개의 컬럼으로 나눈뒤 내부에 하나의 요소 또는 메인과 사이드네비게이션을 배치하는경우가 있는데 방법론이 있는건지 어떤 의도가있는건지 궁금합니다. 그리드를 처음 공부할때 전체적인 레이아웃을 잡거나 인스타그램같은 n x n의 이미지 배치할때 사용하고 이외 플렉스위주로 사용했는데 성능적으로 이점이 있는건지 .. 세로스크롤 때문인지 궁금합니다.

Mui x data grid 질문입니다.

그룹헤더 커스텀 하는 방법이 따로 있나요? 예시 찾아봐도 커스텀헤더는 보이지 않더라구요.. 해당 기능이 존재하는 건지 여부가 궁금합니다

flex, grid 스타일 정렬을 맞추기 위해서 empty component를 사용하는건 안티패턴인가요 ?

flex, grid 등을 사용해 나열할 때 자리만 차지하기 위한 empty 컴포넌트를 만들어 쓰시기도 하나요?? 안티패턴 같긴 한데... 편하다고 생각해서 가끔 쓰거든요 다른 분들은 어떤지 궁금합니다.

react 그리드에서 수정된 부분이 있으면 조회버튼을 눌렀을 때 alert창 띄우기 기능 (useState 비동기 질문)

안녕하세요. react 초보 개발자입니다. 자바스크립트도 처음이라 비동기 관련해서 제 의도와는 다르게 작동할 때마다 당황하는 중입니다🤣 쌩초보임을 감안해 너그럽게 댓글 달아주시면 감사하겠습니다 :) 화면 설명 먼저 드리자면 조회 버튼을 누르면 그리드에 데이터가 뜨고, 데이터를 수정한 후에 저장할 수 있는 화면입니다! 제목과 같이 그리드에서 수정된 부분이 있을 경우에, 저장하지 않고 조회버튼을 누르면 '수정중입니다. 조회를 진행하시겠습니까?' 와 같은 alert창을 띄우는 기능을 구현중에 있습니다. 참고로 그리드는 aggrid 사용중입니다. 1. 우선 변경값 존재여부를 확인하는 변수 isChanged 를 useState로 선언해주었습니다. const [isChanged, setIsChanged] = useState<boolean>(false); 2. 그리드에서 수정된 부분이 있나 체크하는 건 onCellValueChanged 함수를 통해 값이 변경되면 isChanged가 true로 바뀌게 했습니다. const onCellValueChanged = (params: any) => { setIsChanged(true); }; 3. 저장로직에는 setIsChanged(false)가 있습니다. 또한 저장이 제대로 끝난 후에 조회로직을 탑니다. const onClickSave = async () => { // (생략) 저장 로직 // 저장 완료 후 setIsChanged(false); onClickSearch(); } 4. 조회로직에는 isChanged의 값을 확인하고, 변경값이 있다면 alert창이 뜨고, 확인을 누르면 조회를 진행합니다. const onClickSearch = async () => { if (isChanged) { // (생략) 메세지 띄우는 로직. alert창에서 확인을 누르면 조회 진행 setIsChanged(false); } // (생략) 조회 로직 } * 문제점 정상적으로 저장을 한 후에 조회로직을 타는데, isChanged가 false로 변경되기전에 조회로직을 타서 alert창이 뜹니다. 이 문제는 어떻게 해결하는 게 좋을까요..?

react css 관리 관련해서 질문드립니다!

안녕하세요 현재 프론트엔드 공부중인데 지금까지 프로젝트 해오면서 mui를 계속해서 사용해 오고 있는데 사용중인 이유는 makeStyles랑 Grid가 편해서 사용중입니다. 근데 사용해오면서 궁금한 점이 몇가지 생겨 질문드립니다. 1. mui를 사용하면서 기존 html 태그와 mui의 Box, Grid, Card 이런것들을 같이 혼합해서 사용하는것도 상관이 없을까요? 제가 Grid는 레이아웃 잡기위해서 사용하는데 나머지는 잘 사용하지 않아서 질문드립니다! 2. 제가 makeStyles를 사용하는 이유는 react 컴포넌트 파일(jsx, tsx)안에서 css를 같이 관리하는게 편해서 사용중인데 또 css 부분의 길이가 길어지면 한 파일의 길이가 너무길어져서 어떻게 관리하는게 맞는지 모르곘어서 요즘 많이 사용하는 css관리 기법이나 추천해 주실게 있으시면 추천해 주세요! 3. 취업이나 나중을 위해서 mui처럼 편한것만 사용하는게 좋을 까요 아니면 여러가지 해보는게 좋을 까요?