목적
하나. 씨에스
2. 백엔드 로드맵 순으로 공부
3. Notion에 정리된 모든 컨텐츠를 반복해서 보기
4. 데이터 구조 및 알고리즘
5. 노트에 정리된 내용을 블로그에 업로드
결과
1. ‘면접 CS전공 지식노트’ / ‘노션’에 요약된 내용을 반복한다.
* 프로그래밍과 프로그래밍 이론은 별개의 개념이 아닙니다. 둘 중 하나를 잘한다고 프로그래밍할 수는 없습니다. 둘 다 괜찮을 것입니다. 이론이 아닌 코드 작성에 먼저 들어와서 바로 받았는데 금방 사라지는 느낌이었습니다. 그런데 이론 공부를 같이 하다 보니 변동성이 줄어드는 걸 느꼈어요. 결국 함께 공부하는 것이지 공부를 우선시하거나 미루는 것이 아니다.
2-1 학습 언어 -> Node.JS
-처음 JS를 공부할 때 프로그래밍을 배우고 바로 구현하는 것에 집중했는데, 그게 잘못됐다고 느꼈다. JS의 기본 속성을 모르고 공부했기 때문에 바로 코드를 작성하고 어떤 기능이든 구현할 수 있었지만 JS를 본질적으로 이해하지 못해서 JS 논리 작성 수준에 도달하기 전까지는 그것이 잘못되었다는 것을 깨닫지 못했습니다. 왔다. 그래서 저는 Node.js를 공부할 때 다른 접근 방식을 시도합니다.
-드디어 배포가 완료되었습니다. 프런트엔드는 Netlify에서, 서버는 Heroku에서 제공했습니다. Heroku는 무료 호스팅을 제공했지만 지금은 유료이지만 가장 작은 요금제를 지불하고 배포를 진행했습니다. 상황을 모니터링하고 나중에 변경하겠습니다.
=> 처음에는 auth 관련 오류가 발생했는데 해결 후 cors 관련 오류가 발생했습니다. 며칠 동안 앉아서 해결하려고 했지만, 잠시 다른 일에 집중하고 조금 쉬었다가 천천히 해결했습니다. 당장 해결할 수 없다고 생각되면 잠시 멈추고 생각을 정리한 다음 디버그하는 것이 좋다.
그 결과 호스팅 사이트에서 설정한 환경설정 변수의 내용과 서버에서 .env 파일로 작성한 환경설정 변수의 내용이 일치하지 않아 오류가 발생했습니다. 다른 호스팅 사이트를 사용하려고 하다가 우연히 이 작업을 해야 한다는 것을 알게 되었고 즉시 적용했고 작동했습니다. 이제 천천히 하나씩 다시 만들어서 완전히 내 것으로 만들어야 한다.
클라이언트 코드는 제가 작성한 것이 아니므로 대단히 죄송합니다. 서버 구축 방법에 대한 전체 그림이 그려져 있지만 클라이언트 측 코드는 명확하지 않습니다. 리액트를 당장 공부하는 것은 비효율적일 것 같아서 먼저 서버와 통신하는 방법부터 알아보겠습니다.
– 프로젝트를 처음부터 빌드
=> 유효성 검사를 위해 유효성 검사기 모듈을 사용하고 있습니다. 방법 자체는 사용하기 어렵지 않았는데 put 요청이 왔을 때 최소 3자 이상을 요구하는 validation을 적용하려고 하는데 잘 안되네요. 이미 완성된 프로젝트를 확인해보니 일이 잘 풀리지 않는 것을 확인했다. 나는 내일 이 문제를 해결하려고 노력할 것이다.
그리고 import 할 때 { } 를 사용하는 것과 사용하지 않는 것의 차이가 궁금해서 찾아봤습니다. 결국 default와 named의 차이입니다. 별도의 블로그 게시물에서 이를 명확히 하려고 합니다.
-Node.js 지금 듣고 있는 강의보다 좀 더 기초적인 내용을 설명하는 강의를 듣고 있습니다.
=> 진행 중입니다. 예전에는 주로 서버 입장에서 코드를 작성하는 방법을 배워서 프론트엔드 코드를 잘 이해하지 못했는데 이번 강의를 통해 차차 이해하고 있습니다.
– 천천히 해보겠지만 주식이나 암호화폐와 관련된 간단한 웹사이트를 만들어보려고 합니다. 오픈 API로 하겠지만, chatgpt로 간단한 스켈레톤을 생성한 후 수정하면서 하도록 하겠습니다.
2-2 JS를 위한 보완 연구 및 프로젝트
– 웹사이트 프로젝트를 수정하는 중입니다. 공부하면 할수록 더 많이 보입니다. 특히 동기와 비동기의 개념은 프로젝트를 만들 당시에는 빠져있었는데 알고 나니 빠진 부분이 보여서 다시 작업했습니다.
=> 리팩토링을 완료하고 검토할 내용만 따로 정리했습니다. 리팩토링은 좀 더 깔끔하고 효율적으로 할 수 있을 것 같지만, 다른 것들을 공부하면서 천천히 가도록 합시다.
-포트폴리오 웹사이트를 만들고 있습니다. 지금까지 만든 코드를 사용하여 처음부터 직접 해볼 생각입니다. 최대한 깔끔하게 정리할 생각이고, 다른 분들의 페이지도 링크해서 할 예정입니다.
=> 완료. 유저인터페이스 측면에서 조금 더 완성도 높은 웹사이트를 만들어볼까 생각하다가 직접 만들어보는 것도 공부에 도움이 될 것 같아서 이 방법을 택하게 되었습니다.
-JS 보충 및 고급 강의가 완료되었습니다. 이제 경험을 쌓고 실제로 사용하여 검증하는 것이 중요합니다.
=> 코딩 테스트 솔루션을 통해 Web API와 다양한 기능을 사용하면서 잘 배우고 있습니다. Promise, Acync Await, Classes 같은 경우는 사용하기에 적합하지 않아서 잘 사용하지 못해서 계속 읽어야 익숙해집니다. 앞으로 JS로 프로젝트를 만들게 된다면 위의 기능들을 최대한 활용해서 익숙해지셔야 합니다. 가능하면 웹사이트 프로젝트에서 리팩토링 할 때 사용하면 좋을 것 같습니다.
-AJAX도 결과적으로 브라우저에서 사용하는 기능이고 JS와 관련된 기능이라 공부할 생각입니다.
=> 조금씩 듣고 있어요. AJAX는 웹 페이지의 일부만 변경하는 도구입니다. 일부만 변경하기 위해 전체를 다시 다운로드하거나 다시 로드하는 것은 리소스 낭비입니다.
– 정규표현식을 공부하고 있습니다. 코딩 테스트 문제를 풀다가 특정 문자열을 찾는데 문제가 있었습니다.
=> 실제로 많이 사용하려고 합니다. 기존 코딩 테스트 문제를 풀 때 정규식으로 작성해서 풀 수 있는 문제를 풀면서 최대한 익숙해지려고 노력한다.
2-3 자식과 터미널
Git 기초 강의는 다 들었다. 사실 많이 써봐야 알겠지만 자주 사용하는 기능 외에는 안 쓸 것 같으니 꾸준하게 사용하면서 최대한 익숙해지도록 노력해야 할 것 같아요~
– 터미널에 대한 간단한 강의가 있지만 사용하기 위해서는 개념을 넘어 자세히 공부해야 하므로 이것들을 조금씩 공부해야 합니다.
=> 강의는 다 들었지만 꾸준하게 반복하고 실제로 많이 사용하면서 익숙해져야 합니다.
=> 그리고 터미널 명령에 익숙해져야 합니다. 핵심 명령어는 따로 찾아서 공부하자.
3. 매일 Node.js 보기 / 나머지는 살펴보기
– 전체 npm 검사, vscode 디버거, 파일 정리 스크립트 생성
-JS에서 수업 내용과 신문 방식 검토 완료
– 코딩 테스트 완료 내용 확인
4-1 유튜브 영상 용어로 요약된 내용을 반복해서 시청
4-2 관련 서적 읽기
-이미지 학습 알고리즘
=> 책을 다 읽고 나서 다시 읽고 여러 번 넘기면서 어떤 부분을 읽어야 하는지 확인했다. 여러 번 읽고 나니 이제 확실히 어느 정도 이해가 되었고 좋은 코드를 작성하는 유일한 방법은 프로그래밍할 때 이러한 부분에 주의를 기울이는 것이라고 생각합니다.
나는 앞으로 여러 번 돌아올 것이다 아주 기초적인 정보를 담고 있는 책입니다. 더 자세한 예제가 있는 책을 사서 읽어야 합니다.
– 면접을 위한 CS전공지식노트
=> 처음에는 무슨 뜻인지 잘 몰랐는데 지금은 어느 정도 이해하고 익숙해졌습니다. 누군가 이 책을 어떻게 읽느냐고 묻는다면 프로그래밍 스킬을 공부하면서 함께 읽는 것을 추천하고 MVC, DB, 데이터 구조 부분을 바로 읽는 것은 추천하지 않는다고 말하고 싶다. 그리고 데이터 구조와 알고리즘은 처음부터 열심히 배우려고 하기보다는 쉽게 배울 수 있는 방법을 찾은 후에 이 책의 데이터 구조 부분을 읽을 때 더 도움이 된다고 생각합니다.
– 작업 중인 프로젝트 이후 데이터 구조와 알고리즘을 조금 더 탐색할 계획입니다. 코딩 시험을 볼 때 자연스럽게 학습 곡선이 될 것이라고 생각했지만 약간의 간격이 있다고 느꼈고 개념을 명확하게 공부해야 한다고 결정했습니다.
=> 이 부분은 유튜브가 아닌 다른 책을 사서 공부합니다. JS를 기반으로 설명하고 예제를 제공하는 책을 구입할 계획입니다.
4-3 코딩 테스트 문제 해결
-프로그래밍 기초부터 하루에 3~4문제씩 풀고 있습니다. 처음에는 쉬웠지만 기본적으로는 상당히 어렵게 느껴지는 문제들이 나타나기 시작했습니다. 코딩 테스트를 준비하는 것 말고도 그런 문제들을 풀면서 직접 로직을 만들어가는 과정이 의미가 있다고 생각합니다.
-프로그래밍 레벨 0을 거의 완료했습니다. 0단계인데도 거꾸로 가면 1단계보다 어려운 문제들이 있으니 그 문제들을 확인하고 넘어가도록 하겠습니다.
현재 1단계 문제를 풀고 있습니다. 사실 0레벨과 큰 차이는 없는 것 같습니다. 중간에 어려운 난관들이 있는데 해결 자체의 난해성보다는 효율성의 문제로 막혀 있다. 이제 제대로 알고리즘과 친해질 때가 된 것 같습니다.
– 문제를 풀었으니 이제 알고리즘 공부를 해야 할 때인 것 같다. 또한 정규식에 대해 배우는 것도 좋을 것입니다.
=> 정규표현식을 공부하고 조금씩 써보고 있습니다.
=> 알고리즘과 데이터 구조를 배우고 코딩 테스트에 직접 적용하는 강의를 찾아서 듣습니다.
– 코딩테스트 0단계 문제 풀이는 제 블로그에 올립니다. 계속해서 쉬운 문제부터 먼저 업로드하도록 하겠습니다.
* 앱을 통해 자주 시청하고 자주 시청하면서 익숙해지세요
5. JS 관련 기사 업로드
– 언어나 컴퓨터 공학 등 기술을 공부하다 보면 개념으로 정리된 것들이 많다. 매일매일 다시 보면서 스스로 되새기며 부족한 부분이 있으면 수정하고 있습니다. 매일 반복해서 보다가 익숙해지고 잘 배우다 보니 잘못된 정보를 덜 받는 경우가 많다는 것을 알게 되었습니다.
이 부분은 저에게만 보이는 부분이라 크게 신경쓰지 않을 것 같아서 블로그에 하나씩 올려 최대한 많은 정보를 얻어보도록 하겠습니다.
그리고 그것을 누군가에게 설명할 수 있어야만 완전히 이해한 것으로 간주됩니다. 블로그에 글을 올리면서 이 부분은 연습이 될 것 같습니다.
6. CS 등에서 콘텐츠 업로드
-DOM을 통해 게시물을 업로드했습니다.
홀드 앤 홀드
영어를 배우다
-회화 부분을 포함하여 프로그래밍에 적합한 영어를 배워야 하지만 많이 읽어야 합니다. 지금 당장은 읽기 학습에 집중하고 대화를 덜 강조하면서 계속 복용해야 합니다.
(다행히 나는 지금까지 영어를 꽤 많이 말했고 시험을 위한 영어가 아니기 때문에 실력 향상이 더 쉬울 것이다.)
추가 언어 학습
-프론트엔드 코드까지 다루기 위해서는 React with JS를 배워야 합니다. 내가 프로젝트를 만들 때 React를 몰라서 이해하지 못하는 것이 많았다. React가 아니더라도 서버와 통신하기 위해 Front-end 측에서 코드를 작성하는 방법을 이해하고 직접 작성하는 방법을 알아야 합니다.
**다음 내용은 제가 처음 홈페이지를 만들 때 느꼈던 내용인데, 매일매일 상기하고 싶어서 여기에 올립니다.
할일 목록을 완성했습니다. 어제 하루종일 막힘에 시달렸고 오늘은 거의 하루종일 해결이 안되서 6시간 이상 앉아서 계속 구글링하고 교체했습니다. 그리고 마침내 해결되었습니다. 필터 기능을 어떻게 사용하는지 조금 헷갈려서 그 부분에 대한 참고사항만 참고했습니다.
=> 개발 공부를 하면서 내가 정말 잘할 수 있을까에 대해 많이 생각했다. 개발 자체가 재미있고 이론적인 부분은 공부하기 어려웠지만 조금씩 배워갈 때마다 성취감이 컸지만 그렇지 않다면 개발자로서의 삶에 자신이 있을 리가 없었다. 내 여생. 하지만 오늘 저는 확신합니다.
이 작은 기능을 스스로 해결해 나가는 과정과 그것을 해결하면서 느꼈던 성취감은 이루 말할 수 없이 크고 벅찼습니다. 총 10시간 동안 직접 해보고 구글링해서 문제를 푸는 것도 힘들었지만 그 시간 동안 포기하지 않고 집중할 수 있어서 자신감이 생겼습니다.
드디어 배포가 완료되었습니다. 프런트엔드는 Netlify에서, 서버는 Heroku에서 제공했습니다. Heroku는 무료 호스팅을 제공했지만 지금은 유료이지만 가장 작은 요금제를 지불하고 배포를 진행했습니다. 상황을 모니터링하고 나중에 변경하겠습니다.
하지만 완벽하지는 않았습니다. 로그인 시 인증 관련 오류가 있습니다. 이후에는 정상적으로 동작하지만 이 부분은 디버깅이 필요합니다. 개발자 도구의 네트워크 탭을 사용하여 오류가 발생하는 위치를 확인하고 코드에서 콘솔로 덤프하여 문제를 분리하려고 합니다.
=> 드디어 해결했습니다. 일주일 정도 해결책을 고민하고 찾고 이것저것 시도해본 것 같아요. 프로젝트를 진행하면서 작은 버그들이 계속 발생했는데 지금처럼 일주일 정도 수정이 안 되는 버그는 처음이었다. 처음 이틀 동안 개발자 도구의 콘솔과 네트워크 부분을 통해 오류가 발생한 위치를 확인했지만 아무리 코드를 봐도 오류가 발생한 위치를 알 수 없었습니다. 게다가 우체부에서 잘 작동하기 때문에 찾기가 더 어려웠습니다. 오류가 발생한 부분을 DB를 변경하여 해결해 보았으나 되지 않았습니다. 공식 문서를 보면서 여러가지 시도를 해보았지만 그것으로도 문제가 해결되지 않았습니다.
나는 조금 더 깊이 들여다보기로 했고 정말 하나하나 천천히 살펴보며 근본적인 문제에 대해 생각했다. 회원가입 후 바로 회원가입이 가능합니다. 현재는 제대로 작동하지 않는데 업데이트 후 로그인한 계정으로 로그인하면 문제는 이 시점에서 모든 것이 잘 작동한다는 것입니다. 그렇다면 로그인할 때 토큰이 제대로 제출되지 않았기 때문에 이 문제가 발생한 것 같습니다. 로그인 후. {}를 작성할 때 반환하지 않았기 때문에 이 문제가 발생했음을 발견했습니다. 리턴값이 없어서 리턴값으로 로그인을 해야 하는데 그게 안되고 리턴값이 없어도 구독자체가 작동해서 DB에 저장되고 업데이트 이후에도 잘 동작합니다.
너무 힘들고 힘들어서 글로 다 담을 수 없었지만, 해결하고 나니 너무 뿌듯했습니다. 예전에 JS로 웹사이트를 구축할 때 비슷한 경험을 했었는데 그때에 비하면 고민하는 시간이 훨씬 길어졌고 기쁨도 몇 배로 돌아온 것 같습니다.