728x90 반응형 fe6 [why] 📚 테스트 코드는 왜 작성해야 할까요? 특히 프론트엔드에서는요? 들어가며테스트 코드. 올해 제가 가장 많이 마주한 단어이자, 그 필요성을 뼈저리게 느낀 개발 문화입니다. 이 깨달음은 두 가지 의미 있는 경험을 통해 얻게 되었습니다.첫 번째는 상반기 인턴 근무 중의 경험입니다. 당시 저는 혼자 개발을 진행해야 하는 상황이었습니다. 동료 개발자의 코드 리뷰나 피드백을 받을 수 없는 환경에서, 제가 작성한 코드의 신뢰성을 검증할 방법이 절실했습니다. 이때 테스트 코드의 부재가 얼마나 큰 리스크가 될 수 있는지 깨닫게 되었습니다.두 번째는 현재 참여 중인 네이버 부스트캠프에서의 경험입니다. 5명으로 구성된 팀에서 유일한 프론트엔드 개발자로 프로젝트를 진행하게 되었습니다. 웹 풀스택 과정이기에 팀원들이 제 코드를 리뷰할 수는 있지만, 복잡한 상태 관리나 사용자 인터랙션과 같은.. 2024. 11. 16. [네이버 부스트캠프] 토스의 퍼널 패턴 적용해보기 퀴즈 플랫폼에 퍼널 패턴 적용하기: 토스의 UX 디자인 패턴 차용들어가며부트캠프에서 실시간 퀴즈 플랫폼을 개발하면서 마주친 가장 큰 도전과제는 "어떻게 하면 사용자들이 끊김 없이 퀴즈에 참여할 수 있을까?"였습니다. 이 문제를 해결하기 위해 우리는 토스(Toss)의 퍼널 패턴을 도입했고, 놀라운 결과를 얻을 수 있었습니다.퍼널 패턴이란?퍼널(Funnel)은 '깔때기'라는 뜻으로, 사용자가 특정 목표를 달성하기까지의 단계를 위에서 아래로 시각화했을 때 깔때기 모양이 되는 것에서 유래했습니다. 예를 들어 일반적인 이커머스의 구매 과정은 다음과 같은 단계로 이루어집니다:쇼핑몰 방문상품 검색상품 선택장바구니에 담기결제 정보 입력최종 결제실제 토스의 컨퍼런스 영상에서의 토스의 송금 프로세스를 보면 이러한 퍼널 패.. 2024. 11. 11. [why] 프론트엔드 개발자로써 알아야 되는 부분들 개요현대 웹 개발에서는 수많은 기술과 도구들이 끊임없이 진화하고 있습니다. 이러한 환경에서 개발자들은 단순히 사용법을 익히는 것을 넘어, 각 기술의 존재 이유와 작동 원리를 깊이 이해할 필요가 있습니다. 이 시리즈는 프론트엔드 개발의 핵심 영역들에 대해서 학습하고 정리해보려고 합니다.시리즈의 목적프론트엔드 기술의 근본적인 원리와 배경 이해기술 선택과 의사결정에 대한 깊이 있는 통찰 제공발전하는 웹 생태계에 대한 포괄적인 이해 도모실무에서 마주치는 문제들에 대한 해결 능력 향상주제 목록1. 자바스크립트의 핵심 개념undefined는 어떤 목적으로 탄생했을까?자바스크립트가 스크립트 언어로 설계된 이유는?객체 기반 언어로서의 자바스크립트의 특징은?싱글 스레드 동작 방식의 장단점은?호이스팅은 어떤 원리로 동작하.. 2024. 10. 26. [FE] 아토믹 디자인 패턴에서 탈출: 컴포넌트 디자인 패턴, 방법론 찾아보기 개요프론트엔드 개발자를 희망하는 사람으로서 다양한 프로젝트를 진행하면서, 저는 몇 가지 디자인 패턴과 방법론을 경험해 왔습니다. 특히 React를 사용한 프로젝트에서는 아토믹 디자인 패턴이 큰 유행을 끌었고, 저 역시 이를 적용해 보았습니다. 그 과정에서 유행을 따라가다 보니 오히려 다른 디자인 패턴과 방법론을 많이 못 사용해본 문제도 생겼던 것 같습니다.하지만 시간이 지나면서 아토믹 디자인 패턴이 모든 상황에 적합한 것은 아니라는 점을 깨달았습니다. 작은 규모의 프로젝트에서는 오히려 과도한 구조화로 인해 복잡성만 증가하는 경우가 있었습니다. 또한, 프로젝트의 특성에 따라 다른 패턴이나 방법론이 더 효과적일 수 있다는 것을 알게 되었습니다.이러한 경험을 바탕으로, 이번에 새로운 React 프로젝트를 시작.. 2024. 10. 7. [우아콘] 프론트엔드 상태관리 실전편을 보고 나서 상태관리 → 상태와 관리가 합쳐진 말 State: A Component’s Memory → 컴포넌트의 메모리가 상태이다 최근 리액트 개발에서 컴포넌트가 중심에 있음. → 어떤 팝업을 화면에 띄울지 말지, 주문/배달의 진행은 어떠한지 상태는 공통으로 그리고 단일로도 사용되어질 수 있는 개념임. 상태관리가 등장한지도 얼마 안됐는데 한계점도 있음 상태관리 방법의 변화 Redux로 상태관리를 풀고 있었고 → mobX등으로 해결을 해나가려고 했음 여전히 코드가 너무 많다는 문제가 있었지만 해결할 만한 방법 X → Post 상태관리, 원격 상태관리가 나옴 리덕스, mobx에는 스토어가 큰 것도 있지만 상태관리보다 API 호출 코드가 더 많다는 문제가 있음. Mobx + React-query 를 쓰니 스토어는 단순해.. 2024. 1. 30. 스터디 1일차 후기 지인들과 CS(네트워크, 운영체제, 자료구조)에다가 FE 파트에 대해서 스터디를 시작했습니다. 생각보다 지난주에 여러 일정이 많았어서 집중을 온전히 많이 못했었는데, 스터디를 하니까 그게 확실히 들어났던...것 같다.(열심히 봐야 할듯) 그래서 간단하게 스터디 했던 내용들을 정리해보려고 한다. 물론 각각 따로 정리를 해야 될 것 같지만서도... 운영체제 Q-1: 운영체제란? A: 하드웨어 위에서 사용자와 연결해주는 인터페이스 역할을 해주는 소프트웨어, 사용자가 편하게 사용하기 위한 환경을 제공해주는 동시에 효율적으로 컴퓨터 리소스를 활용할 수 있도록 도와준다. 그리고 메모리 관리와 파일 시스템 관리를 담당하고 있다. Q-2: CPU 스케줄링? A: 현대의 운영체제는 time sharing 방식으로 운영되.. 2023. 5. 8. 이전 1 다음 728x90 반응형
