본문 바로가기
반응형

전체 글352

useState, useEffect 동작 퀴즈 1 Q) 다음 콘솔에 출력되는 값은?import { useEffect } from "react";import { useState } from "react";export default function App() { const [state, setState] = useState(0); console.log("state : " + state); useEffect(() => { setState(1); }, [state]); return App;}문제 설명useState와 useEffect의 동작 순서, 동작 방식을 알고 있는지?리액트 라이프사이클문제import { useEffect } from "react";import { useState } from "react";expor.. 2024. 7. 6.
북클럽 클린코드 9장. 단위 테스트 TDD 법칙 세 가지첫째: 실패하는 단위 테스트를 작성할 때까지 실제 코드를 작성하지 않는다.둘째: 컴파일은 실패하지 않으면서 실행이 실패하는 정도로만 단위 테스트를 작성한다.셋째: 현재 실패하는 테스트를 통과할 정도로만 실제 코드를 작성한다.실제 코드와 맞먹을 정도로 방대한 테스트 코드는 심각한 관리 문제를 유발하기도 한다.깨끗한 테스트 코드 유지하기일회용 테스트 코드와 단위 테스트는 간극이 아주 크다.실제 코드가 변화하면 테스트 코드도 같이 변해야 한다.테스트 코드가 더러우면 변경하기가 어려워진다.테스트 코드가 복잡할수록 변경하는 시간이 더 걸린다.테스트 코드를 막 짜도 좋다고 허용한 결정이 잘못된 거다.테스트 코드는 실제 코드 못지 않게 중요하다.테스트 코드는 사고와 설계와 주의가 필요하다.실제 코.. 2024. 7. 6.
북클럽 클린코드 8장. 경계 외부 소프트웨어와의 경계를 깔끔하게 처리하는 기법과 기교를 살펴보자.다른 사내 팀이든, 구매한 프로그램이든, 오픈소스든외부 코드 사용하기인터페이스 제공자와 사용자 사이의 차이제공자는 적용성을 넓히려 애쓴다.사용자는 자신의 요구에 집중하는 인터페이스를 바란다.인터페이스에 기능이 이것저것 많다면?사용자에게 필요하지 않은 기능까지 제공하는 문제가 발생한다.자료구조는 객체 안에 숨기고 인터페이스(함수)로 원하는 기능을 제공하자.맵 쓸때 무조건 캡슐화 하라는 소리가 아니다.맵을 여기저기 넘기지 말라는 말이다.자료구조를 어디 밖으로 넘기고 주고받고 하지 말라Map 인스턴스를 공개 API의 인수로 넘기거나 반환값으로 사용하지 않는다.#TODO Map에 한정된 이야기인가?Map과 같은 경계 인터페이스 라고 언급했는데 .. 2024. 7. 6.
숙제 3. useRef 만들기 요구사항useRef는 렌더링에 필요하지 않은 값을 참조할 수 있는 React Hook 입니다.initialValue : 초기값변수에 담기는 초기값초기 렌더링 이후에는 무시되어야 함.ref : { current: 현재값 } 구조를 담고 있음current는 현재 ref가 가리키는 값을 나타낸다.ref의 current는 변경 가능하다. mutable 하다./// ref : { current : any }const ref = useRef(initialValue)용례 1. 렌더링과 상관없는 변수 담는 통으로 쓰기진짜 그냥 통으로 쓰면 된다.용례 2. 렌더링 엘리먼트에 ref로 등록하기컴포넌트의 기본 props로 ref 값이 있는지 체크하고 값이 있으면 내 현재 DOM 객체를 current에 등록시킨다.매번 ren.. 2024. 7. 6.
북클럽 클린코드 7장. 오류 처리 오류 처리는 중요하지만 오류 처리 코드로 인해 프로그램 논리를 이해하기 어려워진다면 깨끗한 코드라 부르기 어렵다.우아하고 고상하게 오류를 처리하는 기법과 고려사항 몇 가지를 알아보자.오류 코드보다 예외를 사용하라오류 코드를 던지면 호출자가 즉시 오류를 처리해야 된다.예외를 던지면 호출자에서 처리할 수도 있고, 상단으로 넘길 수도 있다.예외를 던지면 정상 처리 흐름과 예외 처리 흐름이 분리돼서 코드가 깔끔해진다.Try-Catch-Finally 문부터 작성하라예외가 발생할만한 코드를 짤떄는 일단 감싸자강제로 예외를 일으키는 테스트 케이스를 작성한 후 테스트를 통과하게 코드를 작성하는 방법을 권장한다.자연스럽게 try 블록의 트랜잭션 범위부터 구현하게 되므로 범위 내에서 트랜잭션 본질을 유지하기 쉬워진다.미확.. 2024. 7. 3.
북클럽 클린코드 6장. 객체와 자료 구조 변수를 private으로 정의하는 이유가 있다.남들이 변수에 의존하지 않게 만들고 싶어서다.충동이는 변덕이든, 변수 타입이나 구현을 맘대로 바꾸고 싶어서다.[!NOTE]그렇다면 어째서 수많은 프로그래머가 조회(getter) 함수와 설정(setter) 함수를 당연하게 public으로 만들어 비공개 변수를 외부에 노출할까?자료 추상화인터페이스는 자료 구조를 명백하게 표현한다.클래스 메서드가 접근 정책을 강제한다.좌표를 읽을 때는 각 값을 개별적으로 읽어야 한다.하지만 좌표를 설정할 때는 두 값을 한꺼번에 설정해야 한다.==변수 사이에 함수라는 계층을 넣는다고 구현이 저절로 감춰지지는 않는다.==구현을 감추려면 추상화가 필요하다.그저 형식 논리에 치우쳐 getter/setter를 단다고 되는게 아니다.==추상.. 2024. 7. 1.
반응형