SIMPLE & UNIQUE

3_1 목표 : 정합성 높은 데이터를 DB에 Insert 한다. 이미지 및 파일 업로드를 구현하고 흐름을 이해한다. 2회차 2강에서 text 데이터 삽입을 구현했다. 3회차 1강에서는 이미지와 파일을 node 경로에 업로드하고, 파일명만 text로 DB table에 저장할 것이다. 1. 등록페이지 react 파일을 수정한다. AdminSoftwareView.js 파일에 아래 소스를 붙여넣는다. state에 업로드 관련 변수가 추가되었고, 메뉴얼 파일과 메인/라벨 이미지를 선택하는 순간 node 서버의 파일 upload api를 호출하는 코드가 추가됐다. import React, { Component } from 'react'; import {Link} from 'react-router-dom'; impo..

2_2 목표 : AWS가입(결제카드입력), RDS t2.micro(1년 프리티어) 인스턴스를 세팅하고, workbench에서 필요한 테이블 생성과 더미데이터 삽입을 한다. 등록페이지를 구현한다. 2회차 2강에는 각자 AWS 계정을 만들고 RDS mysql 서버를 프리티어(1년무료) 버전으로 인스턴스를 생성한다. 그리고 테이블을 생성해 2_1강에서 설저한 node 소스에 host url와 계정 정보를 바꿔준다. 정상적으로 DB연결이 되는지 확인한다. 1. AWS 계정 생성은 aws 공식 홈페이지 가이드를 참고한다. 아래 링크를 참고해 가입하고, 결제수단을 등록한다. https://aws.amazon.com/ko/premiumsupport/knowledge-center/create-and-activate-a..

2_1 목표 : 이미 테이블이 세팅되어 있는 mysql 서버에서 데이터를 select 하고, react 페이지에 리스트로 노출시킨다. 다음 2회차 2강에서 각자 AWS 계정을 만들고 RDS mysql 서버를 프리티어(1년무료) 버전으로 인스턴스를 생성한다. 그리고 테이블을 생성해 더미 데이터를 삽입할 것이다. 2회차 1강에서는 이미 세팅이 완료된 작성자의 DB 서버에 접속해 실습한다. App.js에서 1회차에서 SoftwareTool 관련 부분을 주석처리해 놨었는데, 아래와 같이 주석을 해제한다. import React, { Component } from 'react'; import { Router, Route, Switch } from "react-router"; import Api_test from ..

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/ 설치확..

강의 목표는 react.js로 프론트엔드를, node.js로 백엔드 서버를 구현하고 AWS EC2인스턴스에 프로젝트를 배포하는 것이다. DB는 Mysql을 사용할 것이고, DB서버는 AWS RDS를 사용할 것이다. 개발환경은 윈도우 10 기준으로 작성하였다. 대략적인 목차는 아래와 같다. 1회차 1시간 : OT 2시간 : node 설치, create react app설치, node express 설치, 디렉터리 구조 설정 3시간 : 프록시 설정, get 방식, post 방식으로 react에서 node 서버의 json 데이터를 가져온다. 2회차 1시간 : 제공받은 html, css, img 파일로 react 페이지를 세팅한다. home 화면 정상 동작 확인. 2시간 : Mysql RDS 서버에 개인 스키마..