본문 바로가기

전체 글

 (176)
[매일메일] 낙관적 업데이트란? (FE.250121) (개발자 강화/프론트엔드) 2025. 1. 21. 19:17 낙관적 업데이트성공적인 상태 업데이트가 이루어 질 것이라는 가정 하에 서버 응답 전 UI를 미리 업데이트 해둠. 대표적인 예시 - 좋아요 기능사용자가 좋아요 버튼을 눌렀을 때, 서버 응답을 기다리지 않고 화면에 바로 버튼 누름 상태 반영함.서버 응답이 성공적으로 돌아오면 유지하고, 실패하면 UI에서 해제하거나 오류 메시지를 보여줌 장점서버 응답 속도와 상관 없이 즉각적인 피드백을 제공해서 사용자가 시스템을 빠르게 쓸 수 있음네트워크 상태가 좋지 않거나 응답 시간이 길어도 사용자 경험에 영향이 덜 미침 단점서버에서 오류가 발생하면 잠시동안 화면에 잘못된 정보가 표시될 수 있음이를 대비해 오류 핸들링(rollback) 로직을 같이 설계해줘야 함 낙관적 업데이트를 사용해야 하는 경우요청이 성공할 가능성이 높고..
[매일메일] 자바스크립트의 호이스팅(feat. 인터프리터 언어)(FE.250110/241230) (개발자 강화/프론트엔드) 2025. 1. 20. 22:12 호이스팅이란?- 변수와 함수 선언이 실행 전에 scope의 맨 위로 끌어올려지는 것처럼 보이는 동작- 변수를 선언하기 전에 호출해도 에러가 발생하지 않음. 선언된 위치보다 상단에서 변수에 접근할 수 있는 것처럼 보임. 인터프리터 언어란?- 한 줄씩 읽어서 즉시 실행하는 언어. 소스 코드를 직접 실행함..- runtime에 에러 감지- Python, JavaScript, Ruby, PHP 등  반의어: 컴파일러 언어.       - 실행 전에 전체 코드를 기계어로 변환하는 컴파일을 거친 후, 실행 파일로 실행.       - compile 단계에서 에러 감지       - C, C++, Java 등 자바스크립트에서 호이스팅이 가능한 이유?[1] 컴파일 단계: 함수 및 변수 선언을 한 부분이 메모리에 할당 ..
[매일메일] React의 Controlled Component와 Uncontrolled Component의 차이점? (FE.241220) (개발자 강화/프론트엔드) 2025. 1. 20. 21:55 Controlled ComponentUncontrolled Component정의React state(상태)로 입력값을 제어함DOM 자체가 입력값을 제어함입력값 관리value(입력 요소 값)을 React state와 동기화onChange로 사용자 입력 시 state 업데이트.상태와 ui가 동기화됨. 예측 가능성 높음.value(입력 요소 값)은 DOM에서 직접 관리함.React는 관여하지 않음.간단한 입력 폼이나 초기값 설정 및 DOM 접근에 용이.방식useState로 input value 제어하는 경우.value는 React state로 관리onChange 이벤트 발생하면 state 업데이트ref를 사용해 DOM 요소에 직접 접근해 값 읽기/쓰기예시실시간 유효성 검증(이메일 형식 확인)폼 데이터를 동적으..

티스토리툴바