미미 공부/취미방

useContext가 여러개 필요할 것 같다. modal 열리고 닫는 것도 부모, 자식 사이에 상태를 전달해야 돼서 복잡해 지면 그냥 useContext 사용하고, 돈, 쇼핑 정보 등은 복잡한 useContext가 예상된다... 화이팅...💪

Function return을 할 때, 항상 로 감싸서 한 개의 태그만 리턴하는 이유는, JSX를 사용하지 않은 React의 문법 때문이다. return ( Hello ); [JSX를 사용한 코드] return React.createElement( "div", //만드는 태그 {}, //속성 React.createElement("h2", {}, "Hello"), // 자식요소 React.createElement(NewExpenseItem, { expenses: expenses }) ); [JSX를 사용 안 한 코드] React.createElement(만들 태그, 속성, 자식요소) 해당 문법에서 '만들 태그'는 1개만 들어가기 때문에, JSX 문법을 사용할 때, 1개의 태그만 리턴 가능하다.

1. Javascript의 '모듈' Javascript의 작업 크기가 커지면 유지 보수를 위해 파일을 분리해서 관리하는데, 이런 분리된 파일들을 '모듈'이라고 한다. export와 import로 모듈을 불러와서 작업한다. (script 태그로 모듈을 불러오는 경우, type="modul" 속성을 필수로 넣는다.) 2. Destructuring syntax (구조분해) 객체, 배열 데이터의 각 값을 분해, 변수에 저장하는 문법이다. 배열 데이터는 위치로 판단해 변수에 값이 담기고, 객체 데이터는 key 이름으로 담긴다. const [array, example] = ["hello", "world"]; console.log(array, example); const { apple, lemon: yellow } ..

export vs export default export와 export default 모두 공통적으로 한 파일에 있는 변수, 함수를 다른 파일에서 가져다 쓰기 위해 "내보내기"를 해 준다. export 한 파일에서 여러번 사용해서 여러 개를 내보낼 수 있다. export const todo = '할일'; export const finished = '끝'; export function TodoList () { return todo; }; export default 한 파일에서 한 번만 사용하고 한 개만 내보낼 수 있다. export default function TodoList () { return todo; } export const todo = '할일'; export const finished = '끝..

Redux의 combineReducers() 여러 파일에 나눠서 작성한 리듀서즈(reducers)를 합치는 역할을 한다. export const ADD_TODO = 'ADD_TODO'; export const COMPLETE_TODO = 'COMPLETE_TODO'; export function addTodo (text) { return { type : ADD_TODO, // action에 type이 필요한 이유는, // type에 따라 Reducer에서 상태를 어떻게 변경할지, 어떤 작업을 처리할지 판단하기 위함 text, }; } // export와 export default의 차이점? export function completeTodo (index) { return { type: COMPLETE_T..

스프레드 연산자 (...) 문법 배열(array), 객체(object) 혹은 반복가능한 데이터 가진 변수인 경우 사용할 수 있다. 데이터 내부의 여러 값들을 각각 분리해서 리턴한다. (예시) See the Pen spread operator by mimi-miyeon (@mimi-miyeon) on CodePen. 함수의 인수로도 사용 가능 함수에서 매개변수(parameter)의 인자(argument)로도 사용이 가능하다. 이런 경우 마지막 매개변수로 선언해 주어야 한다. See the Pen Untitled by mimi-miyeon (@mimi-miyeon) on CodePen.