개발자 일상

태그

1 more property

갤러리 보기

이번 치킨 모임은 다양한 개발자와 채용 담당자와의 인사이트 공유의 기회였다. 이런 모임이 더 많아져야 한다고 생각한다.

나는 컴포넌트 설계를 통해 코드 재사용성과 유지보수 용이성을 높이는 방법에 대해 고민하고 있으며, 이를 통해 더 효율적인 개발이 가능하다고 생각한다.

이력서 가이드는 프론트엔드 개발자가 작성해야 할 JD 분석, 지원동기, 자기소개서, 기술 스택 및 포트폴리오 작성 방법을 안내한다. 내가 이 가이드를 통해 이력서 작성의 중요성을 이해한다고 생각한다.

프론트엔드 개발자는 브라우저와 서버에 대한 지식을 갖추고 클라이언트와 협업하여 웹 문제를 해결해야 한다. 내가 서버 지식이 필수라고 생각한다.

프론트엔드 개발자로서, 컴포넌트 패턴을 통해 데이터 관리와 뷰 분리를 실현하는 것이 중요하다고 생각한다.

프론트엔드에서 상태관리는 Custom hook? Redux?

프론트엔드

프론트엔드 상태 관리를 위해 Custom hook과 Redux를 비교하며, 코드 분리를 통해 가독성과 유지보수성을 향상시키는 방법에 대해 이야기한다. 내가 상태 관리의 중요성을 더욱 깊이 이해했다고 생각한다.

브라우저 렌더링 과정은 HTML을 다운로드하고 DOM과 CSSOM을 생성한 후, Render Tree를 만들어 화면에 그리는 작업이다. 나는 성능을 개선하기 위해 Layout을 줄이고 transform 속성을 활용하는 것이 중요하다고 생각한다.

Web

Frontend

2023/08/11

데이터 패칭과 캐싱 및 상태관리에 대해

프론트엔드

데이터 패칭, 캐싱 및 상태 관리를 위한 도구인 RTKQuery, React Query, SWR의 장단점에 따라 프로젝트에 적합한 도구를 선택하는 것이 중요하다고 생각한다.

정적 사이트 생성(SSG)은 변화가 적은 콘텐츠에 적합하며, HTML을 빌드 시점에 생성해 CDN에 배포해 높은 트래픽을 처리할 수 있다. 내가 SSG의 특성을 잘 이해하고 혼합하여 사용하는 것이 중요하다고 생각한다.

서버 사이드 렌더링(SSR)은 서버에서 HTML을 생성해 클라이언트에 전송하여 웹 콘텐츠 렌더링 속도를 높인다. 내가 생각하기에 SSR은 검색 엔진 최적화에 유리하다.

클라이언트 사이드 렌더링(CSR)은 브라우저에서 DOM을 생성하여 HTML을 렌더링하는 방식으로, 초기 로딩 속도가 빠르지만 JS 크기가 커지는 단점이 있다. 내가 CSR이 필요한 경우와 필요하지 않은 경우를 잘 이해해야 한다고 생각한다.

Next.js에서는 동적 경로와 SSG, SSR을 통해 페이지를 효율적으로 생성할 수 있으며, 각각의 장단점을 이해하고 적절히 선택하는 것이 중요하다고 생각한다.

웹앱은 HTML, CSS, Javascript로 구성되며, 클라이언트 사이드와 서버 사이드 렌더링 방식을 통해 UI를 제공한다. 내가 웹앱의 기본 요소와 실행 관점에 대해 이해하고 있다고 생각한다.

첫 회사에서의 1년을 회고하며, 개발자로서의 성장과 협업의 중요성을 느꼈다. 앞으로 더 많은 경험을 쌓고 싶다고 생각한다.

React의 Server Components는 서버에서 렌더링되어 SEO 및 초기 로딩 속도를 개선하지만, 상태 관리와 유연성에서 복잡성을 증가시킬 수 있다고 생각한다.

데이터 노드 샤드는 프라이머리 샤드와 레플리카 샤드로 구성되어 데이터 관리와 부하 분산에 중요하며, 시스템의 효율성을 높게 평가한다고 생각한다.

노드 구성 및 역할에 대한 내용을 다루며, RDB와 OpenSearch의 용어 비교 및 인덱스 구성을 설명하는 것이 중요하다고 생각한다.

React 상태 관리 패턴(FSD, MVC)

FE문제풀이

FSD와 MVC는 각각 기능 모듈화와 책임 분리를 통해 React의 상태 관리 복잡성을 줄이고 유지 보수를 용이하게 한다고 생각한다.

React의 Suspense와 Error Boundary

FE문제풀이

React의 Suspense와 Error Boundary를 활용하여 비동기 데이터 로딩 중 오류와 로딩 상태를 효과적으로 관리하는 것이 사용자 경험을 개선하는 데 중요하다고 생각한다.

Web

React

2024/10/10

Lifting State Up vs Prop Drilling

FE문제풀이

React에서의 상태 관리 방법인 'lifting state up'과 'prop drilling'의 개념을 이해하고, 복잡한 컴포넌트 구조에서 발생할 수 있는 문제를 해결하는 방법이 중요하다고 생각한다.

토큰 기반 인증 방식은 서버 부하를 줄이고 클라이언트와 서버의 독립성을 높이며, JWT 사용 시 보안을 강화하지만 쿠키 저장 시 XSS 및 CSRF 공격 등 주의해야 할 점이 많다고 생각한다.

Props Drilling은 React에서 깊은 컴포넌트 계층으로 인해 발생하는 문제로, Context API, useReducer, Redux와 같은 상태 관리 방법을 통해 해결할 수 있다고 생각한다.

React 제어 컴포넌트, 비제어 컴포넌트

FE문제풀이

React의 제어 컴포넌트와 비제어 컴포넌트는 각각의 장단점이 있으며, 상황에 따라 적절히 선택하는 것이 중요하다고 생각한다.

useImperativeHandle 훅은 부모가 자식 컴포넌트의 기능을 직접 사용할 수 있게 해주지만, 과도한 사용은 유지보수와 테스트를 어렵게 만들 수 있다. 따라서 신중하게 사용해야 한다고 생각한다.

Cotent-Type, Accept 역할

FE문제풀이

Content-Type와 Accept 헤더는 클라이언트와 서버 간 데이터 전송의 필수 요소로, MIME 타입의 올바른 설정이 중요하다고 생각한다.