Yongveloper / wanted-pre-challenge-fe

Geek Repo:Geek Repo

Github PK Tool:Github PK Tool

클린 코드 프론트엔드 | 프리온보딩 FE 챌린지 11월 (2023)

https://www.wanted.co.kr/events/pre_challenge_fe_15

과제를 제출하고 싶다면 결과물을 Gist Comment에 남겨주세요 (Link로 대체 가능)

챌린지 과제

Q1. 내가 생각하는 클린 코드란?

가독성이 좋고 주석이 없어도 변수명, 함수명 등만 봐도 어느 기능을 하는지 단 번에 알 수 있는 코드

Q2. 내가 생각하는 (프론트엔드에서의) 클린 코드란?

재사용 성이 좋고 유지보수가 쉽게 설계된 코드. 즉, 이 말은 가독성과 하나의 함수에서 하나의 기능 (명확한 기능)을 하는 함수.

Q3. 내가 클린코드보다 중요하게 생각하는 것은?

1인 개발을 제외하면 어디든 팀 단위로 진행이 되기 때문에 사람들과 의사소통을 원할히 할 수 있는 협업 능력을 중요하게 생각합니다.

Q4. 다음 중 선호하는 방식과 그 이유는?

1.

Tab vs Space
Tap과 Space 중 선호하는 경우는 상황에 따라 다르게 생각합니다.
먼저 들여쓰기를 하는 경우에는 Tab을 선호합니다.
이유는 들여쓰기시 Spacing을 하면 코드가 길어질 수록 정확히 몇 번 Spacing 한 지 알 수 없고 일정하지 않을 수 있다고 생각합니다.
Spacing을 선호하는 상황은 예를 들어서 변수를 정의할 때나, 함수를 정의할 때 선호합니다.
변수나 함수를 정의하는 상황에서 Tab을 사용하게 되면 불 필요하게 많은 공백을 차지하기 때문에 가독성이 좋지 않게 생각되고 space로 약간의 공백만 주는 것이 가독성에 좋다고 생각합니다.

2.

세미콜론 O vs 세미콜론 X
자바스크립트는 세미콜론이 없어도 동작이 되는 유연한 언어입니다.
하지만 세미콜론이 없으면 코드가 어디가 마지막인지, 어디서 끝나는 코드인지 쉽게 알 수 없기 때문에
세미콜론을 명시하여 코드의 마지막을 알려주는 것이 좋다고 생각합니다.

3.

count++; vs count += 1; vs count = count + 1;
나머지 두 방식에 비해 간결하고 명료하다고 생각하기 때문에 개발을 하면서 선호하는 방식은 count++; 방식 입니다.
하지만 제일 중요한 방법은 따로 없고 일관성는 방식의 코드를 작성해야 하는 부분을 중요하게 생각합니다.

4.

if (isLogin) {} vs if (isLogin === true) {}
저는 전자의 방식을 선호합니다. 이유는 is ~ 라는 변수를 짓는 관행이 Boolean 값을 나타낼 때 많이 사용되기 때문에 true & false 라는 것을 알 수 있습니다.
때문에 전자의 방식으로 더 깔끔한 코드를 작성할 수 있다고 생각합니다.

5.

isLogin && <HelloWanted /> vs isLogin ? <HelloWanted /> : <></> vs isLogin ? <HelloWanted /> : null vs isLogin ? <HelloWanted /> : undfined
저는 첫번째 방식을 선호합니다.
위에서 말했듯이 코드는 가독성이 좋은 코드가 클린 코드라고 생각합니다.
즉, 첫번째 방식을 보면 isLogin이 true면 를 return 하라는 코드라고 바로 이해할 수 있습니다.
나머지 방식은 3항 연산자를 사용했지만 Login일때 만 표시하면 되기 때문에 첫번째 방식이 개인적으로 선호됩니다.

About