오늘 TIL에 올릴 내용 많다고 아까(?) 밤 9시쯤 회의할 때 다같이 얘기했었는데 시간이 이쯤 되고 보니 하루종일 뭘 했는지 벌써 가물가물하다. TIL에 올려야지, 했던 내용 중 하나는 API URL에 대한 것이었다. 프론트가 백 없이 작업할 때에는 API 요청 없이 파이어베이스에 연동해서 직접 데이터베이스를 만지다 보니, 우리가 주로 보는 '주소'란 것은 주소창에 들어가는 말 그대로의 주소뿐이었다. 하지만 API URL은 서버에 요청할 때 사용하는 주소이므로 클라이언트단에서 보여지는 주소창 주소와는 전혀 상관없는 것이었다. 난 그걸 몰랐다ㅎ.ㅎ... 백에 무지한 프론트... axios를 쓰면서도, 심지어 거기에 API URL을 적어 넣으면서도, 나는 그걸 몰랐다. 그냥 생각해 본 적도 없었다고 말하는 게 적당할 것 같다. 관심 범위 밖의 일이었다, 지금까지는. (Thanks to 하영님!)
오늘은 손가락 움직임이 더뎌서 한 것도 별로 없었는데 오류는 역대급으로 많이 봤다. 그래도 이제는 그새 조금 익숙해졌다고 오류 뜨는 대로 바로바로 해결할 수 있는 것들이 생겼고, 또 반대로 자주 봐도 여전히 해결책을 모르겠는 것들도 있다. 리덕스와 axios를 만지면서 컴포넌트에 데이터를 주입하려는데 변수를 이렇게 저렇게 설정해봐도, 콘솔에 아무리 찍어봐도 내가 원하는 데이터를 불러오지 못하는 상황도 있었다. 오류 속에 갇혀 있다가 이대로 질식할 것 같아서(ㅋㅋㅋ) 결국 헬프를 쳤고 너무 허망하게도 일이 간단히 해결되고 말았다. 나의 몇 시간 고민을 무색하게 만든 간단한 방법이었다. props로 넘긴 데이터에 또 props라는 이름을 붙인 바람에, 그 데이터를 가져다 쓰기 위해서는 앞에 props.props.를 붙여야만 했다... 이걸 캐치 못한 내가 원망스러우면서도, 어쨌든 해결되어서 기분은 좋았다. (Thanks to 동환님!)
자정을 넘겨서 아까 한 2시쯤, 대충 만든 가짜 데이터 json 파일을 mock api를 사용해서 서버로 돌린 다음 연결하려고 하는데, 적절하다고 생각한 URL을 넣어도 브라우저에는 자꾸 { } 이렇게 빈 중괄호만 떴다. 보통 코드를 짤 때 자신 없는 부분에서는 한 줄 한 줄 콘솔에 다 찍어보는 나로서는 당황스러운 상황이었다. 데이터가 없는 경로를 찍은 것도 아닌데 어떻게 아무것도 안 뜰까? 구글링을 해도 속시원한 답변을 찾을 수가 없었다. 시간도 늦어서 누구한테 물어보기도 애매했는데 마침 요즘 어쩌다 보면 밤 시간에 자주 마주치게 되는 지혁님이 눈에 띄었다. 매우 바쁘셨을 테지만 그때 나는 너무 절망하고 있었다. 나는 프론트와 백 사이에 약속해 놓은 API URL을 타고 들어가는 게 아니라면 데이터를 받아오지 못한다고 생각하고 있었는데, 그 경로에 들어갈 수가 없다면 그 부분을 포함하는 좀 더 넓은 범위의 데이터를 받아온 후 잘라서 사용해보라고 하셨다. 그렇게 해도 되는 건지 안 그래도 궁금했는데 먼저 그렇게 말씀해주셔서 다행이었다. (Thanks to 지혁님!) 그런데 문제는, 그걸 해결하고 나니 다시 (나는) 알 수 없는 이유로 404 에러가 떴다....^^ 오늘은 그만 좀 하자 제발....
내일 할 일
점심 때쯤 시범 배포를 해보기로 했는데, 내가 하고 있는 일에 진전이 없어 어떻게 될지 모르겠다.. 내일, 아니 오늘은 이따가 백에 데이터 샘플(?)을 한번 요청해봐야겠다. 혹시라도 지금 내가 가지고 있는 json 파일보다 접근성이 좋을지도 모르는 일이니까? 주시는 데이터가 뭐든 간에 지금 내가 처한 것보다는 나은 환경을 만들어 줄 것 같다ㅠㅠ
json 파일의 데이터 구조는 우리가 애초에 사용하던 임시의 것이었는데 그걸로 하다 보니 실제 서버 연결 때 문제가 많을 것 같아 다시 바꿨다. 바꾼 파일에 대해서 공유해야 한다.