React

리액트는 javascrpt 오픈소스 라이브러리컴포넌트 : 프로그래밍의 한 부분을 의미, 재사용이 가능한 최소 단위를 뜻함컴포넌트로 사용하는 이유1.현대의 웹은 크고 복잡하기 때문에 작게 분할해서(캡슐화) 해결하기 위해 필요2.분업화 가능범용성JavaScript를 확장한

리액트에는 특히 JSX 라는 문법을 써야한다. JSX를 쓰면 얼마나 편리한지 알아보자 JSX 쓰는 이유 >결과 Hello, HTML DOM HTML과 DOM 이라는 글자가 들어있는 변수를 가지고 출력하기 위해서는, 1. html 파일을 만들고 난뒤 2. js 파일

Props 컴포넌트의 속성을 의미 props는 immutable Data, 변하지않는 데이터로 부모 컴포넌트에서 자식 컴포넌트로 데이터를 넘겨줄 때 사용 1.사용법

Event Handeling 소문자 대신 카멜케이스를 사용 문자열이 아닌 함수로 이벤트 처리 함수를 전달 HTML : 이벤트 종류 React에서는 변경될 수 있는 입력값을 컴포넌트의 state로 관리 1.onChange 내용 변화를 감지 input에 글자를 입력하

라우트로 사용된 컴포넌트에 match, location 과 함께 전달되는 props 중 하나리액트에서 페이지를 이동할 수 있는 이유는 react-router-dom을 이용하여 페이지 기록을 알 수 있기 때문인데,라우터는 path를 이용해 컴포넌트를 지정하면서 해당 컴포

서버에게 별다른 요청을 보내지않고 클라이언트의 브라우저 단에서 여러 페이지를 왔다갔다 방문할 수 있는 기능현재 URI에 맞는 UI를 렌더링 할 수 있어야함페이지 리로드 없이 다른 페이지를 방문할 수 있는 기능이 있어야함사용자의 액션(앞으로가기 , 뒤로가기) URL이 변

배열 항목 추가 홈페이지에서 이름을 작성하고 내용을 작성하고 이것을 등록하려고 할 경우, 엔터를 눌렀을 때 해당 내용이 화면에 보여져야할 경우 사용된다. 처음 만들 때 push를 작성해서 배열에 추가할려고했지만 , 리액트의 특성상 useState를 쓸 경우 push,

리액트에서 onClick 이나 onChange라는 이벤트를 넣어주고 그안에 함수를 넣을 때어떤 때는 그냥 함수 이름만와도 됐었는데 어떤 때는 () => 를 넣어주고 함수를 뒤에 넣어준다.둘다 실행했을 때 별 차이가 없어보이는데 어떤 차이가 있는지 알아보았다.()=> 가

State 끌어올리기 상태 끌어올리기, 리액트는 단방향 데이터 흐름이라는 원칙에 따라, 하위 컴포넌트에서 상위컴포넌트로 갈 수 없습니다. 하지만 상위 컴포넌트의 '상태를 변경하는 함수' 그 자체를 하위컴포넌트에 전달하여 , 이 함수를 하위컴포넌트에서 실행 하여 해결합니

리액트 컴포넌트가 렌더링 될 때마다 특정 작업을 실행할 수 있도록하는 hook이다.useEffect(function, deps)function : 렌더링 이후 실행할 함수deps : 특정한 값이 변경될 때, effect함수를 실행하고 싶을 경우 배열안에 그 값을 넣어줌

이전까지 리액트에서 css를 적용시킬 경우, 따로 페이지를 만들어 거기에 모든 css 코드를 작성해 적용시켰다. 이 방식의 경우 단점은 간결하게 쓰기 시작해도 class가 많아질수록 너무 길어지고, 중복될 경우 같은게 적용될 수도 있고...쉽게 말해 일목요연하지가 않

모달 창 (Modal window) 스프린트 중에 모달 이라는 게 나왔는데, 이 이상한 어감의 단어는 무엇인지 궁금해졌습니다. 영어 사전에 치면 1.양식의 2.형태상의 3. 법의 ..이런 식으로 쓰이는데, 아무래도 실제 용도와 전혀 상관 없는 듯 합니다. Modal

\\Redux is a predictable state container for JavaScript apps공식 문서에서는 '리덕스는 자바스크립트 앱에 예측 가능한 상태 컨테이너'라고 말합니다.리액트의 state를 관리하기 위한 라이브러리 입니다.리액트를 사용하다보면

리액트에서 리덕트로 넘어가기전, state관리, props drilling에 대해 적용하다가보니 넘어가지 않는 부분이 생겼습니다.state 값을 변경하는 가운데, state를 여러개 입력하게 되었고 값이 넘어가지않아 이 문제에 대해 찾아보니 이를 state batch

redux-thunk는 리액트에서 비동기 작업을 처리할 때 사용하는 미들웨어 입니다.미들웨어는 앞에서 잠시 보았듯이 리듀서가 액션을 처리하기 전에 실행되는 함수 입니다. 액션에서 리듀서로 바로 넘어가도 되지만 그러지않는 이유는디버깅 목적예외를 서버로 전송하는 목적액션

redux-thunk를 정리하고나서 sprnit를 풀려고하니 하나도 감이 잡히지않았습니다. 어찌저찌 풀긴했는데, 하나로 연결되지않아서 정리하면서 redux-thunk를 다시한 번 정리해볼려고합니다.redux-thunk가 설치되어있습니다.redux-thunk를 확인하기

reducer는 상태관리를 보다 원할하게 하기위한 라이브러리입니다. 하지만 이 리덕스를 처음 마주치게 된다면 엄청 복잡하게 느껴질 것입니다. 액션 객체를 만들고, 액션 생성함수를 만들고 리듀서 함수를 만들고.. 일일히 해야될께 많습니다.이러한 과정을 어느정도 보완해주기