Mason

API 란? API란 Aplication Programming Interface의 약자로 어플리캐이션들이나 다른 장치들간의 통신을 위한 규칙을 정하는 것이며 웹 API는 클라이언트와 제공되는 리소스와의 게이트웨이라 할수있다. REST 란? REST(Representational State Transfer)는 높은 유연성과 자율성을 가진 아키텍처 중에 하나이다. 쉽게 말해 여러 스타일의 아키텍처들이 있지만 위의 장점들로 인해 쉽게 사용이 가능하여 API를 만들때 가장 보편적으로 사용하게 되는 아키텍처 스타일 입니다. REST의 설계 원칙 Uniform interface : 하나의 URI에서의 리소스 요청의 결과는 출처와 관계없이 항상 같아야 한다. Client-server decoupling : 클라이언트..

기존의 아폴로 서버에서 파일 업로드를 하기 위해선 express를 설치해주어야한다. 기존의 아폴로 서버 import { ApolloServer, gql } from "apollo-server"; import schema from "./schema"; //typeDefs와 resolvers의 통합 const server = new ApolloServer({ schema, }); server.listen().then(({ url }) => { console.log(`🚀 Server ready at ${url}`); }); 기존의 아폴로 서버에서 npm을 이용하여 express와 graphql-upload를 설치 npm install apollo-server-express express graphql-uplo..

GraphQL이란? GraphQL이란 페이스북에서 제작한 API를 위한 쿼리 언어이다. GraphQL만의 특징으로는 사용자에게 전체 데이터가아닌 필요한 데이터만을 골라 제공할수있다. 또한 REST API와 다르게 단일 엔드포인트를 사용한다. 예를 들어 REST API의 경우 "example.com/home", "example.com/user"와 같이 URL의 엔드포인트를 이용하여 통신이 되지만 GraphQL의 경우 "example.com/graphql" 하나로 원하는 데이터를 가저올수 있다. npm install @apollo/server graphql 먼저 npm을 이용해 apollo와 graphql을 설치 server.js (index.js) import { ApolloServer, gql } fro..

Rest api 서버를 구축하고 프론트엔드에서 파일 전송을 요청해 보았다. 분명 로그를 확인했을땐 post request는 받았는데 파일은 오지 않았다. 검색을 해보니 express의 기본 기능에는 파일업로드 기능이 없어서였다. 그래서 multer라는 미들웨어와 파일을 로컬서버가 아닌 AWS-s3서버에 저장할것이기에 multer-s3도 같이 사용해보았다. npm install multer multer-s3 aws-sdk --save 일단 multer와 multer-s3 그리고 AWS-s3를 연결하기위해 aws-sdk를 설치 후 aws-sdk import aws from "aws-sdk"; const s3 = new aws.S3({ credentials: { accessKeyId: process.env.A..

타입스크립트와 객체 지향 프로그래밍을 이용하여 햄버거 매장에서의 kiosk 시스템을 만들어 보았다. 관리자 사이드와 소비자 사이드를 나누어 작성해주었으며 관리자가 제품을 등록하면 소비자가 등록된 제품중에서 골라 주문을 넣을수 있도록 코드를 짯다. 관리자 사이드 interface Menu { ref: number; // 등록된 제품들의 고유 id name: string; price: number; } class Register { private menu: Menu[] = []; static ref: number = 1; // 1부터 시작하여 제품마다 ref넘버를 순차적으로 부여 public addMenu(key: string, value: number) { const newMenu: Menu = { ref..

객체 지향 프로그래밍이란 이름 그대로 객체를 만드는데 최적화된 프로그래밍이다. 수십 수백개의 객체를 관리하는데 유용하다. 캡슐화 캡슐화란 데이터 혹은 함수를 캡슐안에 넣는것을 의미한다. 쉽게말해 class 안에 함수나 데이터들을 넣는 것이다. const player = { name: "Mason", power: 10, speed: 5, }; const calculateDPS = (power: number, speed: number) => { return power * speed; }; const masonDPS = calculateDPS(player.power, player.speed); console.log(masonDps); 게임에서 캐릭터 하나를 만든다고 가정했을때 player란 객체를 수동적으로 ..

Call signature 콜시그니처란 어떠한 함수의 타입을 정의하는 것이다. const functionA = (arg1:number,arg2:number):void => { console.log(arg1,arg2) } 콜시그니처를 사용하지 않을경우 함수의 타입을 정할때 위와 같이 함수마다 정의해주어야된다. 만약 콜시그니처를 사용한다면 type callSignature = { (arg1: number, arg2: number): void; }; const functionA: callSignature = (ar1, ar2) => { console.log(ar1, ar2); }; 위의 코드처럼 객체의 타입을 정의하듯이 함수의 타입을 정의해준후 필요한 함수에 사용하기만 하면 된다. Overloading typ..

타입스크립트란 마이크로소프트에서 만든 자바스크립트 기반의 typed programming language로 함수, 객체, 변수등 각각의 자료구조에 타입을 지정함으로써 자바스크립트의 런타임 오류를 미리 방지해 줄수있다. 기본타입 let a: number = 13 let b: string = "13" let c: boolean[]= [true] 위와같이 number, string, boolean으로 자료의 기본타입을 정해줄수 있으며 array의 경우 기본타입을 정해주고 대괄호 "[]"를 입력해주면 된다. 객체 const person:{name:string, age?:number} = { name:"Mason" } person.age = 14 객체의 경우 위와같이 중괄호와 함께 사용이가능하며 물음표 "?"를 ..

SQL문법을 배우면서 ORM을 사용하지않고 서버를 개설 해보고 싶어서 바로 Express 서버에 DB를 연결해서 사용해보았다. (Express 서버에 DB 및 session store 연결:https://mason-lee.tistory.com/12) dbModules.ts import { conn } from "./db"; module.exports = { createProduct: async (name: string, pictures: string, owner_id: string) => { await conn.query(`INSERT INTO product (name, pictures, owner_id) VALUES ('${name}', '${pictures}', '${owner_id}')`) cons..

사실 이전까지 DB는 Postgre와 Prisma orm만으로 공부를 하였다가 SQL문을 공부하면서 Mysql만으로 서버를 만들어보고 싶어서 직접 연결해 보았다. session 또한 그저 express session만을 이용해 보았는데 그러다보니 서버를 재부팅할시 session 정보가 리셋이 되서 mysql session store를 이용하여 DB에 저장해주어야됬다. 관련 라이브러리 설치 npm i dotenv --save npm i express-session --save npm i express-mysql-session --save npm i mysql2 --save 처음 mysql을 설치해주었는데 mysql은 promise를 반환하지않아 비동기작동이 되지않는다는것을 알게되었다. 검색끝에 promis..