타입스크립트 맛보기 연습을 해보겠습니다! 우선 프로젝트 폴더하나 생성하고, package.json을 작성해볼까요 package.json { "name": "TypeScript", "version": "0.0.1", "main": "app.ts" } 타입스크립트로 만들 프로젝트니 main은 당연히 js가 아니라 ts파일이겠죠 app.ts를 파일을 생성하세요. 미리 필요한 내용을 작성해두겠습니다. import express from 'express'; import cors from 'cors'; const app = express(); app.use(cors()); app.use(express.json()); app.use(express.urlencoded({ extended: false })) app.li..
aws 인스턴스에 연결시켰던 putty를 킵니다. (인스턴스가 없다면 https://daily-coding-diary.tistory.com/5 이 페이지를 참고하여 생성하세요.) 이제 깃에 올려두었던 내 프로젝트를 clone해서 받아올겁니다~! git clone [나의 깃 프로젝트 Url] 을 합니다. 프로젝트는 복사되었지만 모듈은 따로 설치해주야겠죠? 제 프로젝트는 node를 기반으로 진행한 프로젝트이기 때문에 node도 설치해주어야 합니다. $ sudo apt update 우선 우분투를 업그레이드 해줍니다. $ sudo apt install nodejs nodejs를 다운받습니다. 중간에 yes, no 나오면 y눌러서 마저 다운받으세요. $ nodejs -v 버전을 확인해서 잘 설치됐는지 확인합니다...
시퀄라이즈를 쓰는 이유는 자바스크립트 구문을 알아서 SQL로 바꿔주기 때문입니다. 따라서 SQL 언어를 직접 사용하지 않아도 자바스크립트만으로 MySQL을 조작할 수 있습니다. 시퀄라이즈를 사용해봅시다. 시퀄라이즈를 이용하면 js로 테이블을 만들 수 있습니다. 프로젝트와 함께 테이블 정보를 저장할 수 있어서 유용하겠죠. 그리고 시퀄라이즈 구문이 sql구문보다 사용하기가 간단해서 편리합니다. 시퀄라이즈를 사용하려면 설치해야겠죠. 서버에 시퀄라이즈를 설치합니다. $ npm i sequelize 설치가 완료되었으면, MyTodoList에 model 폴더를 생성합니다. 1. index.js 작성 시퀄라이즈를 사용하기 위해 index.js 파일을 만들어서 import 시킵니다. const fs = require(..
마지막에 css를 제공할 예정이니, 각 태그들의 클래스명은 되도록 똑같이 따라하시길 바랍니다. 1. 설치하기 리액트를 만들기 위해 터미널에서 + 버튼을 눌러 새 터미널을 만듭니다. 경로가 MyTodoList에 있는지 잘 확인한 후, 아래 내용을 입력해서 리액트를 설치합니다. $ npx create-react-app client cd client npm start 경로를 클라이언트로 바꾸고 리액트를 실행시켜봅시다. 이 화면이 나온다면 성공입니다. 우선 서버와 클라이언트를 연결해줘야 합니다. 기존의 package.json이 아닌 클라이언트 안에 있는 package.json에 접근해서, "proxy": "http://localhost:8080" 이 항목을 추가합니다. 2. 파일 수정 및 정리 client>sr..
로컬환경에 있는 서버를 aws서버에 연동시켜보도록 하겠습니다. 기본적으로 RDS(데이터베이스)세팅과 Git연동까지 진행했다는 전제하에 진행하겠습니다. https://ap-northeast-2.console.aws.amazon.com/console/home?nc2=h_ct&src=header-signin®ion=ap-northeast-2 https://ap-northeast-2.console.aws.amazon.com/console/home?nc2=h_ct&src=header-signin®ion=ap-northeast-2 ap-northeast-2.console.aws.amazon.com aws 관리 콘솔에 접속하신 후, EC2를 클릭합니다. EC2카테고리에서 인스턴스를 클릭 후 , 인스턴스 시작을 ..
우선 연습하다 발생한 log들을 저장하기 위해 morgan 모듈을 설치하여 app,js에 이와같이 선언해주었습니다. const logger = require('morgan') app.use(logger('dev')); artillery 모듈은 가상으로 사용자 수를 지정하여 서버에 과부하가 걸리는지 테스트합니다. artillery 모듈을 설치하고 cpu-test.yaml 파일을 생성하여 이와 같이 작성했습니다. config: target: "http://localhost:8080" # host phases: - duration: 30 # 해당 초만큼 실행 arrivalRate: 3000 # 가상 사용자 수 scenarios: - flow: - get: url: "/user" # setParam에서 넣은 I..
"Representational State Transfer” 의 약자 REST 는 네트워크 아키텍처 원리의 모음이다. 여기서 '네트워크 아키텍처 원리'란 자원을 정의하고 자원에 대한 주소를 지정하는 방법 전반을 일컫는다. 간단한 의미로는, 웹 상의 자료를 HTTP 위에서 SOAP이나 쿠키를 통한 세션 트랙킹 같은 별도의 전송 계층 없이 전송하기 위한 아주 간단한 인터페이스를 말한다. 출처: 위키백과 1. Postman을 사용하여 통신 확인 app.js에 작성해두었던 //익스프레스가 지원해주는 restAPI app.get('/', function (req, res) { res.send('Hello World') }) 이 부분도 rest api에 해당하는 영역입니다. 여기서 app은 express모듈을 사용..
