원티드 프리온보딩 프론트엔드 챌린지 1월! 사전과제!

원티드 프리온보딩 프론트엔드 챌린지에 지원하게 되었다!

지원하게 된 이유는 이 과정에서 배우는 내용들이 앞으로 프론트엔드 개발에 무척이나 필요할 것이라고 생각이 들었기 때문이다.

포트폴리오 작성을 위한 리액트 프로젝트 고도화 | 프리온보딩 FE 챌린지 1월 | 원티드

 

챌린지는 총 4번의 수업과 4개의 커리큘럼으로 진행된다.

리액트에서 어떤 상황에서 어떻게 전역변수를 관리하는 방법

리팩토링 전 테스트코드를 작성해서 효율적으로 리팩토링하는 방법

코드를 최적화하여 렌더링 성능을 개선하는 방법

프로젝트를 고도화 할 때 어떤 부분을 중점적으로 검토해야 하는 방법

 

 

무척 와쿠와쿠하다.

 

 

효과적인 기술 역량 향상을 위해 사전과제를 진행한다.

 

구글 폼으로 제출을 하는 방식인데 주제가 굉장히 흥미로웠다.

총 5가지의 질문이 있었다. 

1. 전역변수를 사용하면 어떤 장점이 있는가?
2. e2e테스트는 무엇인가?
3. 테스트에서 ‘mocking’이란 무엇인가?
4. Web Vitals란?
5. 리팩토링 경험이 있다면 무엇을 어떻게 리팩토링 했는지 작성하라.

 

얼핏 '그래.. 이거지.. 어?..' 하는 느낌으로 검색을 하며 작성을 해보았다.

잘못 알고 있었네 ㅋㅋ..

 

1. 전역변수를 사용하면 어떤 장점이 있는가? 

전역변수를 사용하면 어느 곳에서든지 변수에 접근하고 수정할 수 있다. 이는 코드의 유연성을 증가시킨다. 그로인해 코드 간략화와 데이터 공유의 장점이 있지만, 어디서든 수정이 가능하기 때문에 예상치 못한 사이드 이팩트를 발생시킬 수 있다. 그렇지만 전역 상태 관리 도구인 Context API나 Redux와 같은 도구들은 굉장히 큰 도움을 준다.

 

2. e2e테스트는 무엇인가?

사용자가 시스템을 사용하는 것과 같은 방식으로 전체 시스템을 테스트하는 방법이다. 이 테스트는 사용자의 관점에서 수행되며, 주로 사용자 인터페이스를 통해 수행된다. 하지만 설정과 유지 관리가 복잡하고, 실행 시간이 오래 걸린다. 따라서 테스트 전략의 일부로 사용되고, 단위 테스트와 통합 테스트와 함께 사용하는 것이 일반적이다.

 

3. 테스트에서 ‘mocking’이란 무엇인가?

mocking이란 테스트를 수행하는 동안 실제 객체를 모의 객체로 대체하는 것을 의미한다. 이 모의 객체는 실제 객체와 동일한 방식으로 동작하지만, 테스트를 위해 예측 가능한 방식으로 동작하도록 설정된다. 장점으로는 의존성 제거가되고 테스트 속도를 향상시키고 예상치 못한 상황을 언제든 재현해낼 수 있다. 따라서, Mocking은 테스트의 격리, 속도 향상, 예외 상황 테스트 등을 위해 필수적으로 사용되는 기법이다.

 

4. Web Vitals란?

Google이 제안한 웹사이트 성능을 측정하는데 중요한 핵심 지표들을 말한다. 이 지표들은 사용자의 경험을 중심으로 하며, 웹사이트의 로딩 시간, 상호작용성, 그리고 시각적 안정성등을 측정한다. Web Vitals는 웹사이트 개발자와 소유자들이 사용자 경험을 개선하고, 웹사이트 성능을 최적화하는데 도움이 되는 중요한 도구이다.

 

5. 리팩토링 경험

프로젝트를 전체를 한 번에 리팩토링한 경험은 아니지만, 코드의 가독성이 떨어지는 시점에 custom hook을 활용하여 코드를 리팩토링하였고, 이를 통해 재사용 가능한 함수로 로직을 세분화하였다. 이 과정을 통해, 로직의 재사용성을 높이고, 컴포넌트의 복잡성을 줄일 수 잇었다. 이는 리액트의 핵심 원칙인 선언형 프로그래밍에 부합하는 접근을 하였고, 선언형 프로그래밍은 코드의 명료성과 예측 가능성을 향상시켰다.

 

 

기대

1월 시작부터 무한 성장을 하고 옳바른 방향성을 잡고 나아간다는 점이고 이걸 기점으로 무한 성장을 할 생각에 설렌다! 공부 열나게 해야지