SIMPLE & UNIQUE

1. create-react-app 으로 프로젝트를 만들면 아래와 같은 디렉터리 구조가 생성된다. 로컬에서 http://localhost:3000/ 로 접속했을때, 개발한 화면이 보이는 상태면 된다. (이미지는 아래 더보기 버튼) 더보기 2. AWS 계정을 생성한다. 아래 AWS에서 제공해주는 한국어 가이드를 참고한다. https://aws.amazon.com/ko/premiumsupport/knowledge-center/create-and-activate-aws-account/ 3. EC2 인스턴스 생성 EC@ 대시보드에서 인스턴스 시작 클릭 4. ubuntu Server 16.04 선택 단계1 : ubuntu Server 16.04 선택 (이미지는 아래 더보기 버튼) 더보기 5. t2.micro 선택..

Error: Invariant failed: You should not use outside a 소스 변경점이 없는데 위와 같은 React 오류가 난다면 yarn upgrade를 해주면 해결된다. yarn upgrade 만약에 react 경로에 아래 명령어를 실행하고 난 오류라면 npm install sweetalert2 다른 상황에 따라 해결방법이 다르겠지만 yarn 명령어로 다시 설치해주니 해결됬다. npm uninstall sweetalert2 yarn add sweetalert2

connection pool(CP)의 정의는 '소프트웨어 공학에서 데이터베이스로의 추가 요청이 필요할 때 연결을 재사용할 수 있도록 관리되는 데이터베이스 연결의 캐시'이다. 사이트에 사용자가 접속하면 백엔드 서버에서 db 서버에 접속해 query를 실행하게 된다. 이때마다, (예를들어) nodeserver와 mysql server을 연결하고 query 수행이 끝나면 연결을 끊는 작업을 한다. CP를 사용하면 이러한 연결/연결끊기의 과정을 최소한으로 줄일 수 있기 때문에, 연결에 소요되는 시간과 사용되는 서버 자원을 아낄 수 있다. node 서버를 AWS EC2 t2.micro를 사용한다고 가정하면, 동시간에 허용된 connection max값은 66개이다. mysql에서 아래 쿼리를 실행해보면 해당 DB..

1_3 목표 : 공통영역(header, footer)을 별도로 구현하고, header와 footer 사이에 라우팅된 페이지를 노출시킨다. 1. css, img 폴더를 세팅한다. react 경로 C:\Users\ljung\OneDrive\문서\taling0102\client\src에 제공받은 폴더경로\index에 위치한 css, img 폴더를 복사+붙여넣는다. 2. App.js 파일에 css와 header, footer 파일을 import한다. App.js 파일을 아래와 같이 수정한다. import React, { Component } from 'react'; import { Router, Route, Switch } from "react-router"; import Api_test from './Api_..

1_2 목표 : create-react-app으로 react 서버를, express로 node 서버를 각각 구동한다. Proxy를 설정한다. react페이지에서 get/post 방식으로 api를 호출해, node 서버의 json 데이터를 가져온다. 1. node.js 설치 nodejs 공식 사이트에서 최신버전(2019.12.13 기준 13.5.0)이 아닌 이전 버전(12.8.0)을 설치한다. ** 12.8.0 버전은 2019년 8월 버전으로 현재까지 개발하면서 안정적이라고 판단. 아래 링크에서 윈도우(64비트)는 node-v12.8.0-x64.msi 파일을 Mac은 node-v12.8.0.pkg 파일을 다운로드 한다. https://nodejs.org/download/release/v12.8.0/ 설치확..

이전 회사에서는 Spring 프레임 워크에서 서버 Session에 로그인 정보를 세팅하여 사용했다. 보통 javax.servlet.http 패키지의 HttpSession 인터페이스를 구현해서 사용한다. session.setAttribute("id", "value");//세션 setting session.getAttribute("id");//세션 read session.removeAttribute("id");//세션 remove 서버 session을 사용하는 것이 cookie를 사용하는 것보다 보안측면에서 강력하다.(브라우저상에 노출되지 않는다.) node/react 서버에서는 방어로직을 함께 구현하여 cookie를 사용하였다. 구현 방식은 아래와 같다. 1. 로그인 1-1) 입력받은 id/pw를 DB값과..