Code Gear - AI 개발 유튜브 강의

Dart로 첫 번째 프로그램을 만들고 실행하는 법에 대해 알아보겠습니다.
에디터는 Visual Studio Code(VSCode)를 사용합니다.
 

Flutter Extention 설치

VSCode에 Flutter extention을 설치합니다. Flutter extention을 설치하면 Dart도 같이 설치가 됩니다.
https://marketplace.visualstudio.com/items?itemName=Dart-Code.flutter

Dart Project 생성

VSCode에서 Command Pallete를 실행합니다.
VSCode의 메뉴에서 "보기-명령 팔레트"를 선택하거나, 단축키 Command+Shift+P를 누릅니다.

Command Pallete에 "Dart"를 입력합니다.

다음 화면에서 "Cosole Application"을 선택합니다.

다음 화면에서 프로젝트 폴더명을 입력 합니다.
저는 "dart_first_app"라는 폴더명을 사용했습니다.

입력 후 "Select a folder to create the projec in"을 클릭합니다.

폴더 생성 후 프로젝트 명을 입력합니다.
저는 "dart_first_app"이라고 입력하였습니다.

이제 첫번째 프로젝트가 완성되고 아래와 같은 화면이 나옵니다.

Dart 프로젝트 실행

프로젝트 우측 상단의 실행 버튼을 클릭합니다.

프로젝트가 정상적으로 실행되면 아래와 같이 "Hello World" 로그가 나옵니다.

 
이렇게 Dart 첫번째 프로젝트가 완료되었습니다.

Flutter의 개발 언어로 잘 알려진 Dart에 대해 알아보겠습니다.

이 글은 dart 의 공식 홈페이지를 참조하여 작성 하였습니다.

https://dart.dev/

Dart 의 장점

아래는 Dart 공식 홈페이지에 가면 가장 먼저 보이는 배너입니다.

"Instant hot reload" 라는 것을 강조하고 있습니다.

이것은 프로그램을 개발 할 때 코드가 변경되는 즉시 반영이 된다는 뜻입니다.

컴파일과 빌드를 요구하는 다른 언어들은 전체 코드를 빌드하는데 일정 시간이 소요됩니다.

개발시 UI 관련 코드를 변경하고 바로 확인할 수 있다는 것은 큰 장점입니다.

• 개발 효율의 증가 - 시간 단축
• 빠른 피드백 - 테스트나 디버깅에 유리

다른 장점들에 대해서도 설명하고 있습니다.

• Approachable
  • 친숙한 언어이다 - 다른 언어에서 사용한 문법과 유사한 형태를 가지고 있어 언어에 쉽게 접근할 수 있습니다.
  • 강력한 Type 언어이다 - 명확한 type 정의를 사용하여 사전에 오류를 막을 수 있습니다.
  • NULL Safe 언어이다 - 변수에 null을 할당할 수 없습니다. 따라서 실행 중 null point exception과 같은 오류에서 자유로워질 수 있습니다.
• Productive development
  • Dart는 개발 생산성을 높여주는 언어입니다.
  • Hot reload를 제공하여 개발 속도를 높이고, 빠르게 실험해 볼 수 있습니다.
  • 여러 Editor와 통합 환경을 제공함으로 개발 편의성을 높였습니다.
• Portable and fast on all platforms
  • 여러 platform에서 동일한 코드로 실행되는 언어입니다.
  • iOS, Android 같은 모바일 환경 뿐만 아니라, desktop, web, server등의 다양한 환경에서 작동 가능합니다.

Dart의 단점

• Native App과 똑같지는 않습니다. 즉 iOS, Android 등 Native 가 가지고 있는 고유한 형태의 app 보다는 범용적인 형태의 app 개발에 유리합니다.
• 개발 생태계가 크지 않습니다. 다른 성숙한 언어들에 비해 커뮤니티, 오픈소스, 플러그인 등이 많지 않습니다.
• 브라우저에서 개발시 transpile 해야 하므로 성능이나 디버깅에 제한이 있을 수 있습니다.

결론

• Flutter와의 통합으로 크로스플랫폼 개발을 할 수 있습니다. 복잡한 기능이 아니라면 적은 비용으로 iOS, Android용 앱을 모두 개발 할 수 있습니다.
• 간결한 문법으로 쉽게 접근이 가능하고, 다양한 Editor를 사용할 수 있습니다. 복잡하지 않은 기능의 앱을 빠르게 개발 하고자 한다면 Dart를 사용해 보는 것도 좋은 선택지가 될 것 같습니다.

Flutter 개발 환경 설정에 대해 알아봅니다.

이 글은 Flutter 공식 홈페이지의 Get Started 문서를 참조하였습니다.

https://docs.flutter.dev/get-started/install

플랫폼 선택

환경에 맞게 선택하시면 됩니다.
저는 맥을 선택하였습니다.

Type of app

다음으로는 어떤 종류의 앱을 만들 것인지를 선택해야 합니다.

저는 iOS를 선택하였습니다.

Software 설치

• Apple Sillicon을 사용하는 Mac일 경우 Rosetta 2 translation process를 설치해야 합니다.
  • Mac에서 intel 기반의 app을 실행할 때 필요한 유틸리티입니다.

sudo softwareupdate --install-rosetta --agree-to-license

• XCode 설치
  •  Swift 와 ObjectC code를 컴파일하고 디버깅 하기 위해 XCode를 설치합니다.
  • https://developer.apple.com/xcode/

• CocoaPods 설치
  • Native앱에 Flutter plugin 컴파일이 가능하도록 CocoaPods을 설치합니다. 
  • https://cocoapods.org/

• 아래 명령어를 사용하여 cocoapods를 설치합니다

sudo gem install cocoapods

• cocoapods 설치시 다음과 같은 오류가 발생할 수 있습니다.

ERROR:  Error installing cocoapods:
	ERROR: Failed to build gem native extension.

• 이때는 xcode-select를 인스톨 하면 됩니다.
  • xcode-select는 XCode의 명령줄 관리 도구입니다.

xcode-select --install

• 간혹 xcode-select도 아래와 같이 설치가 안될 경우가 있습니다.

xcode-select: note: Command line tools are already installed. 
Use "Software Update" in System Settings or the softwareupdate 
command line interface to install updates

• 이때는 software update를 download 하여 설치하면 해결 할 수 있습니다.
  • software update는 운영 체제와 관련된 모든 소프트웨어 업데이트를 자동으로 설치하는 기능을 수행합니다.
  • 따라서 다운로드 및 설치 시간이 좀 많이 소요됩니다.

softwareupdate --install -a

• 다운로드가 완료되면 "시스템 설정"에 업데이트가 표시되고, 업데이트를 클릭 하시면됩니다.
  • 업데이트가 완료되면 다시 CocoaPods를 설치합니다.

sudo gem install cocoapods

• 설치가 완료되면 다음과 같이 메시지가 표시됩니다.

Text Editor Settings

• Text editor는 Visual Studio Code, Android Studio, IntelliJ IDEA등을 사용할 수 있습니다.
• 저는 Visual Studio Code를 선택하였습니다.
• Visual Studio Code를 설치하고, 실행합니다.
• 아래 링크에 있는 Dart Extention을 추가합니다.
• https://marketplace.visualstudio.com/items?itemName=Dart-Code.flutter
• Command Palette를 실행합니다. 단축키는 Command+Shift+P 입니다.
• Command Palette에서 "flutter"를 입력합니다.

• "Flutter:New Project"를 선택합니다.
• 이때 Flutter SDK가 설치 되어 있지 않으면 다운로드하여 설치하시면됩니다.
• 설치가 되어 있다면 위치를 지정해주면 됩니다.
• SDK 설치 후에 Command Palette에서 "Flutter:New Project"를 선택하고 "flutter-first" 라는 프로젝트를 생성합니다.

iOS 개발환경 설정

• XCode를 설치합니다.
• XCode의 버전에 맞는 command line tool을 설치합니다.

sudo sh -c 'xcode-select -s /Applications/Xcode.app/Contents/Developer && xcodebuild -runFirstLaunch'

• XCode license에 동의 서명을 합니다.

sudo xcodebuild -license

iOS Simulator 설치

• iOS Simulator를 설치합니다.

xcodebuild -downloadPlatform iOS

• Simulator를 실행합니다

open -a Simulator

• XCode를 실행합니다.
• 메뉴에서 Windows - Devices and Simulators를 선택합니다.
• simulator 탭을 클릭하면 사용 가능한 리스트가 나옵니다.

• XCode에서 flutter_first 프로젝트를 엽니다.

• 탐색 창에서 flutter_first 프로젝트 아래 있는 ios를 선택하면 됩니다.

• XCode 상단의 파란색 실행 버튼을 클릭합니다.

• 아래와 같이 simulator가 실행됩니다.

이전 post 에서 Multiple database connection 설정 방법에 대해서 알아보았습니다.

@InjectRepository에서 아래와 같이 connection을 명시적으로 작성을 해주었습니다.

@InjectRepository(Slider, 'sliderConnection')
private sliderRepository: Repository<Slider>

그런데 @InjectDataSource()를 사용시에는 database schema를 찾지 못하는 문제가 발생합니다.

@InjectDataSource()
private dataSource: DataSource

이럴 경우에는 @Entity에 스키마 정보를 명시적으로 작성해주면 됩니다.

@Entity({ name: 'slider', database: 'slider' })

database 에 작성된 slider는 shema name입니다.

AWS Code Pipeline을 사용해서 Build시 다음과 같은 오류가 발생하는 경우가 있습니다.

FATAL ERROR: Ineffective mark-compacts near heap limit Allocation failed 
- JavaScript heap out of memory

문제 해결을 위해 검색을 해보면 대부분 아래와 같이 heap memory 옵션을 추가하라고 나옵니다.

export NODE_OPTIONS="--max-old-space-size=8192"

하지만 이 옵션의 경우 AWS 빌드 컨테이너의 메모리 사이즈가 이것보다 클 경우만 사용 가능한 옵션입니다.

즉, 기본적으로 빌드 컨테이너의 메모리가 부족하면 이것을 늘려도 소용이 없다는 뜻입니다.

이 경우 빌드 컨테이너의 메모리를 늘려서 문제를 해결할 수 있습니다.

AWS 콘솔에서 Code Build - Build Project 메뉴에 들어가서 프로젝트를 선택하면 설정된 메모리를 보실 수 있습니다.

편집 버튼을 클릭하면 메모리 사이즈를 변경할 수 있습니다.

https://youtu.be/k7UtpY7uqDE

Application을 개발시 여러개의 DB에 접속하여 데이터를 핸들링 해야 하는 경우가 있습니다.
Nestjs에서는 TypeORM의 Multiple Connection을 이용하여 이러한 구현이 가능합니다.

예제에서는 다음과 같이 두개의 database를 사용합니다.

• Database #1 : cat
• Database #2 : slider

Table 정보

사용하는 테이블 생성 정보는 다음과 같습니다.

cat

CREATE TABLE `cat` (
  `id` int(11) NOT NULL AUTO_INCREMENT,
  `name` varchar(255) NOT NULL COMMENT '고양이 이름',
  `age` int(11) NOT NULL COMMENT '고양이 나이',
  `breed` varchar(255) NOT NULL COMMENT '고양이 종류',
  PRIMARY KEY (`id`)
);

slider

CREATE TABLE `slider` (
  `id` int(11) NOT NULL AUTO_INCREMENT,
  `image_url` varchar(200) NOT NULL,
  `created_at` timestamp NOT NULL DEFAULT CURRENT_TIMESTAMP,
  `updated_at` timestamp NOT NULL DEFAULT CURRENT_TIMESTAMP,
  PRIMARY KEY (`id`)
);

프로젝트 생성

아래와 같이 프로젝트를 생성합니다.

nest new multi-connection

폴더로 이동 후 Visual Studio Code를 실행합니다.

cd multi-connection
code .

패키지 설치

아래와 같이 TypeORM 패키지를 설치합니다.

yarn add @nestjs/typeorm typeorm mysql2

첫번째 database 연결하기

ORM 설정파일

프로젝트에 orm 환경 설정 파일을 만듭니다.

• 소스 폴더 : src/config/orm.config.ts

import { TypeOrmModuleOptions } from "@nestjs/typeorm";

function ormConfig(): TypeOrmModuleOptions {
    return {
        name: 'default',
        type: 'mysql',
        database: 'cat',
        host: 'localhost',
        port: Number(13306),
        username: 'cat',
        password: 'cat',
        logging: (process.env.NODE_ENV === 'local'),
        synchronize: true,
        entities: [__dirname + '/domain/*.entity.{ts,js}'],
        migrations: [__dirname + '/migrations/**/*.{ts,js}'],
        migrationsRun: false,
    };
}
function ormConfigSlider(): TypeOrmModuleOptions {
    return {
        name: 'sliderConnection',
        type: 'mysql',
        database: 'slider',
        host: 'localhost',
        port: Number(13306),
        username: 'slider',
        password: 'slider',
        logging: (process.env.NODE_ENV === 'local'),
        synchronize: true,
        entities: [__dirname + '/domain/*.entity.{ts,js}'],
        migrations: [__dirname + '/migrations/**/*.{ts,js}'],
        migrationsRun: true,
    };
}
export { ormConfig, ormConfigSlider };

orm config import 하기

app.module.ts 에 orm config를 import 합니다.

import { ormConfig } from './config/orm.config';

imports: [
    TypeOrmModule.forRootAsync({
      useFactory: ormConfig
    }),
    TypeOrmModule.forRootAsync({
      name: 'sliderConnection',
      useFactory: ormConfigSlider
    })
  ],

Entity 생성

typeorm-model-generator를 사용해서 테이블에 있는 cat, slider entity를 생성합니다.

사용법은 아래 포스트에서 확인하실 수 있습니다.
https://codegear.tistory.com/122

typeorm-model-generator -h localhost -d cat -p 13306 -u cat -x cat -e mysql -o ./gen_models
typeorm-model-generator -h localhost -d slider -p 13306 -u slider -x slider -e mysql -o ./gen_models

gen_models 폴더에 생성된 entity 파일을 domain 폴더로 복사합니다.

파일 이름을 아래와 같이 변경합니다.(ormConfig에서 설정한 파일명 형식)

Cat.ts -> Cat.entity.ts
Slider.ts -> Slider.entity.ts

Module에 Entity 선언하기

app.module.ts의 import 아래에 다음을 추가합니다.

(TypeOrmModule.forRootAsync 아래에 추가하면 됩니다)

TypeOrmModule.forFeature([Cat]),
TypeOrmModule.forFeature([Slider], 'sliderConnection')

Cat & Slider 데이터 조회하기

app.controller.ts에 다음을 추가합니다.

@Get('/cats')
async getCats(){
  return await this.appService.getCats();
}

@Get('/sliders')
async getSliders(){
  return await this.appService.getSliders();
}

app.service.ts에 다음을 추가합니다. (getCats, getSliders)

import { Injectable } from '@nestjs/common';
import { InjectRepository } from '@nestjs/typeorm';
import { Repository } from 'typeorm';
import { Cat } from './domain/Cat.entity';
import { Slider } from './domain/Slider.entity';

@Injectable()
export class AppService {
  constructor(
    @InjectRepository(Cat)
    private catRepository: Repository<Cat>,
    @InjectRepository(Slider, 'sliderConnection')
    private sliderRepository: Repository<Slider>
  ){}
  
  getHello(): string {
    return 'Hello World!';
  }
  async getCats() {
    return await this.catRepository.find(); 
  }
  async getSliders() {
    return await this.sliderRepository.find();
  }
}

브라우저에서 다음을 각각 호출합니다.

http://localhost:3000/cats
http://localhost:3000/sliders

결과는 다음과 같습니다.

[
   {
      "id":1,
      "name":"kitty",
      "age":1,
      "breed":"cyprus"
   },
   {
      "id":2,
      "name":"pitty",
      "age":2,
      "breed":"percian"
   }
]

[
   {
      "id":1,
      "imageUrl":"https://..../images/test.jpg",
      "createdAt":"2024-08-19T14:08:20.000Z",
      "updatedAt":"2024-08-19T14:08:20.000Z"
   }
]

이상으로 Nestjs에서 TypeORM을 사용해서 여러개의 DB를 사용하는 방법에 대해 알아보았습니다.

https://youtu.be/KwqP314OpxQ

TypeORM 사용시 Entity 파일을 자동으로 생성해주는 tool이 있습니다.
바로 typeorm-model-generator 입니다.

이 tool을 사용하면 테이블을 참조하여 손쉽게 entity 파일을 만들 수 있습니다.

typeorm-model-generator에 대한 자세한 설명은 아래 링크에서 확인하실 수 있습니다.

https://www.npmjs.com/package/typeorm-model-generator

typeorm-model-generator는 아래와 같이 여러 db engine을 지원합니다.

• Microsoft SQL Server
• PostgreSQL
• MySQL
• MariaDB
• Oracle Database
• SQLite

우선 typeorm-model-generator를 설치합니다.

npm i -g typeorm-model-generator

사용법은 다음과 같습니다.

Usage: typeorm-model-generator -h <host> -d <database> -p [port] -u <user> -x
[password] -e [engine]

Options:
  --help                 Show help                                     [boolean]
  --version              Show version number                           [boolean]
  -h, --host             IP address/Hostname for database server
                                                          [default: "127.0.0.1"]
  -d, --database         Database name(or path for sqlite)            [required]
  -u, --user             Username for database server
  -x, --pass             Password for database server              [default: ""]
  -p, --port             Port number for database server
  -e, --engine           Database engine
          [choices: "mssql", "postgres", "mysql", "mariadb", "oracle", "sqlite"]
                                                              [default: "mssql"]
  -o, --output           Where to place generated models
                            [default: "./output"]
  -s, --schema           Schema name to create model from. Only for mssql
                         and postgres. You can pass multiple values
                         separated by comma eg. -s scheme1,scheme2,scheme3
  --ssl                                               [boolean] [default: false]

예를 들면 다음과 같습니다.

typeorm-model-generator -h localhost -d test -p 3306 -u root -x root -e mysql -o ./generated_models

옵션 사용법은 다음과 같습니다.

• -h : 테이터베이스 호스트 IP (localhost)
• -d : 데이터베이스 이름 (test)
• -p : 데이터베이스 포트 (3306)
• -u : 데이터베이스 username (root)
• -x : 데이터베이스 password (root)
• -e : 데이터베이스 engine (mysql)
• 마지막은 파일 생성위치입니다(./generated_models)

실행하면 아래와 같이 entity 파일이 생성 됩니다.

• 폴더 : generated_models/entities/Cat.ts

import { Column, Entity, PrimaryGeneratedColumn } from "typeorm";

@Entity("cat", { schema: "test" })
export class Cat {
  @PrimaryGeneratedColumn({ type: "int", name: "id" })
  id: number;

  @Column("varchar", { name: "name", comment: "고양이 이름", length: 255 })
  name: string;

  @Column("int", { name: "age", comment: "고양이 나이" })
  age: number;

  @Column("varchar", { name: "breed", comment: "고양이 종류", length: 255 })
  breed: string;
}

typeorm-model-generator를 사용해 좀 더 빠르고 편한 개발 생활 되시길 바랍니다. 

Repository는 Entity에 대한 CRUD를 추상화한 객체입니다.

여기서 추상화라고 하면,
사용이 복잡한 것들을 핵심적인 기능만 간추려서 사용하기 쉽게 만든 것을 의미합니다.

예를 들면,

고양이의 정보를 Database에 저장하기 위해서는 다음과 같은 SQL을 사용합니다.

insert into cat(name, age, breed)
values('꼼지', 5, '스코티시폴드');

이것을 Repository 패턴으로 표현하면 다음과 같습니다.

const cat = new CreateCatDto();
cat.name = '꼼지';
cat.age = 5;
cat.breed = '스코티시폴더';
catRepository.save(cat);

SQL을 잘 아는 사람 입장에서는 쿼리를 사용하는 것이 훨씬 가독성이 좋습니다.

하지만 SQL을 잘 모르는 사람도 코딩 방법만 알면 쉽게 Database 핸들링이 가능해집니다.

Repository 패턴을 보시면 쿼리를 객체로 만들어서 사용하고 있는 것을 알 수 있습니다.

이렇듯 Repository 패턴은 좀 더 프로그래밍에 가깝게 쿼리를 사용할 수 있게 만든 것입니다.

쿼리를 잘 모르거나 간단한 쿼리를 사용하고자 할 경우에는 정말 쉽게 사용을 할 수 있습니다.

Nestjs의 API를 PUT, POST 등으로 호출할 경우에 보통 Json 형식을 사용하게 됩니다.

이때 json의 용량이 커지게 되면 다음과 같은 문제가 발생합니다.

Nestjs의 오류 메시지는 다음과 같습니다.

이 문제를 해결하는 방법은 main.ts에 다음과 같은 내용을 추가하시면 됩니다.
(app.listen 위에 추가하면 됩니다)

import { json } from 'body-parser';

app.use(json({ limit: '50mb' }));
await app.listen(port);

이 문제의 해결법은 kamilmysliwiec 가 github에서 답변한 내용에서 가져왔습니다.

https://github.com/nestjs/nest/issues/529#issuecomment-376576929

반복 작업의 필요성

Schedule이란 일정 주기별로 반복되는 Job을 처리하는 것을 의미합니다.
주기는 다음과 같은 것들이 있을 수 있습니다.

• 매시, 매일, 매주, 매월, 매년
• 격주, 격월
• 특정 시간, 특정 요일, 특정 일자 등등

반복되는 작업들은 어떤 것들이 있을까요?

• 어제의 사이트 통계를 다음날 아침 Slack에 뿌려주기
• 일주일에 한번 특정 사이트를 크롤링해서 데이터 저장하기
• 생일인 고객에게 쿠폰을 발행해서 메시지 보내기

이런 작업들을 일일이 수동으로 처리하기는 매우 어렵습니다.

이때 자동화된 스케줄러가 필요합니다.

리눅스의 Crontab

이런 Schedule을 처리하는 대표적인 프로그램이 Linux에서 제공하는 crontab입니다.

리눅스 shell에서 "crontab -e" 명령을 사용하여 편집모드에서 설정을 하게되면,

일정 주기별로 반복 수행하는 형태입니다.

AWS 에서 Scheduler 사용하기

Cloud 환경이 되면서 오면서 crontab을 사용하는 것이 어려워졌습니다.

쿠버네티스, AWS ECS등의 도커 기반 오케스트레이션 플랫폼을 사용하게 되면서, 인스턴스의 관리를 사용자가 아닌 플랫폼이 맡게 되기 때문입니다. 이로 인해 사용자가 직접 서버를 수정하는 일이 대부분 사라지게 되었습니다.

crontab을 대신할 수 있도록 AWS에서는 Amazon Event Bridge라는 서비스를 제공하고 있습니다.

Amazon Event Bridge와 AWS Lambda를 조합하면 다양한 구현이 가능합니다.

Amazon EventBridge는 crontab과 거의 유사한 방식으로 aws console에서 구현이 가능합니다.

스케줄러 샘플 구현 

Amazon Event Bridge와 Lambda를 이용해 API를 호출하는 서비스를 구현하는 방법을 샘플을 통해 알아봅니다.

순서는 다음과 같습니다.

• (API를 호출하는) Lambda Function 만들기
• Amazon EventBridge에 Schedule 등록하기

Lambda Function 만들기

• AWS Lambda에서 함수를 생성합니다.
• Python 3.10과 arm을 이용하도록 셋팅합니다.
• 코드를 다음과 같이 작성합니다.

import json
import requests

def lambda_handler(event, context):
	print('calling...')
	url = "https://api.sample.com/..."
	header = {
		'Content-Type': 'application/json; charset=UTF-8',
		'User-Agent': ...
	}
	res = requests.get(
		url,
		headers,
		data={}
	)
	print(res.content)
	return {
		'statusCode': 200,
		'body': ...
	}

• requests 라이브러리는 aws에서 기본 제공이 아니기 때문에 Layer를 만들어 추가해 주어야 합니다.
• Layer는 반드시 python 폴더를 만드시고 해당 폴더에서 pip install로 추가해야 합니다.

mkdir python
cd python

pip install requests -t .

• python 폴더를 압축합니다. (python.zip)
• Lambda 메뉴에서 계층을 선택 후 계층 생성 버튼을 클릭합니다.

• upload에서 python.zip 파일을 추가합니다.

Amazon EventBridge에 Scheduler 등록하기

• Amazon EventBridge 서비스에서 좌측 메뉴의 Scheduler - 일정 메뉴 선택
• 일정 생성 버튼 클릭
• cron 형식으로 일정 패턴 등록

• 대상 선택에서 AWS Lambda를 선택

• Invoke를 선택하고, 생성한 Lambda function을 선택하면 됩니다.

이렇게 하면 매일 아침 9시에 API를 호출하는 Schedule을 사용할 수 있습니다.