수피의 느슨한 개발

클래스에서의 타입스크립트 class Person { name: string; age: number; constructor(name: string, age: number) { this.name = name; this.age = age; } sayHello() { console.log(`안녕하세요! 제 이름은 ${this.name}이고, 나이는 ${this.age}살입니다.`); } } const person = new Person('Spartan', 30); person.sayHello(); Person의 프로퍼티로 사용되는 name과 age이 constructor보다 상단에 위치하여 타입 지정이 되고 있다. 또한 Person이라는 클래스의 인스턴스를 생성할 때 필요한 name과 age 변수 즉 const..

Background 타입스크립트는 Microsoft에서 개발한 오픈 소스 프로그래밍 언어입니다. 이는 JavaScript의 단점을 보안하기 위해 등장했습니다. 자바스크립트의 주요 단점 자바스크립트는 코드가 실행되는 시점에서 변수의 타입이 결정됩니다. 그렇기 때문에 실행하기 전에는 타입으로 인한 오류 확인을 할 수 없었습니다. 이러한 현상이 만약 서비스 중 발생하게 된다면 서버는 곧장 다운될 수 있습니다. 위에서도 언급했지만 타입 체크에 어려움이 있습니다. 특정 프로그래밍 언어에서는 아예 모든 변수 지정 시 타입을 함께 지정하도록 하기도 하지만 자바스크립트는 그런 기능이 없기 때문에 자칫 잘못하면 특정 변수가 언제 Number에서 String타입으로 변경되었는지 파악하는데 오랜 시간이 소요되기도 합니다. ..

AWS 주요 서비스 훑어보기 해당 시기에 잘 몰랐던 내용을 위주로 정리했기 때문에 기존에 알고 있던 부분에 대해서 기록되어 있지 않습니다. IAM(Identity and Access Management) AWS에서 사용자, 그룹 및 역할을 생성하고 관리하여 리소스에 대한 엑세스를 안전하게 제어할 수 있는 기능입니다. IAM 주요 보안 기능 인증: AWS 리소스 엑세스 권한에 대한 인증 권한 부여: IAM 정책을 사용하여 사용자 또는 그룹을 대상으로 권한을 지정할 수 있습니다. 권한 검증: 각 권한에 대한 엑세스 요청에 대한 검증 기능을 의미합니다. USER, GROUP, POLICY USER: IAM 서비스를 통해 개인별 자격 증명 생성 및 엑세스 권한이 부여되는 단위를 의미합니다. GROUP: 다수를 ..

과제 내용 배민 앱과 같은 배달 서비스 홈페이지 구현 고객이 특정 음식점에서 메뉴를 주문하면 음식점 주인이 주문을 접수하는 방식 주요 구현 내용 고객 CRUD 사장 CRUD 음식점 CRUD 각 음식점의 메뉴 CRUD 주문내역 CRUD 음식점 검색 기능 Keep 프로젝트 시작 단계에서 폴더명과 파일명, 모델 migration 등 규칙이 필요한 부분을 사전에 정해두어서 대표 한 사람이 GitHub 레포지토리에 기본 틀로 정해둔 뒤 각자 맡은 역할을 수행한 점이 좋았다. (merge 시 conflict을 상당 수 방지할 수 있었습니다.) 와이어프레임을 Figma를 활용하여 기존에 작성했던 방식보다 더욱 디테일하게 틀을 잡아두고서 프로젝트를 시작했기에 시각적으로 어떤 페이지, 어떤 버튼이 구현되어야 하는지를 직..

AWS S3 bucket에 이미지 저장하기 📌 로컬 이미지 파일을 S3 버킷에 저장하는 기능입니다. AWS S3 버킷 생성 버킷 생성 과정에서 위 사진과 같은 설정이 필요합니다. 디폴트 설정이 아니므로 따로 저렇게 설정해야 합니다. 정확히 어떤 기능인지는 모르겠지만 뭔가 굉장히 보안적으로 취약하게 만드는 행위인 것 같아 보입니다. (조금 불안) 하지만 위와 같이 설정을 하지 않으면 당장 실습에서 파일이 업로드 되지 않습니다. 이 부분에 대해서는 자세히 공부할 필요가 있을 것 같습니다. 필요 패키지 설치 npm install aws-sdk npm install multer npm install multer-s3@2.10.0 여기서 주의할 점은 multer-s3의 버전을 지정해줘야 한다는 점입니다. 현재 날..

https://github.com/issuebombom/chat_page_mini Workflow 프론트에서 A 유저가 글을 보냅니다. 본인의 socket.id와 작성한 글을 'SEND' 이벤트명으로 백엔드에 emit합니다. 이 때 본인이 작성한 글은 채팅창에서 푸른 바탕을 지니며 오른쪽 정렬되어 보여집니다. 백엔드에서 'SEND' 이벤트를 받아 작성자(A)를 제외한 유저들을 대상으로 메시지와 socket.id 정보를 프론트에 전달합니다. 이 때 역시 'SEND'라는 동일한 이벤트명으로 전달합니다. 프론트에서 'SEND' 이벤트를 받은 A외 유저들은 본인의 채팅창에 A가 작성한 문구가 노란 바탕으로 나타나며 왼쪽정렬된 상태로 받아집니다. 본인이 작성한 문구 외 글들은 상단에 작성자의 socket.id가 ..

UUID 사용하기 UUID(범용 고유 식별자)는 테이블의 ID로 사용하는 식별자로 총 4개의 하이푼(-)으로 구분된 문자열로 구성되어 있다. 해당 식별자를 사용하는 가장 큰 장점은 전 세계적으로 중복값이 존재할 가능성이 극히 낮다는 점, 즉 고유성이 보장된다는 점 때문이다. 자세한 내용은 생략하고 UUID를 MySQL sequelize에 적용하는 방법에 대해서 살펴보자 // migration 'use strict'; /** @type {import('sequelize-cli').Migration} */ module.exports = { async up(queryInterface, Sequelize) { await queryInterface.createTable('RefreshTokens', { uuid:..

managed와 Unmanaged 트랜잭션 sequelize에서 Transaction는 어떻게 사용할 수 있는지 알아보자 sequelize에서 트랜잭션을 적용하는 방법은 크기 Managed 방식과 Unmanaged 방식으로 나뉜다. // Managed const { sequelize, User } = require('../models'); // 트랜잭션의 콜백으로 유저 생성 로직을 처리합니다 const result = await sequelize.transaction(async (t) => { const user = await User.create( { nickname: 'apple', age: 18, }, { transaction: t } // 해당 로직이 트랜잭션으로 묶여있음을 명시함 ); retur..

Transaction 트랜잭션(Transaction)은 하나의 쿼리(작업) 단위를 하나의 묶음으로서 처리하는 기능을 의미한다. 가령 통장 입출금 시스템의 경우 A가 B에게 1000원을 송금하는 작업을 1. A가 B에게 송금한다. 2. B의 잔액이 1000원 증가한다. 와 같은 작업이 이뤄져야 하는데 해당 작업이 알 수 없는 오류로 인해 중단된다면 A가 보낸 1000원이 증발할 수도 있다. 바로 이러한 현상을 방지하기 위해서 트랜잭션이 존재한다. Transaction의 특징 ACID Atomicity(원자성) - 여러 쿼리 명령들을 하나의 작업 단위로 취급하여, 내부 쿼리 명령들이 전부 성공하거나, 아니면 모두 실패해야한다는 특징이다. Consistency(일관성) - 트랜잭션 처리 과정에서 데이터의 일관..

Access Token | Refresh Token Access Token과 Refresh Token은 유저가 로그인 했을 때 발급되며 이후 해당 유저가 누구인지에 대해 인증하는 용도로 활용됩니다. 가령 마이페이지에 접속할 경우 본인이 누구인지에 따라 그에 맞는 마이페이지를 보여줘야 하므로 이럴 때 사용되곘죠?? workflow 로그인 시 엑세스 토큰 발급 + 리프레시 토큰 발급 (각각) 두 토큰 모두 쿠키로 전달하되 리프레시토큰은 DB에 {리프레시 토큰: userId} 형태로 저장 로그인 이후 물품 구매, 마이페이지 접속 등 본인이 누구인지 파악하기 위해 쿠키에 접근 쿠키에 두 토큰이 존재하는지 먼저 확인 try, catch문으로 엑세스 토큰과 리프레시 토큰 검증 결과를 boolean으로 받는다. (i..