Topic
Algorithm
Two sum(Hash table)
Data structure
Abstract data type in javascript
Stack
Queue
Linked list
Set
Hash table
Tree
Trie
What I Learned
[LeetCode] 1. Two Sum
자바스크립트로 추상 자료형 구현하기
Codeit Bootcamp Mentoring
Q. React-vite 프로젝트에서 main.jsx에 상태 관리/라우터 등 프로바이더 컴포넌트를 전부 넣으면 Provider에 전달할 prop 이 있을때 문제가 생기나요?
A. 개발 초반에는 Provider를 넣을 때 전달해줄 prop이 없는데, prop의 옵션들을 사용하게 되는 순간이 오면 문제가 생길 수 있다. Main.jsx는 컴포넌트가 아닌 루트 컴포넌트를 돔에 넣어주기 위한 파일이고, 그 안에 useState라던지 상태 관리 라던지 아니면 따로 커스텀을 만든 훅을 넣을 수가 없기 때문에 App.jsx에 프로바이더 컴포넌트들을 옮길 때가 올 수 있다. Main.jsx를 그냥 DOM에 root element만 생성하는 곳으로 사용하는 경우가 많다.
Q. CRUD 기능은 서버가 있어야만 구현할 수 있나요?
A. 용량이 많이 필요한 유저 기능같은 것을 사용하지 않는, 클라이언트에서만 존재할 수 있는 프로그램이라면 브라우저에서 CRUD를 할 수 있는 프레임워크가있다 (LocalStorage, Web API(Indexed DB) 등) wordle이라는 워드게임 웹 사이트를 참고하면 브라우저에서 CRUD를 구현한 프랙티스를 볼 수 있다.
Q. 현업에서 웹 어플리케이션을 만들 때 보통 CRA나 Vite create로 만들지 않고 설정들을 직접 코딩해서 개발을 시작하나요?
A. Bootstraping 해서 enterprise 제품을 만들기도 하고, React로 하는 회사도 있다. 단, 직접 세팅하는 경우 개발 생산성은 매우 떨어진다. 세팅을 하는 동안 개발 환경이 사라지는 것이고, 개발 환경을 깨지않는 목적으로 일단 잘 만들어진 프리셋에 의존하는 것도 좋은 전략이다. 이럴 경우 webpack에 대한 지식이 부족해질 수 있는데, 사이드 프로젝트같은 것으로 webpack 공부는 따로 하는 것도 좋다.
Q. 아래처럼 세 가지 방법으로 정의된 함수들을 호출이 아닌 값으로서 전달할 때 어떤 차이점이 있을까요?
function returnMessage() {
return "worked";
}
var returnMessage2 = () => "worked";
var returnMessage3 = function () {
return "worked";
};
console.log(returnMessage); // f returnMessage() {return "worked"};
console.log(returnMessage2); // () => "worked"
console.log(returnMessage3); // f () { return "worked"l }
A. 답변 보류
Feedback
- 알고리즘 첫 문제 풀이를 해봤는데, 해결하고 분석하는 과정이 재밌었다.
- 많은 알고리즘 문제를 풀어보고 싶은데 시간 여유가 많지 않아서 아쉽다.
- 많은 시간을 알고리즘에 할애하는 것이 좋아보이는데, 시간 배분을 어떻게 해야할지 감이 잘 안온다.
- Python으로 구현했던 추상 자료형들을 JavaScript로 옮겨봤다.
- Graph, BFS, DFS도 JavaScript로 구현해야한다.
- Top-down과 Bottom-up 방식을 병행하고 있다.
- 숙지해야할 내용이 많지 않거나, React처럼 중요도가 높은 주제는 Top-down 방법으로 공부하는 것이 괜찮은 것 같다.
- Network, JavaScript처럼 내용이 너무 방대한 경우 bottom-up 방식으로, 그러나 필요한 부분은 확실하게 알고 넘어가는 것이 괜찮은 것 같다.
- 방대한 정보 속에서 지금까지 배운 지식은 빙산의 일각조차 되지 않는다는 것을 매일 깨닫는다.
