본문 바로가기

Redux7

[React] react-router-dom, redux 를 이용한 페이지 이동 - 떽떽대는 개발공부 오늘은 그동안 공부했던 것을 바탕으로 react-router-dom 과 redux 를 이용한 페이지 구현하는 부분을 포스팅 해보겠다. 원레는 게시판을 만들어보려고 했는데 오늘은 이 부분 구현하는 데 시간을 많이 소요했다.ㅎ.ㅎ 위와 같이 Write 버튼 클릭 시 글 작성 페이지로 이동되며, footer 부분의 버튼 중 Write 버튼이 사라지게 되는 부분이다. 먼저 디렉토리는 아래와 같다. 먼저, redux 를 사용하기 위해 index.js 에서 store 를 생성하고, Provider 로 App.js 를 감싸준다. src/index.js import React from 'react'; import ReactDOM from 'react-dom'; import { Provider } from 'react-.. 2021. 1. 24.
[React] redux 를 이용한 예제 - 떽떽대는 개발공부 2021/01/21 - [React] - [React] props 전달받기 예제 - 떽떽대는 개발공부 [React] props 전달받기 예제 - 떽떽대는 개발공부 react 를 공부하는데 있어 props 값이 기본이지만 이해하는데 어려움이 있었다. 이번엔 컴포넌트 3개를 이용하여 container, input, result 각각 작성하여 props 값 넘기기 예제를 작성해 보았다. 먼저, 아래 ddeck.tistory.com 이전 글에서 props 를 이용하여 예제를 만들어 보았다. 동일한 예제를 props 가 아닌 redux - store 를 사용하여 만들어 보았다. npm install redux react-redux 먼저, store 를 사용하기 위해 index.js 에 store 를 만들어 준다... 2021. 1. 22.
[React] react, redux 를 사용하여 게시판 만들기 - 떽떽대는 개발공부 본격적인 리액트 공부를 하기 위해 구글링을 하다 아래의 블로그에서 게시판 만드는 것을 따라 해 보았다. mjn5027.tistory.com/35 [ React ] 리액트 Redux 로 게시판 만들어보기 이번 포스팅에선 리덕스를 이용해 게시판의 기본적인 Create, Read, Update, Delete 구현을 다룬다. ​ 공부하며 간단히 만들어본거라 설명이 미약한 점 참고해주시길. ​ 먼저 프로젝트를 만들고 리덕 mjn5027.tistory.com 이해가 될듯 말듯 알쏭달쏭한 상태에서 router 를 이용하여 페이지 이동할 수 있는 기능을 추가 구현해 볼까 한다. redux 관련 부분은 상기의 페이지에서 확인하면 될 것이다. 이번 글에서는 router 사용을 중점으로 했다. 내가 공부했던 Router 글.. 2021. 1. 19.