인프런 업데이트 소식 🔨👷🏼‍♂️
React & Express 를 이용한 웹 어플리케이션 개발하기

React & Express 를 이용한 웹 어플리케이션 개발하기

(65개의 수강평)

9116명의 수강생

무료

평생
중급
38회 수업, 총 6시간 0분
배지원 프로필

react app과의 port 혼용 배지원 17일 전

기존에 react app 웹서버 포트가 3000이었다면 express도 동일한 포트에 열어서 사용하는건지, 따로 포트를 열어줘야 하는건지 헷갈립니다ㅠㅠ

0
추민재 프로필

Atom으로 예제를 따라하고 있는데 브라우저에 아무것도 나오질 않습니다. 추민재 3달 전

어떤 부분이 잘못된건 가요??

0
DAEHO LEE 프로필

여러개의 smart 컴포넌트를 만들어서 connect할 수 있는건가요? DAEHO LEE 8달 전

여러개의 smart 컴포넌트를 만들어서 connect 할 수 있는건가요?

샘플에서는 Counter에만 connect되어 있는데, 여러개의 smart 컴포넌트를 만든 후 connect 할 수 있는지 궁금하고 그럴 경우의 reducer의 구현 방법이 궁금합니다. ㅎㅎㅎ

0
chul kim 프로필

React-hot-loader 가 제대로 동작하지 않아요.. chul kim 2018.07.05

수정한 내용만 update 되는게 아니라 전체 페이지가 리로드 되네요...

해결하신 분 계실까요?

1
chul kim 프로필

요새 이 강의를 보시는 분께..webpack.config.js에 관해서 chul kim 2018.07.21

저는 이 강의대로 진행하고 npm run dev-server 명령어를 치면 에러가 발생했었습니다.

이런 경우에는 npm install webpack-cli --save 를 해주시고

webpack.config.js 에서 module 안에 loaders 를 rules 로 변경해주시면 정상적으로 실행이 가능합니다.

도움이 되셨으면 좋겠습니다.

감사합니다.

4
^ㅁ^ 프로필

두가지의 차이점..? ^ㅁ^ 2018.06.18

아래 이성용님이 알려주신것처럼

  1. npm install -g create-react-app
  2. create-react-app hello-react
  3. cd hello-react
  4. yarn start

    이렇게 리액트 공홈에서 알려주는 방법으로 실행을 하는것과

    벨로퍼트님이 알려주시는것의 차이가 뭔가요?

    그리고 닷홈같은 서버호스팅업체에 연결해서 홈페이지 만드는데에는 두가지 방법으로 만들어도 다 연결가능한건가요?

0
최다은 프로필

this.state.keyword 최다은 2018.05.03

... indexOf(this.state.keyword) > -1;

input창에 입력을 했을 때
console.log(e.target.value)
console.log(this.state.keyword)를 비교해보니
this.state.keyword값이 e.target.value 값 보다 한발짝 늦게 update,되더라구요.
제가 a를 쳤을 때 e.target.value는 a이지만 this.state.keyword는 공백으로 나오는데
이때 어떻게 data.filter( 함수) 에서 indexOf(this.state.keyword) > -1; 이 제대로 동작을 하는 건지 궁금합니다.

0
K 프로필

Uncaught TypeError: Cannot read property 'func' of undefined 에러ㅜㅜ K 2018.06.12

강의 재밌게 잘 보고있습니다!

다름이 아니라 에러가 하나 안잡히는 것이 있는데요.

'Contact 데이터 추가기능 구현 | 컴포넌트 응용' 수업 부분에

Uncaught TypeError: Cannot read property 'func' of undefined

이 에러rk 저는 도저히 안잡히는데요...

  1. npm install --save prop-types
  2. import PropTypes from 'prop-types'; (ContactCreate.js)

    이 두단계를 모두 진행했는데 여전히 같은 에러가 뜹니다... 구글링을 계속 해봐도 같은 답변 뿐이어서 답이 없네요 ㅠㅠ

1
qweer das 프로필

빈 화면만 뜨고 콘솔에 404 Not Found 에러… qweer das 2018.04.22

안녕하세요!! 강의 잘 따라가다가 갑자기 막히네요ㅠㅠ (섹션 3. React 프로젝트 만들기)

정말 모든 코드를 똑같이 따라하고 webpack4에서 dev-server 돌릴 때 안된다는 것들 고친 것만 빼면 똑같은데,(loaders->rules, babel->babel-loader.. 등...)

계속 빈 화면만 뜨고 콘솔에 GET이 Not Found로 인해 실패했다는 오류만 뜨네요...

밑에는

Refused to execute script from ' http://localhost:4000/bundle.js' because its MIME type ('text/html') is not executable, and strict MIME type checking is enabled.

이러한 오류가 뜨는데

아무릭 구글링을 하고 다 고쳐봐도 해결책이 나오지 않아 질문 올립니다... 도대체 이것에 대한 해결책은 무엇인가요?????

0
Kyowon Im 프로필

감사합니다. Kyowon Im 2018.04.19

목소리도 강의 듣기 딱 좋네요.

0
김종현 프로필

webpack@4 부터 cli가 분리되어 따로 설치하라고 하는 관련 김종현 2018.03.16

말 그대로 webpack@4부터 webpack-cli 를 따로 설치하라고 뜹니다.

문제는 npm install webpack-cli를 통해 따로 설치하여도 여전히 webpack에서 cli를 찾지 못하는 문제가 발생하더군요.

도저히 빡쳐서 webpack@3으로 버젼을 낮추어서 설치를 했는데, 이렇게 하니까 또 babel이랑 안 맞다고 메시지가 ㅋㅋㅋㅋㅋㅋ

걍 zip 받아서 따라해버리긴 했는데, webpack@4용 cli 문제를 좀 보충해 주시면 안될까 싶어요... ㅠㅠ

1
Coding bear 프로필

PropTypes는 이제 react 에서 모듈이 따로 분리되어 있네요. Coding bear 2018.04.20

강좌를 따라하다 보니 React.PropTypes 에서 에러가 있어 React Docs을 보니 React v15.5부터 따로 prop-type 라이브러리로 분리되어 있군요.

코드팬에서 하려면 따로 스크립트파일을 불러 와야 겠네요.
<script src="https://unpkg.com/prop-types@15.6/prop-types.js"></script>

노드에서 작성시에는
npm i -S prop-types
로 인스톨 시키고

import PropTypes from 'prop-types'; // ES6
var PropTypes = require('prop-types'); // ES5 with npm

로 불러와

App.propTypes = {
    value: PropTypes.string,
    secondValue: PropTypes.number,
    thirdValue: PropTypes.any.isRequired
};

식으로 사용해야 되네요.

참조:
https://reactjs.org/docs/typechecking-with-proptypes.html#proptypes
https://www.npmjs.com/package/prop-types

2
호호깔깔 프로필

재밌다요.. 호호깔깔 2018.03.07

리액트 재밌다요

0
이춘길 프로필

npm webpack 설치시 Warning 사항인데… 이거 때문에 실행 안되는 것 같아요 이춘길 2018.03.16

npm WARN optional SKIPPING OPTIONAL DEPENDENCY: fsevents@1.1.3 (node_moduleswebpacknode_modulesfsevents): npm WARN notsup SKIPPING OPTIONAL DEPENDENCY: Unsupported platform for fsevents@1.1.3: wanted {"os":"darwin","arch":"any"} (current: {"os":"win32","arch":"x64"}) npm WARN optional SKIPPING OPTIONAL DEPENDENCY: fsevents@1.1.3 (node_moduleswebpack-dev-servernode_modulesfsevents): npm WARN notsup SKIPPING OPTIONAL DEPENDENCY: Unsupported platform for fsevents@1.1.3: wanted {"os":"darwin","arch":"any"} (current: {"os":"win32","arch":"x64"})

webpack cli를 설치하라는 Warn도 뜨고 여러가지 에러가 떠서

지금 다시 지웠다가 실행중인데, 위에 사양 관련 Warning이 관련이 있을까요?

1
Rex Studio 프로필

ContactCreate를 Contact.js로 import하려 하자 에러가 뜹니다. Rex Studio 2017.10.29
Uncaught TypeError: Super expression must either be null or a function, not undefined 위의 에러가 뜹니다만 뭐가 문제일까요..

2