[Main-Project 개발일지]-15

프론트 팀원분이 레시피 공공 api에서 데이터를 받아서 사용하려고 하시는데 사용이 조금 애매한 느낌이라 
api 조회 천번인데 백엔드에 저장을 하는지 아니면 프론트에서 조회를 하는지
결정이 나지 않은 상황이었다.
당연히 서버쪽에서 처리를 하고 해당하는 데이터만 콕 찝어서 보내는 편이 데이터면에서 압도적으로 유리하겠지만 구현가능성에 대한 의문이 있기 때문에 프론트쪽에서 처리해보는 쪽으로 결정했다.
api로 데이터를 받아온 다음 어떻게 적용할 수 있는지에 대해 간단하게 데이터 출력등의 테스트를 해본 다음 어떻게 mapping하면 좋을지 이야기를 한 후 마무리했다.

오후에는 멘토링시간이었는데 

멘토님과의 대화 중 아래와 같은 조언들을 들을 수 있었다.
MSW로 백앤드 API 모킹하기를 학습해서 api 느낌 받아보기
호출은 안되어도 api가 설계는 되어있을 때 사용할 수 있는 것이기 때문에
api가 바뀌고 있는 경우면 쉽지 않기 때문에 
이런 경우에 백엔드에 의존을 덜 할수 있는 방법은 storybook이라고 있는데
props를 주입해줄 수 있기 때문에 개발을 조금 더 편하게 할 수 있다.

상태값들은
리액트쿼리를 사용해서 useEffect 대신에 사용하거나
provider를 사용해서 공급하는것이 더 좋을 것 같다.
(context api를 사용해서 consumer를 통해서 깊이있는 컴포넌트에게도 데이터를 전달을 해주고 변경할 수 있기 때문에 context에 provider를 고려해보는게 좋겠다.)

useEffect로 일단 구현을 해본 다음에 리액트 쿼리 도입 계획이 있다면
리액트 쿼리는 드릴링으로 완성한 다음 개선해보면 어떤 차이점이 있는지에 대해 경험할 수 있기 때문에 도움이 많이 될 것 같다고 생각된다.

멘토링을 할 경우 채용을 연계해서 말씀드리게 되는데
우리는 이 프로젝트를 면접관에게 어떻게 어필할 수 있는지에 대해 생각해보면
백엔드에서 api가 안나오고 있어서 기다리고 있다에서 끝나는게 아니라
어떻게 적극적으로 해결할 시도를 해봤는지에 대해 경험한 내용 자체가
성공하지 못했더라도 어떤 시도와 어떤 경험을 해봤는지에 대한 언급 자체가 메리트가 있다.

Nest.js에서는 이미지를 컴파일 최적화 해주는 부분들이 있는데
이런 부분도 최적화는 필요하다는 감을 가지고 가는 정도면 괜찮다고 생각한다.

캐시출력을 잘 가져가면 2.2mb는 큰 부담은 아니겠다는 생각도 든다는 말씀을 해주셨고

결론적으로 리액트쿼리나 스토리북등에 시간을 투자해 보는 것이 좋을 것 같다는 의견을 주셨다.

React hook form으로 상태를 관리하는 것도 좋기 때문에 도입을 검토해봐도 좋을 것 같다
React hook form은 form을 사용하는데 도움이 되는 라이브러리라고 한다.

마무리로 정리하자면
다른 협업자들의 일정에 끌려다리면 힘들 수 있기 때문에
그런 부분에 대한 의존성을 낮출 수 있는 기능들에 대한 학습도 필요하다고 생각하는데
MSW로 백앤드 API 모킹하기 등으로 의존성을 낮춰보고

그 뒤에도 시간적 여유가 되면 React hook form, React query등의 기술적인 학습을 하고
ux개선을 원한다면 그 부분에 대해서 새로운 기술적 라이브러리 도입도 나쁘지 않다고 생각하는데
서로 의논해서 우선순위를 정해보는것을 추천해주셨다.

결론적으로 내일 오후에 프론트엔드 작업을 merge한 다음 UX적으로 다듬을 부분에 대해 조금 더 살펴보고 그 뒤로는 어떤 기술을 추가할지에 대해 상의해보기로했다.
아마 금요일 오후에 합치기로 했기 때문에 상의는 월요일에 진행되지 않을까 생각된다.

 

 

 

CT(1).합분해는 특정 갯수의 숫자를 가지고 특정 숫자를 만들 수 있는 경우의 수를 구하는 문제였다. 범위는 n까지이며 n을 만드는 것이기 때문에 중복숫자를 사용할 수 없을거라고 생각하고 어렵게 생각했지만 뒤에 "또한 한 개의 수를 여러 번 쓸 수도 있다."라는 문장이 붙어 난이도가 급격하게 하락했다.
(동전 문제와 유사한 느낌)

let input = `20 2`.split(' ').map(Number)

let dp = []
for(let i = 0 ; i < input[1] ; i++){
    dp.push(new Array(input[0]+1).fill(1))
}
for(let i = 1 ; i < input[1] ; i++){
    for(let j = 0 ; j <= input[0] ; j++){
        let a = 0
        for(let k = 0 ; k <= j ; k++){
            a = (a + dp[i-1][k])%1000000000
        }
        dp[i][j] = a
    }
}
console.log(dp[input[1]-1][input[0]])