본문 바로가기

react51

[React] react 에서 이미지 적용하기 - 떽떽대는 개발공부 오늘은 react 사용 시 이미지를 적용하는 법에 대해 공부 했다. webpack 공부할 때 왜 공부를 안하고 넘어갔는지.. 후회 했다ㅠ 먼저, file-loader 와 url-loader 를 install 해준다. npm i -D file-loader url-loader 그리고 webpack 에서 output 부분에 publicPath 를 넣어 주어야 한다. output: { filename: "bundle.js", path: path.resolve(__dirname + "/build"), publicPath: '/' }, 이후 webpack : module - roules 부분에 아래와 같이 추가한다. { test: /\.(png|jpg|gif)$/i, use: [ { loader: 'url-load.. 2021. 2. 15.
[React] react 에서 로그인 페이지 구현하기(3) - 떽떽대는 개발공부 2021/02/10 - [React] - [React] react 에서 로그인 페이지 구현하기(2) - 떽떽대는 개발공부 [React] react 에서 로그인 페이지 구현하기(2) - 떽떽대는 개발공부 2021/02/09 - [React] - [React] react 에서 로그인 페이지 구현하기 (1) - 떽떽대는 개발공부 [React] react 에서 로그인 페이지 구현하기 (1) - 떽떽대는 개발공부 오늘은 리액트를 이용하여 로그인 페이지를 ddeck.tistory.com 이전 글에서 input 란에 입력한 id 와 pw 를 MySQL 에 저장되어 있는 데이터와 비교하여 id 가 존재하는 지, 존재하다면 비밀번호는 일치하는 지 확인하여 결과값을 클라이언트로 전달받아 콘솔에 나타내는 것까지 해 보았다... 2021. 2. 11.
[React] react 에서 로그인 페이지 구현하기(2) - 떽떽대는 개발공부 2021/02/09 - [React] - [React] react 에서 로그인 페이지 구현하기 (1) - 떽떽대는 개발공부 [React] react 에서 로그인 페이지 구현하기 (1) - 떽떽대는 개발공부 오늘은 리액트를 이용하여 로그인 페이지를 구현 해보도록 하겠다. 먼저, 이전 글에서 공부했던 대로 webpack 을 이용하여 react app 을 생성 해주었다. React webpack 을 이용하여 개발 환경 구성하기 - d ddeck.tistory.com 이전 글에서 react 에서 로그인 페이지 구현하기1 을 포스팅 하였다. 이어서 구현 해보자. 먼저 MySQL 에서의 db 는 아래와 같다. 이제 Login.js 에서 onClickLogin 함수에서 axios 를 이용해 입력된 id 와 pw 를 .. 2021. 2. 10.
[React] react 에서 로그인 페이지 구현하기 (1) - 떽떽대는 개발공부 오늘은 리액트를 이용하여 로그인 페이지를 구현 해보도록 하겠다. 먼저, 이전 글에서 공부했던 대로 webpack 을 이용하여 react app 을 생성 해주었다. React webpack 을 이용하여 개발 환경 구성하기 - ddeck.tistory.com/16 [React] React webpack 을 이용하여 개발 환경 구성하기 - 떽떽대는 개발공부 2020/12/30 - [React] - [React] 프로젝트 생성하고 실행하기-떽떽대는 개발공부 [React] 프로젝트 생성하고 실행하기-떽떽대는 개발공부 리액트 프로젝트 생성 및 실행 방법 프로젝트 생성 프로젝트 생성 ddeck.tistory.com 파일 구조는 아래와 같다. 아래의 모듈 3개를 install 하였다. npm install axios .. 2021. 2. 9.