안루피취뽀일기

인턴기간이 뭐했다고 벌써 반이 지나가버렸다..그래도 혼자 끙끙 고분분투하며 실무경험을 쌓아가고 있으니열심히 개린이 성장하는 ing~~~! 여튼간에 이제 회사 앱런칭 데이가 거의 2주도 안남은 시점인데 말이죠..  내가 맡은 아이등록 + 문진 중아이등록에서 문진페이지로 넘어가는 곳까진 개발이 얼추 완료되었는데(얼추라고 한 것은 자꾸 케이스 테스트를 할 때마다 하자가 생기고 있어서..)문진 페이지도 아이등록 컴포넌트를 재사용하면 되어서 형태는 쉬웠으나가장 중요한게 페이지네이션이다. 문진 질문이 약 62개 정도 되기 때문에 스크롤로 무한정 내리면사용자가 무조건 불편하다. 그래서 페이지네이션 구현이 필수인데,,,, 이게 질문이 type, gender, ...등등 여부에 따라 나오는 질문과 안나와야 질문이 다르다..

저번 게시글에 이어서 상태관리 라이브러리를 파헤쳐보자. Redux까지 저번에 얘기했는데 Redux를 보완한 MobX 2. MobX 1. Action이 실행되면, 2. 상태값이 업데이트되고, 3. 해당 값을 구독하는 곳에 Notify가 되고, 4. 렌더링이 트리거된다. class Counter { number = 0; constructor() { makeAutoObservable(this); } add() { this.number += 1; } } const counter = new Counter() function App() { return ( {count} + ) } 리덕스에 비해 코드량이 훨씬 적고, 상당히 객체지향적인 것을 확인할 수 있다. 리덕스에서는 Reducer를 정의하고, Reducer를 위..

프론트엔드 개발자라면 상태 관리 라이브러리는 필수로 알아야 하는 덕목같은,, 그동안 물론 나의 짧디 짧은 개발 커리어 (프론트엔드개발 경력 약 4개월..)동안에는 React의 useState로 모든 상태관리를 하였으나.. 점점 개발을 하면 할수록 상태관리 라이브러리 사용은 필수 인턴 업무 중 세션/쿠키 데이터 관리가 가장 나에게 어려운 일이였는데 이걸 useState로 관리하기에는 너무 복잡한 일이였다. 한번 상태관리 라이브러리를 이참에 본격 배워서 써보자..! 도전! 리액트 상태관리, 왜 하는데......? 양방향 바인딩을 하는 앵귤러나 뷰와 달리, 리액트는 단방향 바인딩을 지원한다. 즉, 부모의 상태를 자식으로 전달할 수는 있지만(props) 자식의 상태를 부모로 전달하는 방법은 없다. 어떤 분이 물..

다시 틈틈히 코테연습을 해보려고 한다. 취뽀의 길을 향해... 코테 푸는 감을 아예 잃었기도 하고, 이제 내 주 언어가 자바가 아닌 자바스크립트가 되었다... ㅋㅋㅋㅋㅋㅋㅋㅋㅋㅋㅋㅋ 우주여행을 하던 머쓱이는 엔진 고장으로 PROGRAMMERS-962 행성에 불시착하게 됐습니다. 입국심사에서 나이를 말해야 하는데, PROGRAMMERS-962 행성에서는 나이를 알파벳으로 말하고 있습니다. a는 0, b는 1, c는 2, ..., j는 9입니다. 예를 들어 23살은 cd, 51살은 fb로 표현합니다. 나이 age가 매개변수로 주어질 때 PROGRAMMER-962식 나이를 return하도록 solution 함수를 완성해주세요. function solution(age) { var answer = ''; cons..

제목에서 느껴지시나요정말 쿠키란 놈 때문에 속이 뒤집어 집니다.  뉴진스의 쿠키는 아니고요,,,   아직 개발 경력 비록 일년도 채 안된 개린이지만요.쿠키가 지랄맞다는 건 구글링 좀만 해도 알겠어요.... 일단 내가 닥친 문제 :백엔드 서버를 이제 로컬이 아닌 dev서버로 변경해서 작업을 하려고 하니, 네. 쿠키가 안가져와져요. 그래서 하루죙일 이것저것 지피티도 물어보고 구글링도 해보고 원인을 파헤쳐보았는데요.개린이는 정말 이해도 안가고 뭐가 문제인지 이게 프론트 단에서 해결할 수 있는지 아예 감이 안잡혔어요.그래서! 사수분들께 결국 help 요청..ㅠㅠ(사수분들도 해결하지 못하셨어요 아직..)  일단 내일 아침까지 원인을 파악해주신다고 하니 기다려보자구요.....

인턴생활을 하고 있다.꽤나 막중한 임무를 맡았는데..(그냥 내 생각일지도,,)여튼간에 인턴 3일차에 큰 벽을 만났다. 지금 내가 맡은 게 정말 간단히 말하자면 문진.즉 설문조사, 회원가입 같은 폼을 만드는 과정인데질문카드를 받아오는 api에서 1번 문항에서 2번문항은 수월하게 넘어갔으나2번문항이 원하는 데이터를 아무리 전달해도 3번문항이 돌아오지 않고2번문항이 끊임없이 반복되는 난관에 봉착하였다.  same key 문제 어쩌고 저쩌고 하길래 key값이 문제인지 보았지만전혀 문제가 없었고.... api문제인가 해서Talend api test 에서도 post 메소드로 확인을 해보았지만 정말 데이터를 잘 주고 있었다. 그러나 믿을 수 없어postman에서 다시 테스트를 해보는..

모든 오류가 오류 메시지를 제공하지는 않는다.. initial investment를 15,000나 다른 값으로 바꾸면 이 숫자들이 폭등하는 것을 볼 수 있다. 이 오류를 찾는 것은 콘솔에 오류 메시지가 없기 때문에 조금 더 어려울 수 있다. 논리적으로 생각하자 초기에 앱을 재시작하면, 모든 것이 정상적으로 작동한다. 이 말은 오류가 calculateInvestmentResults 함수에서 발생한 것은 아닌 것 같다. 그리고 results부분이나 테이블 자료를 만드는 부분에서 생기는 것도 아닌 것 같다.. 값을 수정할 때만 오류가 생긴다. 그러므로, app 부분에서 일어나는 사용자 입력값을 가져오는 과정에서 연관이 있어 보인다. 이는 사용자 입력을 관리하는 부분을 사용자 입력 부분에서 앱 부분으로 이동했기..

Investment Calculator 개발 중.. 오류발생 정의되지 않은 값의 속성들을 읽어 들이는데 실패함을 알 수 있다. -> valueEndOfYear 속성을 읽는데 실패... 마지막 에러를 보면 이것이 접근하려고 하는 객체가 정의되지 않는 것 같기에 이 속성과 그 안에 저장되어 있던 값에 접근하는 데에 실패한 것이다. 코드의 어느 부분부터 찾아 해결해야 할지 좋은 아이디어를 주고 있다. valueEndOfYear 속성에 접근하는 부분에서 시작해야 한다. Results.jsx 여기 코드가 이 속성에 접근하려고 하는 부분이다. 하지만 이 속성의 사용을 직접 확인할 필요가 없다. 대신, 이 맨위에 오류 메시지의 실제 메시지 뒤에 단순히 이 오류 메시지 밑에 출력인 stack-trace를 얻었다. 이것..