JavaScript
props와 state
React 개발 방식의 가장 큰 특징은 컴포넌트 단위로 시작한다는 것이다. 컴포넌트를 만들고 조립하는 상향식(bottom-up) 특징을 가지고 있다. 이는 테스트가 쉽고, 확장성이 좋다. 따라서, 컴포넌트 계층 구조로 나누는 것이 가장 먼저 해야 할 일이다. 컴포넌트는 단일 책임 원칙으로, 하나의 컴포넌트는 한가지 일만 해야한다. 이전 글에서 작성했던 컴포넌트에 대한 보충을 하자면, → 컴포넌트 바깥에서 props를 이용해 데이터를 마치 인자(arguments) 혹은 속성(attributes)처럼 전달받는다. → 데이터를 전달하는 주체는 "부모 컴포넌트"이다. → 데이터의 흐름은 하향식 (top-down)이다. → 단방향 데이터 흐름(one-way data flow)을 가진다. 오직 아래의 컴포넌트에만 ..
함수 컴포넌트와 클래스 컴포넌트
컴포넌트 (Component)? → "독립된 모듈"로 소프트웨서 시스템을 교체가 가능하다. → 하나의 기능을 구현하기 위해 여러 종류의 기능을 한꺼번에 묶어놓은 기능이다. (code set) → 재사용이 가능하다. → 기능 자체에 집중할 수 있다. → 에러를 찾을 수 있어 유지보수가 용이하다. React 사용 시, 컴포넌트를 2가지로 정의할 수 있다. React 입장에서 바라보면 2가지 컴포넌트를 동일하다. ➀ 함수 컴포넌트 (가장 간단) function Introduce(props) { return Welcome, {props.name}; } 데이터를 가진 하나의 "props" 객체 인자를 받은 후 React 엘리먼트 반환한다. JavaScript 함수이기 때문에 말 그대로 이름을 붙여주었다. * pr..
정규 표현식 Regular expressions
티스토리 첫 글이다. 블로그를 자주 이사하는 것이 좋은 것은 아니라고 들었으나, 벨로그에서 티스토리로 이사 온 이유는 벨로그보다 가독성이 좋게 느껴졌고, 사람들이랑 소통하기 더 좋다고 생각했다. 티스토리에 찍히는 Total 보면 한 명이라도 이 블로그를 지켜본다는 생각에 조금 더(?) 정확하게 공부하고 글을 쓰려고 노력할 것 같다는 생각.. 을 해봤다. 아무튼 시작! 정규 표현식은 DOM을 이용해 로그인 창을 구현할 때, 처음 배웠다. DOM이 더 혼란스러워서 조금 얕게 공부를 했더니, 어제, 오늘 진행했던 스프린트에서 match() 함수를 매개변수로만 구현해 더 꼬이는 상황이 발생했다. 그래서 늦게나마 블로깅으로 공부한 내용을 정리하려고 한다. 정규 표현식 한마디로 문자를 표현하는 식이다. 즉, 문자열..