코드를 위한 기록

기존 상태의 비효율성으로 인해 상태 관리 라이브러리가 필요하게 됨 1. 불필요하게 관여된 컴포넌트들도 상태를 가지게 됨 2. 상태 끌어올리기, Props 내려주기를 여러 번 거쳐야 함 3. 애플리케이션이 복잡해질수록 데이터 흐름도 복잡해짐 4. 컴포넌트 구조가 바뀐다면 기존의 데이터 흐름을 완전히 바꿔야 할 수도 있음 * Redux는 React의 하위 라이브러리가 아님 React 없이도 사용할 수 있는 상태 관리 라이브러리 Redux의 구조 Action -> Dispatch -> Reducer -> Store 1. 상태가 변경되어야하는 이벤트 발생 시, 변경될 상태에 대한 정보가 담긴 Action 객체 생성 {type: 'INCREASE'} 2. Action 객체는 Dispatch 함수의 인자로 전달됨 ..

상태(state): UI에 동적으로 표현될 데이터 Side Effect: 함수(컴포넌트)의 입력 외에도 함수의 결과에 영향을 미치는 요인 - Side Effect를 최대한 배제하고 컴포넌트를 만들어야 함 (API요청 없이도 컴포넌트가 작동하도록 로딩 화면 구현 = presentation표현 컴포넌트) 상태를 구분하는데 절대적인 기준이나 법칙이 있는 것은 아님 로컬 상태 : 특정 컴포넌트 안에서만 관리되는 상태 ex) 다른 컴포넌트와 데이터를 공유하지 않는 form폼 데이터(input box, select box 등) 전역 상태 : 프로덕트 전체 혹은 여러 컴포넌트에서 관리되는 상태 ex) 테마(다크모드), 국제화(Globalization, 사용자 언어), 포토샵/일러스트의 히스토리 기능과 Undo/Red..

Java 설치 // 터미널 // 버전 확인을 통해 자바가 설치되어있는지 확인 java -version sudo apt update sudo apt install default-jdk // jdk는 java development kit java editor intellij, eclipse, vscode 등 vscode 사용 소스 파일은 src 폴더 컴파일한 파일은 bin 폴더에 저장됨 소스 파일(원인을 부르는 방식) : source, code, language 컴파일한 파일(결과를 부르는 방식) : application, program 파일 실행 // 터미널 java 파일이름 파일 이름과 파일 내부의 클래스 이름을 같게 설정하기 전체적인 흐름 Java Source code .java 사람이 이해할 수 있는..

CDD를 지원하는 도구인 Component Explorer(컴포넌트 탐색기) StoryBook 컴포넌트 탐색기의 UI 개발 도구 중 하나 컴포넌트들을 따로 볼 수 있게 구성하여 한 번에 하나의 컴포넌트에서 작업할 수 있음 특징 1. 재사용성을 확대하기 위해 컴포넌트를 문서화하고 자동으로 시각화함 - 다양한 테스트 상태를 확인할 수 있음 - 버그를 사전에 방지 - 테스트 및 개발 속도 향상 - 의존성을 걱정하지 않고 빌드할 수 있음 2. 독립적인 개발 환경에서 실행됨 - 다양한 상황에 구애받지 않고 UI 컴포넌트를 개발할 수 있음 회사 내부에서 UI 라이브러리로 사용하거나, 외부 공개용 디자인 시스템을 개발하기 위한 기본 플랫폼으로 사용 주요 기능 - UI 컴포넌트를 카탈로그화 - 컴포넌트 변화를 stor..

XOR 연산(^) 두 피연산자를 32비트의 정수로 변환(2진법)하여 각 자리의 값(0 또는 1)이 같으면 그 자리를 0, 다르면 1로 바꿔 10진법의 정수로 리턴 const a = 5; // 00000000000000000000000000000101 const b = 3; // 00000000000000000000000000000011 console.log(a ^ b); // 00000000000000000000000000000110 // expected output: 6 두 피연산자와 결과값까지 세 값은 한 쌍임 const a = 5; const b = 3; const c = a ^ b console.log(c); // 6 console.log(c ^ a) // 3 console.log(b ^ c) /..