본문 바로가기

공부기록

[공부기록/javascript] codewars로 연습문제 풀기

  요즘은 모던 자바스크립트 튜토리얼로 개념을 공부하면서 매일 공부한 내용을 git에 올리고 있다. 
(공부 기록용으로 블로그와 git 중 고민하다가 좀 더 나에게 익숙하고 편한 방법을 택했다)

  위 사이트에는 개념, 이론은 물론 간단한(??? 때때로 간단하지 않은) 예제도 많이 있어서 예제를 풀며 개념을 더 확실하게 이해할 수 있다는 점이 좋다. 그런데 배열과 메소드 파트 같은 경우, 배열 변형부터 정렬 등 메소드가 너무나도 많다 보니 해당 사이트에 나와있는 예제(이 사이트에도 충분히 많이 있지만!)만으로는 부족하다는 생각이 들었다. 물론 프로젝트를 실제로 진행하면서 익히는 것이 제.일. 좋겠지만, 뭔가 더 이 개념들을 머리로만 아는 게 아니라 어떻게 활용해서 코드를 짤 수 있는지, 다양한 문제를 풀면서 익숙해지고 싶은 마음에 방법을 찾다가 Codewars라는 좋은 사이트를 알게 되었다! 

 

codewars 로그인 화면

 백준이나 프로그래머스 등 유명한 사이트들도 많았지만, 나는 코린이 중에서도 코린이고(ㅠㅠ) 알고리즘 문제 중에서도 아주 아주 아주 아주 기초적인 부분을 연습하고 싶었기 때문에 arrayobject에 관련된 간단한 문제를 해결해보고 코드를 짜볼 수 있는 사이트를 원했는데, 그런 점에서 이 사이트가 나에겐 최적의 사이트!라고 생각되었다. 

 

1. 첫인상
 깃과 연동해서 회원가입하는 과정에서 코드의 잘못된 부분을 고치는 간단한 테스트가 있었는데, 일단 이 부분이 너무 흥미로웠다. 알고 보니 그것도 여러 단계의 다양한 문제들 중 하나(아주 기초적인 문제!)였는데,  그럼에도 뭔가 '내가 해냈다', '입단 테스트를 통과했다'라는 뿌듯함을 느낄 수 있었다.

2. 탐색
 어디에서 내가 원하는 유형을 찾을 수 있을지 둘러보는데 katakyu 등 생소한 용어들이 보였다.

 

kata 페이지에서 원하는 언어, 난이도의 문제를 찾을 수 있다.

용어 자체는 낯설었지만 워낙 뜻하는 바가 명확히 보였기 때문에 선택하는 데 어려움은 없었다. 

( kata : 문제 / kyu : 단계 or 난이도. 사실 처음에는 1kyu가 1단계, 즉 난이도 하(下)라고 생각했는데 반대였다. 8kyu에서 1kyu로 난이도가 높아짐을 의미했다. )


 원하는 언어나 단계 등을 선택하면 적합한 문제들이 나오는데, 나는 javascript(밖에 모르니)와 최하위 8kyu를 택한 후 array를 검색했다. 조건에 적합한 다양한 문제 목록 중에서 가장 눈에 띄는 "Sort and Star"를 첫 문제로 선택했다!

 

3. 첫 문제! 두근두근

 첫 문제는 문자열로 이루어진 배열을 알파벳 순으로 정렬하고, 첫 번째 값을 글자 사이사이에 "***"이 들어간 문자열로 반환하는 것. 

 

instructions에 따라 알맞은 코드를 우측 solution에 작성하면 된다. / TEST를 할 때마다 OUTPUT 창에 결과가 Passed 혹은 Failed로 나온다 

 나름대로 배운 메소드를 활용해서 몇 차례 시행착오 끝에 solution을 작성한 후(코드는 아래에!) TEST를 해봤다. 그리고 찾아온 감격적인 순간ㅠ_ㅠ 이 순간이 너무 뿌듯했기 때문에 기록으로 꼭 남기고 싶었다. 사실 코드는 엉망진창이지만 어쨌든 뭔가 해냈다는 느낌이 지금의 나에게 너무 긍정적인 자극이 된 것 같다. 

 

감격적인 첫 PASS의 순간!

테스트를 해본 후 ATTEMPT를 누르면 기본테스트 뿐 아니라 랜덤으로 인수를 전달하는 랜덤 테스트까지 진행해서 확실하게 코드가 잘 돌아가는지를 확인해준다.

 

4. 통과, 그 후

여기까지 통과하면 다른 사람들의 solution을 볼 수 있는 페이지가 나오는데, 개인적으로 이 부분이 정말 좋은 것 같다! 

 

best solution

Compare with your solution을 누르면 내 코드와 비교해서 볼 수도 있다. 아래쪽이 내 코드(당연함). 정말 확연한 차이...!!!!! 

my solution을 best solution이랑 비교해서 볼 수 있다 (차이가 어마어마..)

 

5. 후기 

 직전에 PASSED를 받고 감격했던 것이 무색하게 위의 간결한 코드를 보고는 한참 멍 때렸던 것 같다. 내 나름대로 어떤 메소드가 필요한지 생각하고, 배운 내용을 참고해 한 줄 한 줄 콘솔 창에도 쳐보면서 코드를 작성했지만, 그건 그거고. 그보다 더 효율적인 방법으로 쓸 수 있다는 것, 그리고 얼마든지 다양한 방법으로(best solution 아래로도 정말 다양한 solution들이 있다) 해결할 수 있다는 것을 알 수 있어서 정말 좋았다.    

 무엇보다 머리로는 알았지만 손에 익지는 않았던 개념(메소드, 화살표 함수 등)들이 실제로 이런 상황에 저런 식으로 적용될 수 있음을 직접 볼 수 있기 때문에 배울 게 참 많은 것 같다.

 이후로도 여러가지 문제를 푸는 중이고, 지금은 rank up! 해서 7kyu! 사실 레벨에 욕심은 없지만 차근차근할 수 있는 만큼 필요한 만큼, 열심히 꾸준히 해봐야겠다:D 구구절절 첫 공부 기록 스토리 끝.