React State
1. What is State?In React, state is a way to manage data that can change over time, and it is specific to each component. Unlike props (which are immutable and passed down from parent to child), state allows a component to maintain and update its own
React Props
PropsIn React, the flow of data is unidirectional: it flows from the parent (higher-level) component to the child (lower-level) component. In this flow, data passed from the parent to the child is conveyed through an object called props, which is sho
React Component & Lifecycle
A ReactElement is an implementation of the concept called the Virtual DOM (VDOM). The VDOM is a JavaScript object that exists in memory and can be created using the React.createElement function. The elements created by this function are just regular
HTML5 / CSS3 Horizontal and Vertical Alignment
This article covers how to align sentences, paragraphs, and boxes containing paragraphs in a visually pleasing way using HTML and CSS. We will look at two methods for centering alignment on the horizontal and vertical axes. Method 1. display: table /
[ 셀러지원센터 ] 신입 개발자의 프로젝트 첫 시작
React Fragment
1. React Component Element Renderingclass CorrectComponent extends React.Component { // React Component is rendering only a single element. render() { return ( <h4> Hello React </h4> ) } } class WrongComponent extends React.Component { // React Compo
Hooks
There are two types of components in React. Class Component – This is the method of creating a component using a class. It is the default way of building components in React. The reason why Class Components are commonly used is because they allow acc
검색 서비스에서 좋은 품질의 코드를 찾는 은하수 항해 기록
들어가며 안녕하세요. 11번가 검색/추천 서비스 개발팀에서 11번가 검색 서비스의 프런트엔드 개발을 담당하고 있는 김다미, 이호찬입니다. 검색 서비스의 프런트엔드 파트에서는 검색 결과를 큐레이션하여 사용자가 원하는 상품을 더욱 쉽게 탐색할 수 있도록 돕는 다양한 형태의 UI를 개발하고 있습니다. 11번가 검색 서비스는 사용자의 클릭과 구매 전환율 등 다양한 활동 지표를 바탕으로, 더 나은 탐색 경험을 제공하기 위해 지속적으로 발전하고 있습니다.
부서 내 효율적 협업을 위한 Playground 개발
부서 내 동료들과 효율적으로 협업하기 위해 Next.js 기반의 Playground를 만들고 소통한 경험을 공유합니다.
JavaScript fetch 메서드는 왜 2번 await 해야만 할까?
JavaScript fetch에서 데이터를 얻기 위해 두 번의 await이 필요한 이유에 대해 알아봅니다.
Front-end 개발자가 회고하는 기획전 개편
안녕하세요. 질문을 사랑하는 올리브영 프론트엔드 개발자 “우문Hyun답”입니다.😁 스토어전시 스쿼드에서는 24년 2-3분기에 기존 JSP로 구현된 기획전 시스템을 Next.js…
월간 크롬 이슈 리포트 2024년 10월호
프런트엔드 개발에 가장 많은 영향을 주는 크롬 브라우저의 버전별 변경 예정 항목을 정리 및 공유한다. (2024년 10월호)
개발자 면접 1분 자기소개, 이렇게 준비하자
개발자 직무 면접에서 1분 자기소개 시 사용할 수 있는 템플릿을 사례와 함께 소개합니다.
기획전 애니메이션 모듈 개발
지그재그는 상품 판매를 촉진하기 위해 이벤트나 기획전을 주요 마케팅 수단으로 활용합니다. 기획전은 한정된 기간 동안 고객에게 특정 상품 정보와 추가적인 할인 혜택을 명확하게 제시하여 판매를 유도하는 역할을 합니다. 따라서 다양한 기획전을 지속적으로 발행해 고객의 관심을 유도하고, 브랜드 충성도를 높이며, 구매율을 증가시키고 있습니다. 또한, 다양한 테마와 카테고리별 기획전을 통해 고객의 소비 패턴과 선호도에 맞춘 맞춤형 쇼핑 경험을 제공합니다.
월간 크롬 이슈 리포트 2024년 9월호
프런트엔드 개발에 가장 많은 영향을 주는 크롬 브라우저의 버전별 변경 예정 항목을 정리 및 공유한다. (2024년 9월호)
올리브영에서는 프론트엔드 개발자들이 이런 고민을 하는군요?
😲 "어? 올리브영에도 개발자가 있나요?" 🤔: 올리브네트웍스를 말씀하시는 건가요? 올리브영은 다 SI로 개발하는 거 아니었어요? 🫢: 우와, 올리브영에 개발자가 생각보다 많네요! 그것도 15…
타입스크립트스럽게 성능과 생산성 두 마리 토끼 모두 잡기
최고의 자동완성 플러그인 타입스크립트를 사용하여 개발자를 속이고 코드를 최적화한 경험을 공유합니다.
IMQA SaaS 대규모 업데이트 안내
프론트엔드 통합 성능 모니터링 솔루션 IMQA의 SaaS 버전이 한층 더 강화된 분석 기능으로 업데이트됩니다.