![]()
✍️ 서론 덕타운은 기숙사 어플인만큼 리스트뷰가 많다. 그런데 보다시피 같은 리스트뷰더라도 형식이 매번 다르다. 나는 각 셀을 열과 행의 묶음으로 보았고 그렇다면 테이블로 표현하는 것이 좋겠다고 생각했다. 그리고 여러 화면에서 쓰니 이를 컴포넌트로 만들고자 했다. 여기서 셀이란 위의 그림의 빨간 테두리이다.(그냥 나 혼자 그렇게 칭한다.) 사진 속 셀은 주황색 선을 기준으로 행이 나뉘고 연두색 선을 기준으로 첫번째 행에서 열이 나뉜다. 👾 목표 여러 화면에서 활용 가능한 테이블 컴포넌트를 만들자! ☘️ 진행 과정 테이블에 채워질 내용들은 대체적으로 서버에서 받아온 배열 속 값들이다. 따라서 컴포넌트는 배열을 받아야한다. 또한 각 테이블에 채워질 내용은 페이지마다 형식이 다르므로 이를 지정할 클래스명이 필..
![]()
🧐 상황 외박신청란에서는 폼 작성 후 신청하기 -> 확인 순으로 버튼을 누르면 폼에 작성한 내용이 백엔드로 전달된다. 이때 성공적으로 전송이 된다면 성공이 됐다는 알림과 함께 화면이 새로고침이 되게 하고 싶었다. useNavigate를 이용해 화면을 이동하니 같은 페이지로 이동하면 되지 않을까 싶었다. fetch(apiUrl, request) .then((response) => { if (response.ok) return response; else throw new Error(response.errorMessage); }) .then(() => { navigate('/stayout'); setModalIsOpen(false); alert("외박 신청이 전송되었습니다."); }) .catch((error..
