[글또 x 유데미] 클린코드 자바스크립트 수강 후기

시작하며

이번에도 글또에서 마련해준 좋은 기회를 통해 정말 정말로 감사하게도 유데미(Udemy)에서 클린코드 자바스크립트(JavaScript) 강의를 무료로 수강하게 되었습니다. 항상 도움만 받고 있네요 글또 운영진분들 항상 고맙고 감사합니다.

평소에도 문제해결을 위해서 일회성으로 기술을 학습하고 사용했고 정작 기초적인 부분은 크게 신경을 쓰지 않고 있었던 상황이라 기본적인 부분에 대해서 많이 부족하다고 생각하였는데 이번 기회를 통해서 조금 더 보완을 할 수 있게 되었습니다.

추가적으로 이 강의를 전부 들으면서 느꼈던 부분에 대해서 짧게나마 이야기 해보려고 합니다.

클린 코드에 대한 고민

강의에 대한 첫 시작은 클린 코드에 대한 고민으로 부터 시작됩니다. 사실 저는 이 부분을 보고나서 클린 코드에 대한 고민도 맞지만 개발자가 가지고 가야할 기본적인 자세라고 생각하였습니다.

• 타인이 정의한 답을 의심한다.
• 배움에 열린 태도를 가집니다.
• 직접 생각하고 또 고민합니다.
• 클린 코드가 무엇인지를 자바스크립트를 통해 학습합니다.
• 흔히 알려진 자바스크립트 코드 스타일에 대한 견해를 탐구합니다.

여기서 처음 강사분이 이야기 해주신 타인에 대한 맹목적인 믿음을 가지면 안된다는 부분도 상당히 많은 공감을 느꼈습니다. 문제에 대한 해결 방법이 맞고 틀리다는 것의 유무와 크게 상관 없이 직접적으로 생각하지 않게 되는 문제가 생긴다는 이야기 였습니다. 이 이야기를 듣고 과거 올바른 사수란 무엇인가?에 대한 이야기를 했던 것이 떠올랐습니다.

결론 부터 이야기 하면 문제에 대한 정답을 알려주는 존재가 아닌 정답에 도달할 수 있게 끔 인도해주는 역할을 하는 것이 결론이였습니다.

벽 뒤에 해답을 바로 얻는 다면 그 사람은 다른 이의 도움 없이는 아무것도 하지 못할 것이다.

벽을 부숴야 하는 거라면 어떤 도구를 이용하여 벽을 부숴야 하는 것인지? 만약에 부수는 것이 아니라 벽을 넘어간다면 어떻게 넘어가야 하는 것인지에 대해서 조언해주면서 직접 벽의 반대편으로 갈 수 있게 해주는 역할을 해야 한다는 이야기였습니다.

조금 다른 길로 이야기를 많이 한 것 같네요 다시 강의에 대한 이야기로 돌아가 보도록 하겠습니다.

클린 코드 수강 후기

클린코드 자바스크립트 강의는 10시간이라는 시간 동안 기초적인 문법부터 시작하여 여러가지 문법들을 학습하면서 강사 분의 경험과 지식을 기반으로 어떤 식으로 코드를 작성하면 좋을 지에 대해서 설명합니다. 사실 저는 평소에도 엄청나게 자주 쓰이는 함수나 조건으로 인한 분기에 대해서는 깊이 생각하지 않고 사용하고 있었는데 강의를 들으면서 한 번씩 다시 생각해 볼 수 있었습니다.

부끄러운 이야기지만 평소에도 당연하듯이 사용하고 어떤 기능인지는 알지만 실제로 이름을 몰랐던 연산자나 기능들에 대해서 이름을 알 수 있어서 좋았습니다. 저는 평소에 물음표 두개 연산자라고 부르는데 널 병합 연산자(Nullish coalescing operator)라고 이름이 있었습니다. 물론 물음표 두개 연산자라고 구글에 쳐도 관련해서 설명도 나오고 그렇게도 의외로 많이 쓰이는 것 같지만 사소하게 모르는 공백을 채워주는 느낌 이였습니다.

연산자의 기능인 왼쪽 피연산자가 null이나 undefined이면 오른쪽 피연산자를 반환하고 그렇지 않으면 왼쪽 피연산자를 반환해 준다고 기능에 대해서도 명확하게 이해한 상태인데 참 아이러니하네요

// Nullish coalescing operator
const a = 5;
const b = null;
console.log(a ?? 10); // 5
console.log(b ?? 10); // 10

강의 끝에서 나오는 스타일 가이드에 대한 부분도 상당히 마음에 들었습니다.

네이밍 컨벤션을 포함하는 규칙을 위한 가이드라인으로 하나의 팀 혹은 집단을 위해 존재 즉 협업에 큰 도움을 주기 위함

• 서로를 이해하기 위한 시간 절약
• 코드 품질
• 일관성
• 가독성 향상
• 유지보수 용이성

잠깐 동안 standardjs에서 자바스크립트 표준 스타일에 대해서 이야기 해주시는데 개인적으로 조금 더 둘러보니 기존에는 eslint나 prettier를 통해 자동으로 수정되거나 경고를 확인하고 수정하는 경우가 많았는데 기존에 모르고 넘어갔던 부분까지 이번 기회로 재학습 할 수 있어서 좋았습니다.

평소에 개발을 할 때는 감각적으로 개발하여 일단 요구사항에 맞추는 걸 우선시하는 개발 스타일을 가지고 있는데 강의를 들으면서 여러 생각을 많이가져 볼 수 있어서 좋았습니다.

기억에 남는 키워드

Early Return에 대해서 이야기 할 떄는 과거에 처음 중첩 조건문 형태로 많이 작성하던 때의 기억이 생각나더라구요. 보통 아래의 수정 전의 중첩 조건문의 형태를 많이 썼던 기억이 있는데 회사에서 작업하시는 다른 분의 소스를 보고 깨달았 던 기억이 있습니다. 사실 부끄럽게도 Early Return 이름에 대해서는 처음 알았습니다.

// before
function loginService(isLogin, user) {
    if (!isLogin) {
        if (checkToken()) {
            if (!user.nickName) {
                return registerUser(user);
            } else {
                refreshToken();
                
                return '로그인 성공';
            }
        } else {
            throw new Error('No Token');
        }
      
    }
}

// after
function login() {
    refreshToken();
    
    return '로그인 성공';
}

function loginService(isLogin, user) {
    if (isLogin) {
        return
    }
    
    if (!checkToken()) {
        throw new Error('No Token');
    }
    
    if (!user.nickName) {
        return registerUser(user);
    }
}

이런 식으로 들여쓰기를 줄여서 조금 더 간결하고 코드를 읽기 쉽게 만들 수 있으며 그냥 return 시키는 유효하지 않은 부분을 제외하고 보게 끔 하여 실제 수행되는 결과에 집중할 수 있는 장점을 가지고 있습니다.

물론 엄청나게 코드가 늘어나는 경우에는 반대로 방대한 양의 return으로 코드를 이해하기 어렵게 만들며 가독성을 떨어뜨리기도 하지만 말입니다

그 외에도 객체에 직접적인 접근을 지양해야 한다던가 콜백함수의 위임 등 중요하지만 놓치고 가는 부분에 대한 이야기도 있으나 글에 전부 담기는 수강후기가 아니라 강의를 그대로 옮겨오는 것이 될 것 같아 자세한 내용은 관심이 있으신 분들은 강의를 들어보시는 것을 추천드립니다.

강의 추천 대상

• 이제 JavaScript 기초 문법이 익숙해진 예비 개발자
• 클린 코드에 관심이 많은 주니어 프론트엔드 개발자
• JavaScript의 코드 스타일이 궁금한 주니어 프론트엔드 개발자

유데미 쪽에서 나와 있듯이 이 강의는 예비 개발자나 주니어 개발자분 들이나 아니면 저같이 기본적인 부분이 부족하다고 생각하는 사람들에게는 상당히 좋은 강의라고는 생각하지만 솔직하게 이미 문법이 익숙한 개발자 분들에게는 10시간 이라는 시간을 투자하면서 까지 들을 정도는 아니라고 생각합니다.

끝마치며

강의를 들은지는 어느 정도 시간이 지났지만 숙제를 항상 미루는 타입이라 이제서야 글을 작성하게 되었습니다.

글을 쓰기 위해 강의를 들었을 때의 정보를 희미해진 기억속에서 찾느라 힘들었네요. 기억이 나지 않았던 내용 들은 강의를 다시 시청하면서 채웠습니다 덕분에 복습하는 기회를 마련하게 되었네요.

좋은 기회 마련해준 글또 관계자분들 그리고 좋은 강의를 제공해주신 유데미에게 감사의 인사를 전달드립니다.

이 글은 유데미에서 무료로 강의를 지원 받아 작성하게 되었습니다