Frontend26 React - 불변성 불변성이란?메모리에 있는 값을 변경할 수 없는 것을 말한다.원시 데이터(string, number, boolean, null, undefined, Symbol): 불변성 있다.원시데이터는 수정시, 메모리에 저장된 값 자체는 바꿀 수 없고, 새로운 메모리 저장공간에 새로운 값을 저장원시 데이터가 아닌 데이터(Object타입: 객체, 배열, 함수 ..): 불변성 없다.원시데이터가 아닌 데이터는 수정했을 때 기존에 저장되어 있던 메모리 저장공간의 값 자체를 변경리액트에서 상태 불변성리액트에서 불변성의 지키는 것이 중요한 이유리액트가 상태 업데이트를 하는 원리때문리액트가 화면을 리렌더링하는기준state가 변하면 리렌더링!state가 변하지 않으면 리렌더링 xstate가 변했는지 변하지 않았는지 확인하는 방법?s.. 2024. 8. 21. RSC / RCC Next 13 업데이트에 app directory가 되면서, app directory 내부 모든 컴포넌트는 기본적으로 '서버 컴포넌트'로 동작하게끔 설정되었습니다.app directory 내부에서 '클라이언트 컴포넌트'로 지정하고 싶다면, 아래와 같이 파일 최상단에 'use client' directive를 명시해야 합니다.'use client' // HERE ! import { useState } from 'react' export default function Counter() { const [count, setCount] = useState(0) return ( You clicked {count} times setCount(count + 1)}>Click me .. 2024. 8. 16. Virtual DOM Virtual DOM리액트에서는 가상 돔을 사용가상 돔이란, 실제 DOM(Document Object Model)을 조작하는 방식이 아닌, 실제 DOM을 모방한 가상의 DOM을 구성해 원래 DOM과 비교하여 달라진 부분을 리렌더링 하는 방식으로 작동이 때 가상 돔을 잘 이해해야만 **리액트의 상태(state)**에 대해 잘 이해하고 다룰 수 있음Virtual DOM을 사용하는 이유자바스크립트의 모던한 방식(Vanilla Javascript)의 DOM을 조작하는 방식은 무거운 작동방식이다.실제 DOM에는 브라우저가 화면을 그리는데 필요한 모든 정보가 들어있기 때문그래서 리액트는 깜빡거림 없이 부드러운 UX를 사용자에게 제공하고자 변경사항만 빠르게 파악하고 리렌더링 하기 위해 DOM을 만들어 비교하는 방식을.. 2024. 8. 16. Promise Promise비동기 작업의 완료 또는 실패를 나타내는 객체callback 방식의 call back 지옥을 해결하기 위해 사용Promise의 3가지 상태Pending (대기): 초기 상태로, 이 상태에서는 작업이 아직 완료되지 않음Fulfilled (이행): 작업이 성공적으로 완료된 상태로, 결과값이 존재Rejected (거부): 작업이 실패한 상태로, 실패 원인(에러)가 존재Promise의 장점비동기 처리 시점 명확히 표현연속된 비동기 처리 작업 수정, 삭제, 추가 유연비동기 작업 상태 쉽게 확인 가능유지보수 쉬움후속 처리 메소드thenthen 메소드는 두 개의 콜백 함수를 인자로 전달받음첫 번째 콜백 함수: 성공(fulfilled, resolve 함수가 호출된 경우)시에 실행두 번째 콜백 함수: (re.. 2024. 8. 16. 졸업유예 후, 취업 준비 과정 지난 번 SOPT 에 떨어지고 난 후, 사이드 프로젝트를 2개 정도 진행하면서 다른 IT 연합동아리도 알아보았다. 대외활동 1 - 2024 관광데이터 활용 공모전 참가우선 4월 말, 같은 학교 졸업유예 친구들 및 4학년 학생들과 한국관광공사 x Kakao 에서 주최한 '2024 관광데이터 활용 공모전' 에 참가하기로 했다. 아이디에이션 과정을 거쳐, '여행기와 여행 OOTD를 공유하는 블로그, 트리피' 라는 웹어플리케이션을 개발하기로 결정했다.우리는 여행 관련 정보를 제공하기 위해 TourAPI 와 공공데이터를 활용할 계획이고 나는 이 프로젝트에서 프론트엔드 팀장 역할을 맡았다. 우선 개발하기 전, 제안서 작성을 파트별로 나눠 진행하며 제안배경 및 필요성, 서비스 설명, 공공데이터 활용 방안, 서비스 차.. 2024. 8. 4. 34기 NOW SOPT(솝트) web 파트 지원 후기 웹 부트캠프를 끝마치고 코딩테스트와 사이드 프로젝트를 진행하면서 어딘가에 소속되어 있지 않은 것이 자꾸 불안함을 만들었다.제대로된 프로젝트를 더 해보고싶은 마음에 IT 연합 동아리 SOPT의 YB 34기에 지원했지만, 아쉽게도 면접에서 탈락하게 되었다. 면접에서 떨어졌기에 후기를 쓸지 말지 고민했지만 다음 기수에 SOPT 를 지원할 다른 개발자 분들에게 조금이나마 도움이 되었으면 하는 마음과 복기를 통해 스스로 성장하고자 하는 마음으로 서류 및 면접 후기를 남기려 한다. SOPT는 대학생 연합 IT 벤처 창업 동아리로 국내 최대 규모의 대학생 IT 연합 동아리이다.그만큼 경쟁률도 높고 서류합격도 힘들다고 들어서 이번 기수에서 중요하게 생각하는 핵심 가치를 기준으로 자소서를 작성하기로 했다. 이번 기수의 .. 2024. 4. 28. 이전 1 2 3 4 5 다음