폴더구조 src/redux/config/configStore.js 생성 import {createStore} from "redux"; import {combineReducers} from "redux"; const rootReducer = combineReducers({ // modules }); const store = createStore(rootReducer); export default store; src/redux/modules/counter.js 생성 const initialState = { number: 0 } const counter = (state = initialState, action) => { switch(action.type) { // type에 맞는 로직 생성 default: r..

리액트 앱 생성 yarn create react-app [폴더명] 패키지 react-router-dom yarn add react-router-dom 리덕스, 리덕스툴킷 yarn add redux react-redux @reduxjs/toolkit Axios 설치 yarn add axios

프론트 개발을 리액트로 해보고 싶어서 공부 중이다. 아직 시행착오가 많지만 언젠간 익숙해지지 않을까?! 구조 분해 할당이란? 기존 props 할당 -> 자식 컴포넌트에서 props를 받을 때 하나의 오브젝트로 받아 사용 function Todo(props){ return {props.todo} } 자바스크립트의 구조 분해 할당을 이용 function Todo({ title, body, isDone, id }){ return {title} } 회고 temp라는 오브젝트를 만들어 오브젝트로 넘기면 알아서 구조 분해가 되서 할당될 줄 알았는데 그건 나의 욕심이였나보다... import React from 'react' import Layout from 'Layout'; import Child from 'Chi..

도커란 도커란 어플리케이션을 패키징 할 수 있는 툴로 리눅스 컨테이너 기반으로 하는 오픈소스 가상화 플랫폼이다. Docker가 출시되고 단 몇 초 만에 새로운 운영체제를 생성하고 서비스를 배포할 수 있게 되고 어플리케이션을 구동하는데 필요한 이것 저것들을 설정하고 준비해야하는 번거로움이 줄어들어 개발자들이 실질적으로 사용할 수 있는 편리성의 위치까지 해당 기술의 눈높이를 낮추었다. 배경 VM (가상 머신) VM은 응용 프로그램 소프트웨어, 종속성 및 게스트 OS가 포함되어 즉 배포할 각 애플리케이션 스택마다 별도의 VM과 게스트 OS가 필요하고, 게스트 OS를 사용하기 위한 라이브러리, 커널 들을 전부 포함하기 때문에 가상 머신을 배포하기 위해 만든 이미지 또한 크기가 크다. 그리고 이것은 이러한 것들은..