728x90

[Front-end] 개발자 공부 108

[개발 공부 48일차] Scope Chain, 재귀적 수행 | JS 문법 재청강

그동안 하려고 했었던 JavaScript 문법 종합반 강의를 다시 완강하였다. 보면서 작성한 코드만 해도 양이 엄청 많다. 이번 연휴엔 너무 졸리고 피곤해서 자고, 쉰 시간이 많긴 하지만 그래도 JS 문법을 전반적으로 다시 공부함으로써 코드에 대한 이해력이 많이 오른 듯하다. 1. 재귀적 수행 (재귀 호출) 2. Scope Chain (스코프 체인) 3. 실행 컨텍스트 4. JS 문법 종합반 들으며 작성한 코드 5. 금일 소감 1. 재귀적 수행 (재귀 호출) : 함수가 직접적으로 또는 간접적으로 자기 자신을 호출하는 과정 재귀 함수는 특정 조건(기저 조건)이 충족될 때까지 자기 자신을 계속해서 호출한다. 기저 조건은 재귀가 무한히 반복되는 것을 방지하기 위해 설정된다. 재귀적 수행은 복잡한 ..

[개발 공부 47일차] 아웃소싱 PT 준비 완료!

내일 있을 발표를 위해 오늘 시연 영상 촬영하고 PPT 제작 완료했다. 휴... 일찍 끝낼 줄 알았는데 예상 외로 배포에서 Error가 계속 생겨서 그거 트러블 슈팅 하느라고 정말 하루 중, 대다수의 시간을 보냈다. 하... 그래서 Git 공부 할 때 배포 공부도 같이 해야겠다. 서버랑 이래저래 연결된 게 많고 고려할 게 많아서 배포 공부도 필수일 것 같다. 1. PPT 제작 완료 2. 금일 소감 1. PPT 제작 완료 어제 밤에 배포를 완료해서 오늘은 거의 해야 할 게 없을 줄 알고 공부 계획 다 짰는데, 어제 배포할 때 사용한 Glitch 서버가 안 깨고 계속 잠들어 있어서 배포 링크의 UI가 하나도 안 떴다. 어떻게 해야 할지 반나절을 고민하고 이래저래 시도하다가 튜터님이 JSON se..

[개발 공부 46일차] Vercel 배포 | async - await

1. Vercel 배포 완료! | 도메인에 URL 등록 2. 헷갈리는 개념 요약 1) async - await 2) fetch - then 3) Optional Chaining (옵셔널 체이닝) 4) Hook의 정의, 사용법 3. 금일 소감 1. Vercel 배포 완료! | 도메인에 URL 등록 배포 절차에 따라 진행한 뒤, 최종적으로는 KAKAO Map API를 발급받은 계정 사이트 도메인에 Redirect URL을 등록해 주어야 정상적으로 배포 링크를 들어갔을 때, 카카오 맵이 UI에 나온다. 배포는 지금껏 다른 팀원이 했었어서 배포 방법을 자세히 알지 못했는데 이번 팀 프로젝트 때엔 팀원들과 화면 공유하며 내 손으로 직접 배포를 해서 뿌듯하기도 하고, 하나 더 배워서 너무 좋았다. 배포..

[개발 공부 45일차] gitignore에 env 반드시 추가하기

1. KAKAO Map이 화면에 나오지 않음 | API Key 절대 확인하기 2. gitignore에 env 추가해두자 3. 즉시 반환 조건문에 꼭 안 넣어도 되는 조건은 제외하기 4. 정확한 위치 정보로 등록되게 하기 5. 금일 소감 1. KAKAO Map이 화면에 나오지 않음 | API Key 절대 확인하기 이유는 index.html에 API Key를 넣어주지 않았기 때문이다. 초기세팅 때 같이 넣은 줄 알았는데, 아니었던 것이다. 작성한 코드가 문제인가 했더니 원인은 그게 아니었다. 다소 댕청한 실수이지만... 아무튼 해결되었다. 우리가 사용한 API는 ReactKakaoMapSDK에서 제공하고 있는 Map API다. SDK는 소프트웨어 개발 키트(Software Development ..

[개발 공부 44일차] 개발 배우기가 정말 어려운 이유

오늘까지 해서 팀 프로젝트 3일차다. 금요일에 시작해서 금, 토, 일. 이제 각자 페이지 구현한 것 마무리하는 단계다. 사실상 금요일에는 프로젝트가 어떻게 진행되는지 발제 듣고 S.A. 작성하고 팀원들과 초기 세팅 맞추느라 하루를 다 썼다. 본격적으로 각자 구현에 돌입한 것은 토요일부터였다. 나는 토요일에 거의 뻗어서 잠 좀 보충하고 거의 밤부터 집중해서 개발에 들어갔다. 1. 개발 배우기가 정말 어려운 이유 2. env에 따라 알맞은 경로 작성 3. 금일 소감 1. 개발 배우기가 정말 어려운 이유 https://brunch.co.kr/@jypthemiracle/14 개발 중간중간 잠시 쉬는 틈을 활용해 이런 글을 읽게 되었다. 저번과 이번 챕터에서 어려움이 많았어서 공감이 되려나 싶어서 들..

[개발 공부 43일차] JS 자료구조 | 예문 & 용도

코드를 작성하는 데 있어서 어려움을 느끼는 이유를 좀 더 곰곰이 생각하다가 자료구조에 대해서 더 명확하게 알고, 또 정리해 두는 게 필요하겠다 싶어서 오늘은 포함해 이번 주말까지는 자바스크립트 자료구조에 대해서 공부할 생각이다. 1. JavaScript 주요 자료구조 2. 각 자료구조의 예문 & 용도 3. 금일 소감 1. JavaScript 주요 자료구조 1) 배열(Array) : 연속적인 메모리 공간에 동일한 타입의 데이터를 순서대로 저장 인덱스를 사용해 데이터에 접근 가능 다양한 메서드(push, pop, shift, unshift, slice, splice 등)를 통해 배열 조작 가능 2) 객체(Object) : 키(key)와 값(value)의 쌍으로 데이터를 저장 유연한 데이터 구조를..

[개발 공부 42일차] Redux-Toolkit, Redux Error

오늘은 다소 짧은 포스팅이 될 것 같다. 과제 하고 하루 종일 코드 짜느라 개념이나 다른 걸 공부할 여유가 없었다. 1. [plugin:vite:import-analysis] Missing "./modules/letters" specifier in "redux" package 2. Uncaught TypeError: Cannot read properties of undefined (reading 'filter') 3. 금일 소감 1. [plugin:vite:import-analysis] Missing "./modules/letters" specifier in "redux" package 이번 과제에선 타인의 코드를 읽는 능력도 함께 길러보자 하는 생각으로, 어려운 길이 되겠지만... 내 코드..

[개발 공부 41일차] Thunk(Redux 미들웨어), Custom Hook

1. [Redux 미들웨어] Thunk 2. Custom Hook (커스텀 훅) 3. 금일 소감 1. [Redux 미들웨어] Thunk : Dispatch를 할 때, 객체가 아닌 함수를 Dispatch 할 수 있게 됨 Dispatch(객체)가 아니라 Dispatch(함수)를 할 수 있게 되는 것! => 중간에 하고자 하는 작업을 함수를 통해 넣을 수도 있고 그것이 중간에 실행되는 것 [중요] '함수'를 Dispatch 할 수 있게 해줌! 액션이 리듀서로 전달되기 전, 중간에 어떤 작업 더 할 수 있음 Dispatch 하면 Action이 reducer로 전달되고, reducer는 새로운 state를 반환하는 과정에서 미들웨어를 사용하면, 하고 싶은 작업들을 넣어서 할 수 있음 [사용 이유] :..

[개발 공부 40일차] ...(spread 연산자), Compile Error

1. [JSONPlaceholder] setState & spread 연산자 쓰임 이유 2. Uncaught TypeError: Cannot read properties of null (reading 'map') 3. Failed to load resource: net::ERR_CONNECTION_REFUSED 4. Uncaught (in promise) ReferenceError: process is not defined 5. 컴파일 에러(Compile Error) & 런타임 에러(Runtime Error) 6. 금일 소감 1. [JSONPlaceholder] setState & spread 연산자 쓰임 이유 JSONPlaceholder를 복습하다가 위 사진에 하이라이트 처리한 부분이 이해..

[개발 공부 39일차] Redux 작동 체계 | 데이터, 함수, Custom Hooks

오늘 팀 배정이 다시 됐다. 다행이다. 팀이 바뀔 때마다 기여 가능한 인원이 한 명씩 줄어서 이번 팀에서는 '혼자 다 해야 하는 거 아냐??' 했는데 걱정하지 않았어도 좋았을 팀원분들로 배정이 되었다. 1. Vite UI가 로드되지 않음 2. 데이터, 함수 그리고 Custom Hooks ① Redux, Action, Dispatch ② 함수를 작성할 때 고려해야 할 점 3가지 3. 금일 소감 1. Vite UI가 로드되지 않음 와 진짜 Vite 갑자기 로드가 안 되길래 정말 너무 조마조마했다. 이러면 공부 하나도 못 하는데 어쩌나 싶었다. 그리고 강의에서 나온 코드 그대로 작성했는데 안 되길래 대체 뭐가 문젠가 싶은 마음이었다. 에러 메시지라도 보고 싶은데 개발자도구를 사용하지 못 하니 정말..

728x90