전체 글

프로그래머스 데브코스

[MIL-2] 231027 ~ 231122 프론트엔드 데브코스 회고

🚀 들어가며 어느덧 프로그래머스 데브코스의 일원이 된지도 2달이 되었다. 첫 한달은 굉장히 시간이 더디게 간 느낌이었는데, 이번 달은 어떻게 시간이 갔는지 모를 정도로 순삭되었다. 아마 과제와 방학 때문이 아닐까 싶다. 지난 한 달은 노션 클로닝 프로젝트를 마친 이후 조금은 해이해져서 힘들었던 한 달이자, 방학 기간을 활용하여 부족한 부분을 채우고 이후의 리액트를 미리 예습하고 충분한 휴식을 취하면서 리프레쉬할 수 있었던 한 달이었다. 이번 MIL에서도 저번 MIL에서처럼 한 달간 얼마나 성장했는지 되짚어보려고 한다. ✅ 한 달 (10.27 ~ 11.22) 동안의 경험들 😧 한 달 전의 나 CSS의 정말 기초적인 속성 몇개만 알고 있었다. 클래스명을 네이밍하기 힘들었고, 통일성을 갖게 네이밍하기 힘들었다..

프로그래머스 데브코스

유튜브 클론코딩

유튜브 클론코딩 🚀 들어가며 이번 주차에는 CSS, SCSS 강의를 수강하고 네이버 모바일이나, 유튜브 메인페이지를 클론하는 과제가 주어졌다. 사실.. 시간이 엄청 촉박했다. 과제 기간은 화요일 ~ 금요일 총 4일이었으나 강의에서 float, flex, grid 등 CSS 심화된 내용을 다뤘고, 과제는 익숙치 않은 SCSS를 사용해야만 했어서 적응이 안됐다. 특히 CSS 심화된 내용을 강의를 들으며 이해하려니, 실제로 해볼 때는 어떻게 응용해야되나 막막했던 것 같다. (CSS가 오히려 자바스크립트보다 어렵구나.. 라고 느꼈다.) 더군다나 이번 주차에 타입스크립트 강의까지 있어서 너무 많은 것을 한 주에 몰아서 학습하려하니 굉장히 벅찼다. 그래도 CSS, SCSS, 타입스크립트 과제 직접 해보다 보면 '혈..

프로그래머스 데브코스

[VanillaJS] 이벤트 핸들러를 지연시키는 디바운스(debounce)

🚀 들어가며 프론트엔드 데브코스 진행 중 재미있는 것을 배웠다. '디바운스'라는 것인데, 나에겐 굉장히 참신했고 한 번 제대로 이해하면 앞으로 유용하게 활용할 것 같아 포스팅하기로 결심했다. ✅ 디바운스 (Debounce) 디바운스는 전자 공학에서 온 용어라고 한다. 예를 들어, TV 리모컨은 버튼을 누를 때 여러 번의 클릭 신호가 감지되는 것을 방지하기 위해 버튼 클릭의 저점과 고점 사이의 신호를 무시하는 디바운스 기법을 활용한다고 한다. 자바스크립트에서의 디바운스도 이와 같은 맥락이다. 자바스크립트에서 디바운스란, 짧은 간격으로 연속된 이벤트가 발생할 때 이벤트 핸들러가 과도하게 호출되어 성능의 저하가 발생하는 것을 방지하기 위해 일정 시간이 경과한 이후에 한 번만 이벤트 핸들러를 호출하는 것을 말한..

프로그래머스 데브코스

[MIL-1] 230919 ~ 231026 프론트엔드 데브코스 회고 / 첫 프로젝트, 모딥다 스터디, 백준 스터디, 커피챗

🚀 들어가며 데브코스를 시작한지도 어느덧 한 달이 지났다. 이전 직장에서 IT 솔루션 영업직으로 근무하면서 뒤늦게 개발자의 꿈을 키우게 되었고, 퇴사 이후 6개월 동안 메이저 부트캠프에 입과하는 것을 목표로 열심히 공부했다. 그 당시 나에게 '부트캠프'는 단순히 '프로그래밍을 배우는 곳'이 아니라 학습의 방향성을 알려주고, 협업 경험을 쌓을 수 있는 든든한 존재로 다가왔고, 노력 끝에 메이저 부트캠프 중 하나인 프로그래머스 데브코스 입과에 성공했다. 데브코스에서의 지난 한 달은 매일 벽을 마주하는 느낌이었다. 다른 사람들보다 부족한 점을 채우기 위해서 데브코스의 코어타임이 끝난 이후에도 매일 추가 공부를 했고, 중간에 추석 연휴와 주말도 즐기지 못하고 계속 공부했다. '내가 모르는 것이 이렇게 많구나'라..

프로그래머스 데브코스

[개인 프로젝트 회고] Vanilla JS 로 노션 클로닝하기

🔗 URL : https://hellosonic-vanilla-js-notion-hellosonics-projects.vercel.app/ 🚀 들어가며 드디어, 기다리고 기다리던 바닐라 자바스크립트로 개인 프로젝트를 진행하게 되었다. 개인적으로 데브코스의 많은 커리큘럼 중에서도, 바닐라 자바스크립트로 첫 프로젝트를 진행한다는 점이 인상깊었다. 자바스크립트 기본기를 탄탄하게 다져야만 이후 커리큘럼인 리액트 학습과, 백엔드와의 팀프로젝트를 제대로 진행할 수 있다고 생각했기 때문이다. 이전까지 현업자분들의 강의를 수강하며, 데이터의 흐름과 콜백 함수의 전달 등 이전까지 내가 코딩테스트를 대비하며 전혀 겪어보지 못한 새로운 어려움을 해결하기 위해 노력했고, 이번 프로젝트에 그간의 노력들을 다 담아보기로 결심했다..

프로그래머스 데브코스

[데브코스] 성장 중.. 과제 수행, 첫 PR, 코드리뷰 후기

🚀 들어가며 프론트엔드 데브코스에서 가장 기대했던 것 중에 하나는, 매주 과제를 수행하고 과제에 대해 팀원, 멘토님들에게 코드리뷰를 받을 수 있다는 것이었다. 나는 데브코스에 입과하기 전, 혼자서 백준 문제를 풀거나, Django로 인스타그램 클론코딩을 해본 경험이 전부였다. 그 때문에 나에게 다양한 커뮤니케이션의 기회와 협업 경험을 쌓을 수 있는 환경은 절실했고, 데브코스 최종합격을 했을 때 정말 기뻤던 기억이 난다. 데브코스 입과 전의 난, 깃허브에서 commit 과 push 외에는 전혀 몰랐다. 아니, commit 과 push 도 잘 몰랐던 것 같다. 데브코스 입과 후 토요일 첫 세션으로 프론트엔드 개발자 진유림님의 깃허브 특강을 수강했는데, 그 덕에 실무에서의 깃허브에 대한 활용 기본기를 알 수 ..

프로그래머스 데브코스

[JavaScript] SPA와 History API

🚀 들어가며 프론트엔드 데브코스 강의를 듣는데 history API 파트가 나왔다. 마음이 너무 급했던 탓일까, 빠르게 이해하려고 보니 이해가 되지 않았다. 나에게 SPA는 생소한 개념이었고, SPA를 모르다보니 SPA를 위한 history API도 이해하기 쉽지 않았다. 잠시 급한 마음을 다스리고, SPA부터 차근차근 공부하기 시작했다. ✅ SPA(Single Page Application) 과거에는 웹 페이지를 렌더링할 때 서버에 렌더링에 필요한 리소스를 요청하고, 받아온 리소스를 클라이언트에서 렌더링했다. 즉, 렌더링이 필요한 특정 부분 이외의 불필요한 부분까지 같이 렌더링해야만 했다. 하지만 SPA가 등장하고 나서부터는 특정 부분의 렌더링을 위해 서버에서 필요한 데이터만 전달받고 렌더링할 수 있게..

프로그래머스 데브코스

[JavaScript] 인프런 코어 자바스크립트 수강후기

🚀 들어가며 프로그래머스 프론트엔드 데브코스도 벌써 시작한지 한달이 다 되어간다. 시간이 정말 빠르다. 나는 프론트엔드 데브코스 지원 전에는 거의 파이썬으로 코딩테스트 문제만 풀어보다가 본격적인 프론트엔드 개발자가 되기 위한 전선에 뛰어들면서 JavaScript를 학습하게 되었다. 난 파이썬을 비전공자인 다른 누군가에게 설명할 때 프로그래밍 언어의 '돌연변이' 라고 설명한다. 그 이유는 파이썬은 메모리 할당과 같은 기본적인 CS 지식을 몰라도 충분히 코딩테스트에서 좋은 성과를 거둘 수 있다고 생각하고, 구현되어 있는 내장함수들이 많아서 사용하기 정말 편리하기 때문이다. 나는 파이썬 언어로 지난 6개월간 꾸준하게 코딩테스트 문제를 풀면서 골드2를 달성했었다. 그 때문에 약간 자만한 것도 있었다. 언어만 다..