농's 개발 공부 이야기

어제 고민하던 테이블 데이터를 부르는 방법에 대해서는 두 번째 방법이었던 한 번에 호출해서 값을 변경 해 주는 방법을 선택하기로 했다. 여러 번 호출해서 계속 append 하는 것보다는 깔끔할 거 같기 때문에 선택했다. 그래서 먼저 데이터를 data 변수에 query해서 받아 오고, array를 수정하려고 했는데, 이게 또 필요한 칼럼은 빼고 새로 만들어서 넣고 하면 코드가 너무 지저분해질 거 같아서 새로운 array를 만들기로 했다. 처음에는 각 column별로 array를 만들어서 값을 추가해 줘야 된다고 생각해서 또 잔뜩 array를 만들었더니 너무 보기가 안 좋아서 다시 생각하기로 했다. 밥 먹다가 문득 행별로 push 하면 되겠다는 생각이 떠올랐다. 어차피 data를 순회하니까 각 순회 때마다 ..

리액트에서 테이블의 내용을 엑셀 파일로 다운로드 할 수 있는 방법들을 여러 가지 찾아봤다. 어제 시도했던 react-html-table-to-excel은 현재 만들어진 테이블이 html이 아니기 때문에 포기. json-to-excel, sheetJS 등 여러 가지를 찾아보다 보니 지금 테이블에 뿌려지는 데이터 타입부터 알아야 할 거 같았다. async/await을 이용하고 있었기 때문에 request하고 받아오는 형태는 promise 객체였다. 이제 여기서 어떻게 데이터만을 뽑아낼 것인지가 다음 문제였다. 찾아본 대부분의 lib들이 array나 json 형태였기 때문에 promise에서 data만 array형태로 가져오고 싶었다. 이 부분도 여기저기 보면서 삽질하다가 간단하게 response.data로 ..

오늘은 몸이 안 좋아서 오전에는 좀 쉬엄쉬엄 작업을 했다.(😛) 어제 고민하던 검색 창은 form으로 한꺼번에 묶어서 return하는 형태로 결정을 하고 작업을 계속 했다. 대충의 틀은 만들었지만 기존의 사용자 검색 창과 계속 맞물리는 부분이 생겼고 검색 필터들도 한 줄에 하나씩 나와서 어떻게 해야 할지 고민하던 중에 새로운 업무를 부여 받았다. 테이블에 뿌려진 데이터들을 한 번에 모아서 엑셀로 다운로드 하는 작업을 해야 한다. 여러 자료들을 찾다보니 react html-table-to-excel을 사용해서 하는 방법들이 많아서 시도 중인데, 다만 현재 페이지에 있는 데이터 뿐 아니라 필터로 걸러진 모든 데이터들을 받아야 한다는 점이 고민이 된다. table to excel은 필터로 걸러진 데이터들을 받..

저번 주까지의 인턴 내용은 학교에 제출할 보고서에 정리 되어 있기 때문에 나중에 정리해서 티스토리에 올리고 이번 주 부터는 여기에 바로 작성하기로 했다! 오늘 먼저 한 일은 어제 작업하던 메모 부분을 마무리하는 것이었다. 메모를 수정할 수 있게 프론트엔드에서는 modal을, 백엔드에서는 api를 추가하면 되는 것이었다. 공지사항 게시판을 만들면서 열심히 들여다 본 부분이라 큰 문제 없이 할 줄 알았는데, 만들어야 했던 메모 부분은 기존에 service와 controller가 다 만들어져 있어서 생각과 달랐다. 열심히 repository save를 했지만 업데이트가 제대로 되지 않아서 찾아보다가 뒤늦게 repository사용이 불가능하다는 것을 알게 되었다. 기존 코드에서는 repository가 아니라 q..

작업을 하다 보니 다음과 같은 상황이 발생했다. usestate를 사용해서 state를 선언한 후 setState로 값을 변경하고 그 변경한 값을 바로 이용해서 다른 값을 바꿔 줘야 하는 상황이 생겼다. 이 부분에 있어서 React가 익숙하신 분들은 바로 어떤 상황인지 감이 잡히고 어떻게 대처하면 되는지도 바로 떠오르시겠지만 나는 React가 익숙하지 않았기 때문에 여러 자료들을 찾아보게 되었다. 먼저, 작업하던 상황은 다음과 같았다. (실제 작업한 코드와 비슷하게 작성한 코드이다.) const doing = async (params) => { const [finalDate, setFinalDate] = useState([]);//array 값의 state const [startDate, setStart..

게시판을 만들다 보니 등록일을 출력할 형식이 필요했다. 물론 일반적으로는 yyyy-mm-dd로 사용하겠지만 주 이용자가 한국인이기 때문에 시간의 형식을 '-년 -월 -일 -시 -분'의 형식으로 출력하고 싶었다. 이를 위해서 여러 자료들을 찾아보니 Moment.js를 사용하면 간편하게 될 것 같았다. Moment.js는 시간이 포함된 데이터를 받아서 조작할 경우 사용 가능한 라이브러리 중 하나이다. SETUP //Moment 라이브러리 설치 npm i moment HOW-TO import Moment from 'moment'; const changeTime = (record) => { const createdTime = Moment(record.createdAt).format('YYYY년 MM월 DD일 H..

[게시판에서 게시글의 제목을 클릭하면 게시물 내용이 등록일, 수정일과 함께 팝업창으로 띄우기] * 현재 작업은 React로 진행 중이며, 특히 ant-design의 Protable 컴포넌트를 이용하고 있다. 팝업창으로 띄우는 방법에 대해 현재 상황에 맞는 여러 방법을 모색 해 보았다. 1) ant-design의 Popoverˇ 사용하기: 아래 같은 작은 팝업이 아닌 팝업 창으로 띄우고 싶었기 때문에 pass. 2) javascript 를 이용해서 render할 때 바로 창 띄우기: render 할 때 사용할 새로운 함수를 만들어야 해서 pass. 3) ProTable을 사용 중이니 form을 그대로 활용 해서 게시글 내용 보이게 하기: 하지만 disabled는 동작하지 않았고 또 비슷한 종류의 옵션을 살..