개발자를 향해...

#29 로그인 페이지 (1) 간단한 폼 부분을 작성하자. 로그인 값을 서버에게 전달해야한다. types.js 파일에 모든 타입을 저장하고 가져와서 쓸 수 있도록 한다. export const LOGIN_USER = "login_user"; export const REGISTER_USER = "register_user"; export const AUTH_USER = "auth_user"; 그리고 user_action.js import { LOGIN_USER, REGISTER_USER, AUTH_USER } from '../_actions/types'; export default function (state = {}, action) { switch (action.type) { case LOGIN..

본 글은 John Ahn 님의 [노드 리액트 기초 강의]를 수강하며 작성하였습니다. #26 Redux 기초 Redux는 상태 관리 라이브러리이다. state 컨테이너라고 하는데 state는 props와 비교할 수 있다. props는 부모 컨포넌트에 자식 컨포넌트가 들어갈 때 즉 컴포넌트 간에 소통할 때 props를 이용해야한다. 그리고 props는 부모가 자식에게만 보낼 수 있다. 이렇게 전달한 props는 값을 바꿀 수 없다. 값을 바꾸기 위해서는 부모 컨포넌트가 다른 값을 전달하는 방법밖에 없다. state는 컴포넌트 안에서 데이터를 전달할 때 사용한다. props와는 다르게 값을 바꿀 수 있다. state의 값이 변할 때마다 리렌더링 된다. state는 다음과 같이 사용될 수 있다. state={ ..

본 글은 John Ahn 님의 [노드 리액트 기초 강의]를 수강하며 작성하였습니다. #23 Proxy Server ? proxy 서버를 통해 유저가 뭔가 보내면 여기서 여러 활동을 할 수 있다. 예를 들어 ip나 중요한 데이터들을 서버가 알아볼 수 없게 바꾸거나 방화벽 기능을 할 수 도 있고 필터 기능을 할 수도 있다. 또한 static한 이미지를 프록시에 저장해 굳이 인터넷까지 가지 않아도 proxy에서 데이터를 가져올 수 있다. 그리고 원하지 않는 유저의 접근을 막을 수 있다. #24 Concurrently Concurrently를 이용해 백서버와 프론트 서버를 한번에 켜보자. 우선 라이브러리를 다운받기 위해 npm i concurrently 를 터미널에 실행해주자. 그리고 루트 디렉토리의 packa..

본 글은 John Ahn 님의 [노드 리액트 기초 강의]를 수강하며 작성하였습니다. #19 CRA to Our Boilerplate src 하위에 위와같이 폴더와 파일들을 생성해준다. 생성해준 .js파일들에는 다음과 같은 형식의 코드를 작성한다. import React from 'react' function Registerage(){ return( Registerage ) } export default RegisterPage; #20 React Router Dom npm i react-router-dom을 설치해준다. reactrouter.com/web/example/basic 여기에서 import { BrowserRouter as Router, Switch, Route, Link } from "reac..