React50 [React] express 를 이용하여 서버사이드렌더링 - 떽떽대는 개발공부 오늘은 front-end(Client) 와 back-end(Server) 를 분리하여 편리하게 개발하기 위해 서버사이드렌더링을 해 보았다. 먼저 express 를 install 한다. npm install express --save 서버 사이드 렌더링의 경우 Cross-Origin Resource Sharing(CORS) 오류가 발생하는데, 이를 해결을 위해 cors 를 install 한다. npm install cors --save Client와 Server 사이의 중계기 역할인 프록시(Proxy) 사용을 위해 http-proxy-middleware'를 install 한다. npm install http-proxy-middleware --save 이제, 아래와 같이 server, routes 디렉토리를.. 2021. 1. 23. [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] props 전달받기 예제 - 떽떽대는 개발공부 react 를 공부하는데 있어 props 값이 기본이지만 이해하는데 어려움이 있었다. 이번엔 컴포넌트 3개를 이용하여 container, input, result 각각 작성하여 props 값 넘기기 예제를 작성해 보았다. 먼저, 아래와 같이 컴포넌트 3개를 작성한다. src/BoardContainer.js import React from 'react'; import BoardInput from '@BoardNew/BoardInput' import BoardResult from '@BoardNew/BoardResult' function BoardContainer() { return( ) } export default BoardContainer; src/BoardInput.js import React fro.. 2021. 1. 21. [React] input 데이터 수정 - 떽떽대는 개발공부 2021/01/19 - [React] - [React] react, redux 를 사용하여 게시판 만들기 - 떽떽대는 개발공부 [React] react, redux 를 사용하여 게시판 만들기 - 떽떽대는 개발공부 본격적인 리액트 공부를 하기 위해 구글링을 하다 아래의 블로그에서 게시판 만드는 것을 따라 해 보았다. mjn5027.tistory.com/35 [ React ] 리액트 Redux 로 게시판 만들어보기 이번 포스팅에선 리덕스를 ddeck.tistory.com 이전 글에서 게시판을 만들어 보았으나 게시판 구현 중 글 작성 부분에 미흡한 부분이 있었다. input 값이 변동될 때마다 prop 으로 받는 inputData를 바꿔주기 위해 밖으로 데이터를 뺐기 때문.. 그 부분은 아래와 같이 수정하여 .. 2021. 1. 20. 이전 1 ··· 6 7 8 9 10 11 12 13 다음
