[프론트엔드 데브코스 TIL] 2023.10.18 ~ 21 노션클로닝

SoJuSo·2023년 10월 21일
0

2023.09 ~ 2024.01 TIL

목록 보기
18/105

금일 학습 내용

배열이 같은 지 비교하려고 할 때, 단순히 배열 == 배열으로 비교하면 원하는 값이 나오지 않는다.
프로젝트를 구현하면서 가장 포커스를 맞춰야 하는 곳은 바로 개발자 도구이다. 개발자 도구에서 얘기하는 실마리를 통해서 많은 에러를 해결할 수 있다.

TMI
지난 몇일간 TIL이 없었는데 프로젝트 기간이라 정신이 없었다. 그리고 솔직히 플젝기간에 TIL을 뭘 적어야하지? 하고 예전처럼 정신없이 구현만 했는데...

바보같이 또 또 또 실패나 실수를 기록하지 않고 폭주기관차마냥 달렸다. 너무나 구현에 집중한 나머지 이런 일이 발생했다. 실패에서 나오는 경험들이 결국 기록할 수 있는 자산이 된다는 것이고 기록을 함으로서 다음에는 실수하지 않을 수 있는건데...

그래도 이번엔 일찍 알아차려서 다행이다. 그래서 앞으로는 프로젝트 기간에도! 주말에도! 소소하게나마 TIL을 작성하려고 한다. 특히 주말 같이 작성할 내용이 많지 않은 날에는 KPT, 4L, 5F와 같은 기법으로 간단하게 작성해야겠다.


데브코스

❗️400 ERROR..?

프로젝트를 진행하며 API를 POST했는데 400에러가 떴다. 난생 처음 본 에러여서 관련해서 찾아보니 서버가 클라이언트 오류(예: 잘못된 요청 구문, 유효하지 않은 요청 메시지 프레이밍, 또는 변조된 요청 라우팅) 를 감지해 요청을 처리할 수 없거나, 하지 않는다고 한다.

이 문제는 내가 보내는 무언가가 잘못되어서 처리하지 않으니까 확인해봐! 라는 뜻이다. 그런데 정보가 부족했다. 내가 뭘 잘못하고 있는데??😭

🛠️개발자 도구는 이럴 때 정말 유용하다. Network 탭에서 API request 목록을 확인할 수 있고 해당 리퀘스트 목록을 클릭하면 저렇게 디테일한 Response 내용을 확인할 수 있다.

파악한 문제점은 Unexpected token o in JSON at position 1 이였다. 문제점을 인지하고 해당 키워드로 검색을 해 본 결과 결론은 다음과 같았다.
너 JSON으로 보낸 거 맞아? 아니면 JSON으로 보냈는 데 뭐 문제 있는 것 같은데? JSON 형태로 데이터를 파싱하지 않아서 생긴 문제였고 해당 코드를 즉시 수정하니 코드가 정상적으로 동작했다.

문제 코드: body: { title: createdDefaultTitleText, parent: createdDefaultParent }

해결 코드: body: JSON.stringify({ title: createdDefaultTitleText, parent: createdDefaultParent })

[1,2,3]❗️== [1,2,3]

오늘 코딩테스트를 풀면서 직면한 문제인데 배열 간 직접 비교를 하면 false가 나온다..! 이 조건을 충족시키지 못해서 무한루프를 유발해 프로그래머스 서버랑 자주 오류를 통신했다.

const firstArray = [1,2,3,4,5]
const secondArray = [1,2,3,4,5]

위와 같은 코드가 있다고 했을 때 나는 firstArray === secondArray 로 구현해서 코드를 진행했다. 하지만 원하는 결과가 나오지 않았고 일일이 콘솔을 찍어본 결과 저 값이 false로 출력되고 있었다. 이유는 배열의 주소값을 비교하기 때문에 당연히 false가 뜬다.

그래서 이를 비교하기 위해서는 몇 가지 방법이 있다.(위 포스팅 참조)

그 중 나는 가장 간단한 toString() 방식으로 구현했고 코드를 수정해주자마자 바로 통과했다. 이걸 아직도 몰랐다고? 랑 이걸 모른채로 수 많은 코딩을 해왔다고? 라는 허탈감과 이제라도 알았다라는 안도감이 들었다. 오늘도 하나 배워갑니다.


오늘의 소회

날이 많이 추워졌다. 이제 밤에 창문을 닫고 자야한다. 그 열이 많은 내가!!! 그만큼 건강관리에 힘써야하는 기간이고 잘 먹고 잘 자려고 노력하고 있다.

지난 며칠 간 올라왔던 수 많은 동기분들의 MIL 회고를 보고 또 여러 얘기들을 거치며 읽기 좋은 글에 대한 고민을 지속적으로 하고 있다. 코딩계의 박찬호라고 불려도 손색 없을 정도로 한번 입이 열리면 말도 많고 TMI를 대방출 하는데 핵심만 짧고 간단하게 쓸 수 있는 방법이 늘 고민이다. 단순히 누군가에게 잘 보이기 위해서가 아니라 나를 잘 정리할 수 있는 방법을 알고 싶다.

이번 프로젝트를 하면서 지금까지 좋았던 점과 안좋았던 점이 둘 다 있는데 좋았던 점은 일찍해서 거의 기본 요구사항은 다 구현했다는 것이다. 제출할 수 있는 최소치는 넘겼다.
하지만...하지만!!! 내부가 너무 별로다.. 내일은 요구사항을 다시 한 번 점검하고 코드를 싹 리팩토링한 뒤에 추가 기능들을 체계적으로 구현해야겠다.
내일도 🔥🔥🔥

profile
Junior Frontend Engineer

0개의 댓글