개 x발

엘리스 리크루팅 위크 (드디어 취뽀)

쭈녁 — Fri, 6 Sep 2024 21:50:18 +0900

결국결국결국*100 취뽀하게 되었다. 아직 미생이고 가야할 길이 너무 멀고 길지만 백엔드 개발자를 꿈꾸며 긴 시간동안 했던 준비를 떠올리며 엘리스 트랙에서 주신 도움도 홍보차 포스팅 하고싶어서 글을 써본다.

~~취업한지 3달이나 지났지만 이제 씀~~

홍보 해드리는거 재대로 포스터까지

이미 모집 끝난 트랙입니다

현재 취업한 기업 및 직무

아주 작은 스타트업 취업하게 되었다. 생성형 AI 를 기반으로 한 서비스를 모니터링하고 자연어로 시스템 관리를 지원하는 서비스를 만들고 있다. 포지션은 백엔드 파트이다.

물론 매우 작은 회사라 안좋은 점도 있지만 지금은 좋은점이 더 많은것 같다. 스타트업이기 때문에 기술의 선택도 자유로운 편이고 비교적 최신 기술과 새로운 버전등을 현업에서 직접 써볼 수 있는 점이 좋은것 같고 혼자 공부하면서는 느낄 수 었던 하나하나 현업에서 경험해보면서 성장할 수 있는 느낌이 너무 좋다.

이전 개발 관련 전공 혹은 업무를 했었는지

필자는 국제통상, 중문과 전공에 4년차 영업직에 있었던 살짝 숙성된 사회인이였다.

영업직은 성격과 맞지 않는부분이 자꾸 보여서 개발자를 꿈꾸며 호기롭게 퇴사하고 공부했지만 현실은 매우 차가웠다ㅋㅋ

하지만 개발이라는 직무를 선택하고 기술을 배운 것은 내 인생에 꽤나 중요한 선택이 되지 않을까 생각하고 성향과 매우 잘맞는 직종을 잘 찾았다고 본인은 생각한다.

엘리스 Cloud트랙 1기를 지원하신 계기와 엘리스를 선택한 이유

이전 블로그 포스팅에도 올렸듯 1년 6개월간의 Java/Spring 독학을 한 후 혼자 취업을 도전했었다. 이때 취업의 벽을 느끼고 의지도 많이 약해져 있을 때 우연찮게 엘리스의 광고 글을 보게 되어 지원했었다.

사실 독학 시절 오프라인에서 같이 스터디하던 동료가 엘리스의 Node 코스를 이수하고 이후 취업까지 한 동료가 있어 이미 엘리스에 대해 어느정도 인지하고 있었고 당시에는 Java/Spring을 기반으로한 트랙이 없어 참여하지 않았었는데 우연치 않게 광고 글을 보고 지원하게 되었다.

엘리스트랙의 실시간 수업 만족도 (수업 방식 및 플랫폼에 대한 경험)

이 부분은 사람에 따라 의견이 매우 다를것 같지만 오랜 기간 독학을 했던 나로써는 실시간 수업은 인류가 불을 발견한 느낌 (?) 이라고 해야하려나.. 궁금한게 바로 피드백이 오고 실시간으로 현업을 경험한 고수 (강사) 님들과 소통하면 배울 수 있다는게 너무 좋았다.

그리고 플랫폼의 경우 IDEA 와 같은 개발 툴을 쓰고 있는 입장에서 하나하나 타이핑 해서 쓰는 코딩이 불편하긴 했지만 기본적인 학습을 하고 넘어갈 수 있도록 체계가 잡혀 있었던 것 같다.

수료 후에도 자격증비 지원까지 미쳤다... 갬동

수료 후 관심 있는 직무나 기업이 있었나요?

수료후 기업에 대해서 딱히 생각해본 것은 없는것 같고 빨리 취업을 해야겠다 생각이 많았던것 같다. 직무의 경우는 백엔드만 공부했었기 때문에 직무는 백엔드로 가야 가장 경쟁력이 있을꺼라고 생각했다. 사실 경쟁력 때문에 백엔드를 생각한것이지 막상 현업에 와보니 Spring 뿐 아니라 Nest 도 배워야겠다 생각하고 계속 공부하고 있고 이를 넘어 React도 공부해서 전체적으로 흐름을 알고 다재다능하게 경쟁력을 키워야겠다는 생각이 많이 드는것 같다.

리크르팅 위크란?

엘리스 트랙을 수료한 수료생들을 대상으로 수료식, 기업과의 커피챗, 면접, 취업 컨설팅을 해주는 행사입니다.

엘리스트랙의 리크루팅 위크를 통한 취업에 대한 소감

예전에 엘리스에서 진행한 취업 설명회를 가서 들었던 코치님의 말씀이 기억이 난다.

면접은 기업이 날 평가하는것이기도 하지만 내가 기업을 평가 하는거다 라고 말씀하셨는데

리크루팅 위크에 참여해서 이 기업은 어떤 비전이 있고 무엇을 하고 있고 내가 가게 되면 나는 어떤 직무를 받게 되고 그로인해 나는 어떻게 발전할 수 있을것인가 를 리크루팅 위크를 통해 많이 생각해볼 수 있었던 것 같다.

흐름 외의 이야기이긴 하지만 이 날 나와 했던 커피챗이 기억이 제일 남으셨다고 하셨는데 음... 본인은 잘 모르겠지만 운이 좋게 잘 된것 같다..

리크루팅 위크를 추천하고 싶은 분은?

취업 지원을 많이 하고 있는데 뜻대로 잘 안되는 분들 그리고 내가 목표하는 기업이 따로 없다 라고 하면 참석해서 개발 관련해서 어떤 비즈니스들이 있고 어떤 기술을 알아야 하는지 현업자와 이야기 해 볼수 있는 좋은 기회라고 생각한다. 현업자와 커피챗하면서 내가 어떻게 공부하고 요즘 트랜드는 어떤지를 묻을 수도 있다. 물론 참여한 기업에서 모두 의미있고 좋은 답변을 주시리란 보장은 없지만 하다 못해 내가 취업할 직종에 어떤 분야가 있고 어떤 기술이 필요하고 이런것들을 알아가기에도 좋을 것 같다.

리크루팅 위크를 통해서 배운 점

리크루팅 위크 때 지금 회사의 사수님을 만났는데 운좋게 개발 경험도 많으시고 스타트업에서 CTO를 적지 않은 기간 맡고 계신 분이었다. 당일 커피챗에 내가 수료를 하게 되면 어떤 기술을 더 배우는게 좋을지 그리고 당시 생각하던 공부 방향을 말씀드리고 현업자 분들은 어떻게 생각하시는지 물어 보았다. 그날 커피챗만으로도 뭘 더 공부해야할지, 기업의 크기, 형태에 따라 다르겠지만 현업에 계신분들은 어떤 능력을 갖고 있는 인재를 원하는지 알게 되는 시간이였다.

엘리스트랙에서 배운 내용 중 현업에서 도움되는 것

네트워크, 클라우드, 컨테이너 개념이 많이 약했는데 엘리스트랙에서 배운 내용이 밑 바탕이 되어 지금은 그 위에 차곡차곡 쌓아갈 수 있게 된것 같다. (아예 모르고 왔으면 난리날 뻔)

엘리스트랙 과정을 돌아보면 (힘들었던 것 / 좋았던 것)

힘들었던 기억은 마지막 프로젝트였던 것 같다. 좀비처럼 집에 박혀서 코딩만 했던것 같다.. ㅋㅋ

트러블, 교육의 불만 이런 문제가 아닌 진짜 그냥 육체적으로 힘들었다 ㅋㅋㅋㅋㅋㅋㅋㅋ

가장 뿌듯하고 좋았던 것은 취업을 하고도 계속 이어질 수 있는 동료들이 생긴것 같아서 가장 뿌듯한 것 같다. 그중에 아직 취준 하고 계신분도 취업해서 직장생활 하시는분도 계시지만 멘탈이 흔들릴 때나 내가 모르는 것을 누군가에게 물어보고 싶을때 함께한 레이서들 부터 코치님들까지 독학을 오래 했던 사람으로써 이런 주변 사람이 엘리스 트랙에서 얻은 가장 큰 결과물이 아닐까 싶다.(심지어 코치님들은 아직도 물어보면 대답해줌)

엘리스트랙을 추천한다면 어떤 분들께 추천하고 싶나요?

다시 열정을 불어넣고 싶고 주변에 같이 공부하는 누군가 있으면 좋겠다 하시는분들에게 추천합니다.

글을 마치며 얼마전에 우연히 더딩 크루거 현상을 알게 되었는데 이 말이 너무 좋다. 알면 알수록 더 모른다는 뜻이다. 내가 뭘 모르는지 알아야 그걸 알아갈 수 있다. 혼자 우물안에 있으면 내가 무엇을 모르는지 알 수 없다. 세상엔 고수가 많고 고수가 아니더라도 나보다 특정 부분에서 뛰어난 사람은 많다.

누군가와 함께 공부하고 싶다, 내가 뭘 모르는지 모르겠다, 누군가에게 물어보면서 공부하고 싶다. 라는 생각이 있는 분들이 의지(의지가 제일 중요)만 가지고 엘리스트랙에 참가해보면 좋을 것 같다.

성장이 실감나는 IT 부트캠프, 엘리스트랙

현업 개발자들이 추천하는 국비지원 부트캠프, 프론트엔드, 백엔드, 웹 프로그래밍, 인공지능(AI), 데이터분석, 사물인터넷(IoT)까지! 개발자 성장 플랫폼 엘리스트랙에서 시작하세요

elice.training

엘리스 클라우드 트랙을 마치며

쭈녁 — Tue, 4 Jun 2024 21:22:32 +0900

엘리스 Cloud트랙에 들어온 계기

엘리스 트랙에 참여하기 전 나는 1년 반동안 혼자 Java Spring을 독학하며 취업 준비를 하던 상황이었다.

짧지 않은 기간 취업에 도전했지만 쉽사리 취업의 벽을 넘지 못했고 무엇을 어떻게 공부해야 할지 갈피를 잡지 못하고 의지도 약해진 상태였다.

예전 오프라인 스터디에 SW 트랙을 수료하고 취업한 스터디원이 있었고 엘리스 교육과정을 추천한 적이 있었다. 그 당시에는 내가 공부하던 Java , Spring 과정이 없어 참여하지 못했었다.

우연히 SNS를 통해 Java, Spring 클라우드 1기 모집글을 접하여 신청하게 되었고 열심히 달려 수료까지 하게 되었다.

Cloud트랙에서 학습 후기

클라우드 트랙을 진행하면서 가장 좋았던 부분은

첫 번째로 학습에 대한 방향성이 생겼다. 독학으로는 쉽게 이해가 가지 않았던 부분을 현업에 있는 코치님들이 알려주시고, 실무에서 쓰이는 예시를 들을 수 있는 등 어떤 것을 학습해야 하고 왜 학습해야 하는지 방향성을 잡을 수 있어 좋았다.
두 번째로는 학습에 대한 열정을 다시 가질 수 있게 되었던 부분이 좋았다. 지속적인 구직 실패로 의지가 꺾여있던 나에게 하나씩 공부하며 해나가는 과정에서 자신감을 다시 얻을 수 있었고 열심히 공부해 나가는 것에 흥미를 느끼게 된 것 같다.
세 번째로는 여러 레이서들과 함께 공부하면서 같이 공부할 사람들을 만들 수 있었던 점이 좋았다. 독학을 오래 하면서 여러 스터디도 전전긍긍해 보고 여러 사이드 프로젝트도 찾아보고 했으나 쉽게 찾아내거나 설령 들어간다 하더라도 쉽게 유지하지 못하는 경우가 많았는데 클라우드 트랙에 참여하면서 함께 공부할 수 있는 사람들이 많이 생긴 거 같다.

실시간 온라인 강의

3개의 프로젝트 내용

프로젝트는 1차 / 2차 / 3차로 나뉘어 진행되었다.

1차 프로젝트

1달간 학습한 Springframwark의 기본 기능을 적용해보는 프로젝트였다. thymeleaf를 사용하여 MVC모델로 개인 프로젝트를 만들었으며 Spring의 IOC와 DI 개념을 이해하고 Bean Container를 통한 생명 주기 관리를 이해할 수 있었다. 감사하게도 프로젝트 우수상을 수상할 수 있었다.

2차 프로젝트

SringSecurity, AOP와 같은 서비스의 완성도를 높일 수 있는 기능에 대한 학습을 한 후 클라우드 트랙의 인원들과 함께 프로젝트를 진행하였다. RestAPI를 기반으로 하는 기능 구현에 초점이 있었으며, 프트도 일부 만들어야 하는 어려움이 있었지만 네트워크 전체적인 흐름을 이해하는데 도움이 되었다.

3차 프로젝트

엘리스 SW, AI 트랙을 수료한 수료생들과 함께 협업하여 진행하는 프로젝트였다. 2차 프로젝트 이후 학습한 AWS 와 Docker 등 클라우드 서비스에 필요한 기술들을 기반으로 프론트엔드와 협업하여 자유 주제 프로젝트를 진행하였다.

AWS 서비스를 활용할 수 있었고 프론트엔드와 백엔드의 업무를 분배해 주어 시간을 더 효율적으로 배분할 수 있었다. 때문에 CI/CD 기본적인 구축을 해볼 수 있었고 서버 모니터링 등 프로젝트 완성도를 좀 더 높일 수 있었다.

마지막 커넥팅 데이에서 프로젝트 발표 및 수상이 있었다.

즐겁게 노는 분위기에서(물론 잠은 못잠) 함께 했는데 수상도 할 수 있어서 더욱 좋았다. 프로젝트를 하면 간혹 팀원들끼리 싸우기도 하던데 엘리스에서 분위기를 잘 만들어 줘서 우리 기수는 다 잘 지낸 듯하다.

아래 대상 수상 내역과 커넥팅 데이에 매니저님들께서 준비해 준 웃긴 짤을 첨부해보았다.

현장에서 짤을 보고 빵 터졌던 기억이 난다 ㅋㅋㅋㅋㅋ

3차 프로젝트 발표자료

엘리스 플랫폼 사용 후기

엘리스 트랙을 진행하면서 가장 좋았던 부분은 실시간 강의를 통한 학습이었다. 실시간으로 현업자와 소통하며 피드백을 받을 수 있는 상황이 매우 좋았다.
또한 엘리스 플랫폼의 강의들을 무료로 접근해서 볼 수 있다는 점이 좋았다. 물론 강의별로 더 추가적으로 알고 싶으면 본인이 직접 다른 경로를 통해 구매하여 강의를 사거나 해야 하지만 강의의 질이 양호하고 트랙 진행 중에는 클라우드 트랙의 강의뿐 아닌 알고리즘 강의도 제공받을 수 있었다.
수료한 지금 시점에는 SLQD, 쿠버네틱스, AWS, AI 강의등 다양한 강의를 무상으로 제공 받을 수 있고 심지어 수료 후 6개월 동안 취득한 자격증에 대한 응시료 환급까지 해주는 배려를 해주어 만족도가 매우 높다.

운영 매니지먼트

6개월간 트랙을 이수하면서 함께 해주신 매니저님께 감사를 드리고 싶다.

트랙을 잘 이수할 수 있게 출결 관리, 일정 관리, 멘탈(?) 관리 등 많은 부분에서 고생을 해주셨다.

출결 관리 일화로 출첵 시간에 못 일어난 적이 있었는데 ~~직접 전화까지 해주셔서 출석을 찍어주셨다는.. ㅋㅋ~~

엘리스랩 이용 후기

엘리스랩도 프로젝트, 스터디 기간 가끔 사용하였는데 매우 만족스러웠다.

그 이유로 첫 번째는 넓고 쾌적한 공간이 제공된다는 점이다. 최종 프로젝트 진행할 때 오프라인으로 회의하며 진행할 때가 많았는데 많은 인원이 오래 모여 있을 장소가 변변치 않았는데 퀄리티 좋은 장소에서 모여 할 수 있어서 매우 좋았다. 매니저님이 인원을 하나하나 기억해 주면서 잘 지원해 주시고 챙겨주셔서 너무 좋았고 시설도 간식 스크린, 맥 등 좋은 시설로 구비되어 있어서 매우 좋았다.

트랙을 마치며

6개월 트랙을 시작하면서 처음엔 그동안 공부를 오래 했는데 배우는 것들이 의미가 없어 시간 낭비가 되지 않을까? 내가 이 6개월 과정을 끝까지 할 수 있을까?라는 의구심이 많았다. 현재 트랙을 마치고 회고해 보았을 때 과거에 나에게 고민할 시간에 해!라고 말하고 싶다. 왜냐하면 내가 그 시간 동안 혼자 공부하는 것보다 트랙에 레이서로 합류하여서 공부한 게 무조건 더 열심히 열정적으로 했다고 생각하기 때문이다. 엘리스 트랙에 참여하면서 그동안 알면서도 열심히 하지 않았던 나를 다잡을 수 있는 시간이었고 시간에 뭐든지 움직이고 뭐든지 해야 한다는 생각이 든 거 같다.

혹시 이 글을 엘리스 혹은 다른 국비 교육 코스를 고민하는 사람이 읽고 있다면 자신의 위치에 맞게 결정해야겠지만 더욱 열정적으로 해야 할 상황에 놓여있다면 참여해 보라고 말하고 싶다.

굳이 최적의 타이밍을 따지자면 Java 언어를 학습한 후 Spring을 배우고 있는 사람이 들어가면 좋을 것 같다. 코치님을 통해 얻을 수 있는 것도 많고 함께 공부하고 프로젝트를 수행할 레이서들과 함께 할 수 있어 좋을 것 같다.

https://elice.training/

개발자 올인원 국비 부트캠프, 엘리스트랙

elice.training

sequelize 사용법(1) - 모델(Entity)설정

쭈녁 — Thu, 30 May 2024 23:51:00 +0900

sequelize 는 node.js의 ORM 라이브러리중 하나로 여러 RDBMS를 지원하고 Promise 기반으로 구현되었기 때문에 비동기 로직을 편리하게 작성할 수 있게 한다.

sequelize 설정 (model/index.js)

const Sequelize = require('sequelize');
const env = process.env.NODE_ENV || 'development';
const config = require('../config/config')[env];
const db = {};
const sequelize = new Sequelize(config.database, config.username, config.password, config);

db.User = require('./user')(sequelize, Sequelize)
db.Post = require('./post')(sequelize, Sequelize)
db.Hashtag = require('./hashtag')(sequelize, Sequelize)
db.Comment = require('./comment')(sequelize, Sequelize)
db.Image = require('./image')(sequelize, Sequelize)

Object.keys(db).forEach(modelName => {
  if (db[modelName].associate) {
    db[modelName].associate(db);
  }
});

db.sequelize = sequelize;
db.Sequelize = Sequelize;

module.exports = db;

1. env 파일에 정의한 DB의 커넥션 정보를 가져와서 Sequelize의 객체 생성시 인자로 부여한다 (커넥션 연결)

2. db라는 객체를 만든 후 모델(Entity)로 정의한 js를 지정한다.

3. db안에 들어온 모델을 루프돌면서 연관관계를 맺어준다.

Model

module.exports = (sequelize, DataTypes) => {
    const User =  sequelize.define('User',{
        email: {
            type: DataTypes.STRING(30),
            allowNull: false,
            unique: true,
        },
        nickname : {
            type: DataTypes.STRING(20),
            allowNull: false,
        },
        password: {
            type: DataTypes.STRING(100),
            allowNull: false,
        },
    },{
        charset: 'utf8',
        collate: 'utf8_general_ci'
    });
    User.associate = (db) => {
        db.User.hasMany(db.Post,{as: 'Posts'});
        db.User.hasMany(db.Comment);
        db.User.belongsToMany(db.Post, {through: 'Heart', as: 'Hearted'})
        db.User.belongsToMany(db.User, {through: 'Follow', as: 'Followings', foreignKey: 'FollowerId'})
        db.User.belongsToMany(db.User, {through: 'Follow', as: 'Followers', foreignKey: 'FollowingId'})
    };
    return User;
}

1. model.export 함수는 스프링의 auto-ddl-create와 같은 역할을 하는 함수이며 difine함수의 두번째 인자로 컬럼의 데이터 타입과 옵션을 지정할 수 있다.

2. id 필드 같은 경우 데이터베이스의 PK 전략을 따른다.

3. associate 함수 같은 경우 Entity간 연관관계를 정의하는 함수이다.

1:N 연관관계

hasMany 는 해당 모델에 1:N 구조의 연관관계를 지정하는것을 말하며 Spring JPA의 @OneToMany와 유사하다.
as를 사용하여 리스트에 대한 별칭을 지정할 수 있으며 as가 생략된 경우 복수형으로 바뀌어 정의된다.

N:1 연관관계

belongsTo 로 정의 하며 N:1 구조로 연관관계를 맺는다. Spring JPA의 @ManyToOne 과 유사하며
N:1 연관관계의 특성에 맞게 FK를 갖도록 테이블이 구성된다.

N:N 연관관계

belongsToMany 로 정의하며 N:N의 구조로 연관관계가 구성된다. Spring JPA의 @ManyToMany와 유사하며
자동으로 중간테이블이 생성된다. 테이블의 명칭도 지정할 수 있으며 FK의 지정도 가능하다.
의미 있게 사용하려면 중간테이블 모델을 따로 빼는게 맞을 것 같다.(JPA에서는 그렇게 사용했었음)

await 와 async

쭈녁 — Tue, 28 May 2024 22:22:54 +0900

컴파일 언어인 java와 그 프레임워크 spring을 기반으로 공부했던터라 자바스크립트에 대한 이해가 부족했었다.

node.js 로 백엔드 예제를 만들다가 만난 경험을 적어본다.

자바스크립트는 싱글 스레드 기반의 인터프리터 언어이다. 때문에 동시성을 갖고 작업을 하기 위해서는 비동기 방식이 쓰이게 된다.

동기

동시에 일어난다는 뜻을 가지고 있고 어떤 요청이 들어왔을 때 응답이 한자리에서 동시에 일어난다는 의미

한가지 작업을 하면 결과가 반환 될 때까지 다른 작업이 대기한다.

비동기

어떤 요청이 들어오면 한자리에서 동시에 응답이 일어나지 않는다.

여러 요청을 번갈아가며 수행한다.

비동기 처리가 백그라운드에서 동작하면 동시성을 갖는 작업의 결과 중 어떤 작업이 먼저 결과가 반환될지 알수가 없다.

때문에 작업 완료된 결과를 받아 처리해야하는 경우 비동기 처리에 대한 처리를 해야만 한다.

이때 사용되는 대표적인 방법이 콜백함수와 Promise객체가 있다.

콜백함수 예시

getAllSum(function(x){
    getSum(x, function(y){
    	getPow(y){
        	return y*y;
        }
    });
});

프로미스 예시

fetch('http://localhost:3060/api')
    .then(response => response.json())
    .then(json => ....)
    .catch(error => constol.error(error));

이러한 문제에 대한 해결로 await async가 탄생하였다.

await / async 예시

async function getData() {
    const response = await fetch('https://example.com/api');
    const data = await response.json();
    const response2 = await fetch(`https://example.com/api/${data.id}`);
    const data2 = await response2.json();
    console.log(data2);
}

getData();

function 키워드 앞에 async를 붙혀주고 비동기로 처리되는 작업에 await을 붙여 해당 작업의 결과를 기다려 다른 작업에서 참조가 가능하게 한다.

async/await 는 내부적으로는 Promise를 사용해서 비동기를 처리하고 있다.

코드 작성 부분의 유지보수 위해 문법적 편의성만 제공해 준다.

공부하게 된 계기로 직면했던 트러블 슈팅을 간단하게 적어본다.

기존 코드

return req.login(user, async(loginErr)=>{
            if(loginErr){
                console.error(loginErr);
                return next(loginErr);
            }
            const userResponse = User.findOne({
                where:{ id: user.id },
                attributes: {
                    exclude: ['password']
                },
                include: [{
                    model: Post,
                    as: 'Posts',
                },{
                    model: User,
                    as: 'Followings',
                },{
                    model: User,
                    as: 'Followers',
                }]
            });
            return res.status(200).json(userResponse);
        }

User.findOne()을 통해 User DB를 조회하여 올 때 await을 적용시켜 주지 않아 아래와 같이 참조하지 못하였다.

오류

처음 만났을 때 쿼리도 정상적으로 잘 나가서 한동안 찾지 못하였지만 await 가 붙지 않아 비동기 처리에 문제가 있었음을 찾을 수 있었다.

수정 (await 키워드 추가)

return req.login(user, async(loginErr)=>{
            if(loginErr){
                console.error(loginErr);
                return next(loginErr);
            }
            //수정한 부분
            const userResponse = await User.findOne({
                where:{ id: user.id },
                attributes: {
                    exclude: ['password']
                },
                include: [{
                    model: Post,
                    as: 'Posts',
                },{
                    model: User,
                    as: 'Followings',
                },{
                    model: User,
                    as: 'Followers',
                }]
            });
            return res.status(200).json(userResponse);
        }

결과

React Hook

쭈녁 — Thu, 23 May 2024 22:10:24 +0900

React를 공부하면서 알게된 기능을 간단하게 정리해본다. 이후 상세하게 파고들어봐야겠다.

React가 지원하는 Hook

상태 관리를 위한 useState()

value에 해당하는 값을 관리할 수 있고 setter를 호출하여 value의 값을 변한다.

이때 value에 객체를 선언하여 전체적으로 변경할 수도 있다.

 import {useState} from 'react';

 const [value , setter] = useState({초기화 값});

조건부 이벤트핸들러 역할의 useEffect()

useEffect는 렌더링 이후에 실행되고, 특정 조건을 만족하면 호출하여 실행하도록 설계한다.

import React, { useEffect } from 'react';

useEffect(()=>{
        if(postAdded){
            setText('');        
        }
}, [postAdded])

컴포넌트의 성능을 최적화 하는데 사용되는 훅

값을 저장하는 useMemo()

동일한 계산을 반복해야 할 때, 이전에 계산한 값을 메모리에 저장하여 동일한 계산의 반복 수행을 막고 메모리를 효율적으로 쓰게하는 기능.

객체도 저장 가능함으로 styled-component처럼 컴포넌트 최적화에도 사용할 수 있다.

import { useMemo } from 'react';

const style = useMemo(() => (
	{ marginBotton:'20px', border:'1px colid #d9d9d9', padding:'20px'}
   	),[])

함수를 저장하는 useCallback()

useCallback() 또한 메모이제이션 기법으로 컴포넌트 성능을 최적화 시켜주는 도구이다.useMemo()와 다른 점은 useCallback은 인자로 전달한 콜백 함수 그 자체를 메모이제이션 하는 것이다.

import React, { useCallback } from 'react';

const onSubmit = useCallback(()=> {
	if(password !== passwordCheck){
        return setPasswordError(true);
    }
    if(!term){
        return setTermError(ture);
    }
},[email,password, passwordCheck, term]);

DOM 요소에 접근하기 위해 사용하는 useRef()

useRef는 저장공간 또는 DOM요소에 접근하기 위해 사용되는 React Hook이다. Ref는 reference를 의미한다.

자바스크립트의 querySelector와 유사.

input 태그의 요소를 참조해 오기 위해 사용한 예시

import React, { useRef } from 'react';

    const imageInput = useRef();
    
    const onClickImageUpload = useCallback(()=>{
        imageInput.current.click();
    },[imageInput.current]);
    
    
    //...
    <input type='file' multiple hidden ref={imageInput}/>

@FeignClient 요청 및 에러 핸들링

쭈녁 — Wed, 22 May 2024 21:35:13 +0900

기본 세팅 이전 포스팅 참고

https://programmingjun.tistory.com/96

@FeignClient 기본 세팅

프로젝트에서 외부 api에 요청을 보내야할 경우들이 있어 FeinClient를 사용해보았다. 이 과정중에 발생한 에러를 해결하며 공부하게된 내용들을 정리해본다. 의존성 관리해당 의존성은 Springboot 3.

programmingjun.tistory.com

전역, 부분적으로 request를 핸들링하기 위해서 Configuragion을 활용할 수 있다.

예를 들어 전역적인 요청에 header를 세팅한다거나 특정 외부 api를 호출할 때 동일하게 header를 세팅해야 할 경우

전역 RequestInterceptor 설정

@Configuration을 통해 전역의 요청을 설정할 수 있다.

@Configuration
public class GlobalFeignConfig {
    @Bean
    public RequestInterceptor requestInterceptor() {
        return requestTemplate -> requestTemplate.header("global-config-header", "GlobalFeignConfig");
    }
}

응답값

부분적 RequestInterceptor 설정

만일 특정 외부 api에만 요청 설정을 해야 할 경우 아래와 같이 사용할 수 있다.

@Configuration 을 사용하지 않은 이유는 전역으로 설정할 것이 아닌 특정 환경에서만 활용 가능하도록 하기 위함이다

public class FeignClientConfig {
    Map<String, Collection<String>> headers = new HashMap<>();
    @Bean
    public RequestInterceptor requestInterceptor() {
        headers.put("global-config-header", List.of("GlobalFeignConfig"));
        headers.put("custom-config-header1", List.of("FeignClientConfig1"));
        headers.put("custom-config-header2", List.of("FeignClientConfig2"));

        return requestTemplate -> requestTemplate.headers(headers);
    }
}

@FeignClient 어노테이션에서 configuration 옵션에 설정을 지정하면 해당 RequestInterceptor를 적용시킬 수 있다.

기존 인터셉터의 설정이 아닌 옵션에 부여한 인터셉터가 적용된다.

@FeignClient(name = "example", url = "http://localhost:8282", configuration = FeignClientConfig.class)
public interface FeignClientService {
    @GetMapping(value = "/test")
    Result getInfo(
            @RequestHeader(value = "Authorization", required = false) String token,
            @RequestParam(name = "name", required = false)String name,
            @RequestParam(name = "age", required = false) Integer age,
            @RequestParam(name = "status" , required = false)Integer status);
}

결과 값

요청 핸들링 결론 : 전역적으로 @Configuration를 붙여 전역적으로 핸들링하고 , 부분적으로 요청 핸들링 해야 하는 경우 @Configuration이 붙지 않은 설정을 적용한다.

에러 핸들링

커스텀 에러 세팅

에러 코드

@AllArgsConstructor
@Builder
@Getter
public class ErrorCode {
    private final HttpStatus httpStatus;
    private final String message;
}

커스텀 익셉션

@AllArgsConstructor
@Getter
public class CustomException extends RuntimeException{
    private ErrorCode errorCode;

    @Override
    public String getMessage() {
        return errorCode.getMessage();
    }
}

에러 반환 계층

@AllArgsConstructor
@NoArgsConstructor
@Builder
@Getter
public class ErrorResponse {
    private int status;
    private String code;
    private String message;

    // 커스텀에서 사용시
    public static ResponseEntity<ErrorResponse> ofResponse(ErrorCode e) {
        return ResponseEntity
                .status(e.getHttpStatus())
                .body(ErrorResponse.builder()
                        .status(e.getHttpStatus().value())
                        .code(e.getHttpStatus().name())
                        .message(e.getMessage())
                        .build()
                );
    }
    // 이외 익셉션
    ...
}

익셉션 핸들러

@RestControllerAdvice
@Order(1)
@Slf4j
public class ControllerAdvice {

    @ExceptionHandler(CustomException.class)
    public ResponseEntity<ErrorResponse> handleCustomException(CustomException e) {
        return ErrorResponse.ofResponse(e.getErrorCode());
    }
    ...
}

@FeignClient 설정 추가

@Configuration
public class GlobalFeignConfig {
    @Bean
    public RequestInterceptor requestInterceptor() {
        return requestTemplate -> requestTemplate.header("global-config-header", "GlobalFeignConfig");
    }
    // 애러 디코더 Bean 설정
    @Bean
    public ErrorDecoder errorDecoder() {
        return new CustomFeignErrorDecoder();
    }
}

ErrorDecoder 구현

외부 api 호출 시 애러가 발생하면 디코딩해주는 구현체 애러 핸들링을 어떻게 할지는 커스텀하는 방식에 따라 다를 것 같다.

@Slf4j
public class CustomFeignErrorDecoder implements ErrorDecoder {

    @SneakyThrows
    @Override
    public Exception decode(String s, Response response) {
        //HttpStatus
        HttpStatus responseStatus = HttpStatus.valueOf(response.status());

        //메시지 파싱
        String requestUrl = response.request().url();
        Response.Body body = response.body();
        JSONParser jp = new JSONParser();
        JSONObject parseBody = (JSONObject) jp.parse(new InputStreamReader(body.asInputStream()));
        String message = "[URL] : " + requestUrl + " [Body] :" + parseBody.toString();

        if (responseStatus.is5xxServerError()) {
            //5xx 애러 핸들링
            return new CustomException(ErrorCode.builder().httpStatus(responseStatus).message(message).build());
        } else if (responseStatus.is4xxClientError()) {
            //4xx 애러 핸들링
            return new CustomException(ErrorCode.builder().httpStatus(responseStatus).message(message).build());
        } else {
            return new Exception("Generic exception");
        }
    }
}

결과

파라미터로 status를 받아 그 상태를 그대로 반환하게 설정한 외부 api 애플리케이션에서 404를 반환하였고 다시 받아서 애러 핸들링 한 모습니다.

404 발생 시

400 발생 시

@FeignClient 기본 세팅

쭈녁 — Tue, 21 May 2024 19:18:29 +0900

프로젝트에서 외부 api에 요청을 보내야할 경우들이 있어 FeinClient를 사용해보았다. 이 과정중에 발생한 에러를 해결하며 공부하게된 내용들을 정리해본다.

의존성 관리

해당 의존성은 Springboot 3.2.4에 해당하는 의존성이다.

openfeign 라이브러리는 spring cloud 기반의 라이브러리이다. 때문에 spring cloud 의존성이 필요하며

spring cloud는 spring 과 호환성이 중요함으로 버전관리에 신경써야한다. 아래 공식 문서로 확인 가능하다.

https://spring.io/projects/spring-cloud

ext {
    set('springCloudVersion', "2023.0.0")
}

dependencyManagement {
    imports {
       mavenBom "org.springframework.cloud:spring-cloud-dependencies:${springCloudVersion}"
    }
}

dependencies {
	implementation "org.springframework.cloud:spring-cloud-starter-openfeign"
}

FeignClient 기술은 RestTemplet과 흡사하지만 직접 API호출 환경을 설정하여 사용하던 RestTemplet 과는 다르게 선언적 방식과 추상화된 인터페이스를 제공함으로써 외부 API 호출이 가능하도록 한다.

기본 세팅

메인 클레스에 @EnableFeignClients 를 추가해주어 하위 패키지에 존재하는 @FeignClient 어노테이션을 찾아 구현체를 만듭니다. (Spring 의 Component와 ComponentScan의 관계와 유사)

@SpringBootApplication
@EnableFeignClients
public class Feign2Application {

    public static void main(String[] args) {
       SpringApplication.run(Feign2Application.class, args);
    }

}

@FeignClient 인터페이스

※주의 :

@FeignClient 어노테이션 내부의 url 옵션은 호출할 api의 도메인 or IP 주소값이 입력되어야한다!!

@RequestMapping + @GetMapping 의 경우 두 경로값을 합쳐 EndPoint를 찾아 가는 점과 다르게 url에 접근할 도메인 or 서버의 주소를 기입해주어야한다.

**맨 마지막에 잘못된 사용예와 수정 후 참고**

테스트 환경 세팅

1. FeignClient 환경(8080 포트)

1-1 FeignClient 인터페이스

@FeignClient(name = "example", url = "http://localhost:8282")
public interface FeignClientService {
    @GetMapping(value = "/test")
    Result getInfo(
            @RequestHeader(value = "Authorization", required = false) String token,
            @RequestParam(name = "name", required = false)String name,
            @RequestParam(name = "age", required = false) Integer age,
            @RequestParam(name = "status" , required = false)Integer status);
}

1-2 FeignClient 컨트롤러

@RestController
@RequiredArgsConstructor
@Slf4j
public class FeignClientController {
    private final FeignClientService feignClientService;

    @GetMapping("/feign")
    public ResponseEntity<Result> feignClientTest(
            @RequestHeader(HttpHeaders.AUTHORIZATION) String header,
            @RequestParam(name = "name", required = false) String name,
            @RequestParam(name = "age", required = false) Integer age,
            @RequestParam(name = "status", required = false) Integer status) {
        log.info("feign 호출");
        Result info = feignClientService.getInfo(header, name, age, status);
        return ResponseEntity.ok(info);
    }
}

2. 외부 api 환경 세팅 (8282 포트)

받은 요청을 바로 body로 돌려주는 세팅 + 애러 발생 테스트를 위한 HttpStatus를 파라미터 세팅

@Slf4j
@RestController
public class TestController {

    @GetMapping("/test")
    public ResponseEntity<Result> getInfo(HttpServletRequest request , @RequestParam(name = "status", required = false, defaultValue = "200") int status) {
        Result result = new Result();
        request.getHeaderNames().asIterator().forEachRemaining((i) -> result.headerResult.add(i + " : " + request.getHeader(i)));
        request.getParameterNames().asIterator().forEachRemaining((i) -> result.parameterResult.add(i + " : " + request.getParameter(i)));
        HttpStatus httpStatus = HttpStatus.valueOf(status);
        return ResponseEntity.status(httpStatus).body(result);
    }
    @Data
    static class Result {
        List<String> headerResult = new ArrayList<>();
        List<String> parameterResult = new ArrayList<>();
        String body;
    }
}

요청 및 응답

8080 포트의 애플리케이션을 통해 8282의 응답을 받아온 결과를 볼 수 있음

잘못 된 사용 예

서로 다른 도메인의 api를 호출할 때 아래와 같이 하나의 인터페이스에 몰아 넣고 EndPoint를 합치려 하였으나 애러가 발생했다.

@FeignClient(name = "google-oauth2-client", url = "https://")
public interface GoogleOauth2Client {
    @PostMapping("oauth2.googleapis.com/token")
    OAuthTokenResponse getToken(@RequestParam(name = "grant_type") String grantType,
                                @RequestParam(value = "client_id") String clientId,
                                @RequestParam(value = "client_secret") String clientSecret,
                                @RequestParam(value = "redirect_uri") String redirectUri,
                                @RequestParam(value = "code") String code);
    
    @GetMapping(value = "www.googleapis.com/oauth2/v2/userinfo")
    GoogleUserInfo getUserInfo(@RequestHeader(value = HttpHeaders.AUTHORIZATION) String token);

}

수정

때문에 아래와 같이 도메인별로 인터페이스를 나누었다.

@FeignClient(name = "google-oauth2-token-client", url = "https://oauth2.googleapis.com")
public interface GoogleOauth2TokenClient {
    @PostMapping("/token")
    OAuthTokenResponse getToken(@RequestParam(name = "grant_type") String grantType,
                                @RequestParam(value = "client_id") String clientId,
                                @RequestParam(value = "client_secret") String clientSecret,
                                @RequestParam(value = "redirect_uri") String redirectUri,
                                @RequestParam(value = "code") String code);

}

@FeignClient(name = "google-oauth2-info-client", url = "https://www.googleapis.com")
public interface GoogleOauth2InfoClient {
    @GetMapping(value = "/oauth2/v2/userinfo")
    GoogleUserInfo getUserInfo(@RequestHeader(value = HttpHeaders.AUTHORIZATION) String token);
}

다음 포스팅에서는 해당 기술을 사용하였을 때 전역, 부분적으로 header등을 컨트롤 하는 방법과 외부 api 호출한 후 애러핸들링 (외부 api 요청이 실패하면 500 서버 애러로 나옴) 을 다룰 예정이다.

리액트 LifeCycle API

쭈녁 — Tue, 14 May 2024 23:36:25 +0900

리액트에는 요소의 라이프사이클에 따라 사용할 수 있도록 LifeCycle API를 제공한다.

해당 API를 통해 부모 자식관계의 요소들 사이에서 state와 props를 관리를 수월하게 해 준다.

나는 Spring 백엔드를 근간에 두고 있어 SpringFramwork에 비유하면서 공부하여 보았다.

스프링에도 라이프사이클에 의해 관리되도록 하는 어노테이션들이 있다. 리액트도 매우 비슷한 기능을 하는 API들을 만들어 놓은 것으로 이해되었다.

SpringBoot에서 라이프사이클에 해당하는 기능들

Bean Life Cylce에 해당하는

@PostConstruct

@PreDestroy

Bean의 생명주기와는 관련 있진 않지만 엔티티의 생명주기에 대응하도록 만들어진

@PostPersist

@PostUpdate

@PreRemove

애러 핸들링을 위한

@RestControllerAdvice

등과 비교하며 공부하니 이해가 편했던 것 같다.

리액트 LifeCycle API

constructor(props) : 생성자 호출 시 함수 실행

constructor(props) {
    super(props);
    console.log("constructor");
  }
  
/* 콘솔 로그
constructor
*/

componentDidMount(): 컴포넌트가 마운트 되고 실행되는 함수

constructor(props) {
    super(props);
    console.log("constructor");
  }
  componentDidMount() {
    console.log("componentDidMount");
    console.log(this.myDiv.getBoundingClientRect());
  }
  
 /*콘솔 로그
 	constructor
 	componentDidMount
	> DOMRect {내용}
 */

getDerivedStateFromProps() : 요소가 변경되었을 때 실행되는 함수 -> 생성 시에도 호출됨

/*컴포넌트 JS 코드 일부*/
  static getDerivedStateFromProps(props, state) {
    if (state.value !== props.value) {
      return {
        value: props.value,
      };
    }
    return null;
  }
  
  /*
  
  */

/*클릭 함수*/
	handleClick = () => {
		this.setState({ counter: this.state.counter + 1 });
	};
  
  
/*컴포넌트의 값을 업데이트*/
	{this.state.counter < 10 && <Mycomponent value={this.state.counter} />}
	<button onClick={this.handleClick}>Click here</button>

shouldComponentUpdate() : 컴포넌트를 업데이트할 조건을 설정(막을 때 사용)

이전값과 같다면 업데이트하지 마라 등의 최적화가 가능하게 한다.

/* 받은값이 10이면 업데이트 하지 않음 */
  shouldComponentUpdate(nextProps, nextState) {
    if (this.state.value === 10) {
      return false;
    }
    return true;
  }

getSnapshopBeforeUpdate()

컴포넌트가 업데이트가 되어서 DOM에 반영되기 직전에 호출되는 함수 DOM의 상태를 return 시켜서 받아오는 등의 활용

예시) 업데이트되기 전의 scroll 위치 or 인덱스 등의 값을 주어 상태를 유지하는 등 활용 가능하다.

componentDidUpdate()

컴포넌트가 업데이트되고 수행될 함수를 정의

  componentDidUpdate(prevProps, prevState) {
    if (this.props.value !== prevProps.value) {
      console.log("value 가 변함", this.props.value);
    }
  }
  /*
  value 가 변함 6
  value 가 변함 7
  ...
  */

componentWillUnmount()

  componentWillUnmount() {
    console.log("good bye");
  }
  /* 함수 로직 등으로 컴포넌트가 사라지면
	good bye
  */

componentDidCatch()

컴포넌트가 사용되는 부모 계층에서 함수를 작성해야 함

  componentDidCatch(error, info) {
    console.log(error, info);
  }

Spring 외부설정 2 (Profile 사용 예)

쭈녁 — Mon, 6 May 2024 00:17:25 +0900

외부 설정 Profile 사용

교육 과정 마지막 프로젝트에서 Profile을 적용시키고 실행 시점에 값을 주어 실행시킬만한 좋은 케이스가 생겨서 적용해 보았다.

현재 프로젝트에 프로메테우스 그라파나를 설정하여 애플리케이션에 대한 모니터링을 실행하고 있다.

하지만 이 모니터링은 로컬 환경에서 실행시킬 때 불필요하고 배포 서버에서 실행될 때 필요한 상황이다. 따라서 배포 시에 VM옵션에 profile=deploy를 주어 배포 시에만 실행되도록 지정하였다.

모니터링 외부 설정 profile 지정

#그라파나 설정
---
spring:
  config:
    activate:
      on-profile: deploy

management:
  info:
    java:
      enabled: true
    os:
      enabled: true
    env:
      enabled: true
  server:
#    port: 8080
    port: 9292
  endpoint:
#    shutdown:
#      enabled: true
    health:
      #      show-details: always
      show-components: always
  endpoints:
    web:
      exposure:
        include: "*"
#/info? ?????? ??
info:
  app:
    name: iyjy
    company: elice

server:
  tomcat:
    mbeanregistry:
      enabled: true

해당 프로필에 작동할 클래스

bean을 등록할 config에서도 특정 프로필에서만 작동하도록 하였다.

@Configuration
@Profile("deploy")
public class MeterAspectConfig {


    @Bean
    public CountedAspect countedAspect(MeterRegistry registry) {
        return new CountedAspect(registry);
    }

    @Bean
    public TimedAspect timedAspect(MeterRegistry registry) {
        return new TimedAspect(registry);
    }
}

그리고 배포 서버에서 실행시점에 아래와 같이 VM 옵션으로 실행시킬 프로필을 명시하여 특정 상황에만 모니터링 로그를 수집하도록 하였다

실행 명령어

nohup java -jar -Dspring.profiles.active=deploy demo-0.0.1-SNAPSHOT.jar &

이를 통해 로컬에서 default 프로필로 실행했을 때엔 수집 세팅이 되지 않고 배포시 프로필 적용하였을 때는 수집 세팅이 되도록 수정하였다.

Spring boot 커스텀 메트릭 (프로메테우스/그라파나)

쭈녁 — Mon, 6 May 2024 00:00:50 +0900

엑츄에이터와 마이크로미터

스프링 엑츄에이터를 기반으로 한 많은 모니터링 툴들이 있다. 하지만 이러한 모니터링 툴들은 쌓인 엑츄에이터의 정보를 받아올 때 여러 다른 형식으로 데이터를 받아간다. 스프링은 이러한 환경에서 항상 추상화를 통하여 표준 방식을 개발자에게 제공한다.

이 경우에도 마이크로미터를 통한 추상화를 통하여 여러 다른 형식의 포맷을 표준화하였다.

마이크로미터와 액츄에이터가 제공하는 메트릭에는 매우 다양한 정보들이 있다. 전체적인 애플리케이션의 health 체크 및 시스템에 대한 메트릭은 기본적으로 제공해 준다.

하지만 애플리케이션의 비즈니스 로직에서의 의미 있는 지표를 뽑아내고 싶다면 어떻게 해야 할까??

사용자 메트릭일 정의하여 수집 설정을 할 수 있다.

카운트 예제 1)

- registry를 의존하여 로직 안에서 직접 생성

@Slf4j
@RequiredArgsConstructor
public class OrderServiceV1 implements OrderService {
    private final MeterRegistry registry;
    private AtomicInteger stock = new AtomicInteger(100);

    @Override
    public void order() {
        log.info("주문");
        stock.decrementAndGet();
        Counter.builder("my.order")
                .tag("class", this.getClass().getName())
                .tag("method", "order")
                .description("order")
                .register(registry).increment();
    }

    @Override
    public void cancel() {
        log.info("취소");
        stock.incrementAndGet();
        Counter.builder("my.order")
                .tag("class", this.getClass().getName())
                .tag("method", "cancel")
                .description("order")
                .register(registry).increment();
    }
}

카운터 예제 2)

- 위 방식은 서비스 로직과 다른 기능을 하는(모니터 로그를 수집하는) 기능이 로직안에 포함되어 있다.

- 마이크로미터의 AOP 방식으로 관점 분리할 수 있으며 Bean을 생성해주어야 한다.

@Configuration
public class OrderConfigV2 {
    @Bean
    public CountedAspect countedAspect(MeterRegistry registry) {
        return new CountedAspect(registry);
    }
    @Bean
    OrderService orderService() {
        return new OrderServiceV2();
    }
}

@Slf4j
@RequiredArgsConstructor
public class OrderServiceV2 implements OrderService {
    private AtomicInteger stock = new AtomicInteger(100);

    @Counted("my.order")
    @Override
    public void order() {
        log.info("주문");
        stock.decrementAndGet();
    }

    @Counted("my.order")
    @Override
    public void cancel() {
        log.info("취소");
        stock.incrementAndGet();
    }
}

타이머 예제 1)

- registry를 의존하여 로직 안에서 직접 생성

@RequiredArgsConstructor
public class OrderServiceV3 implements OrderService {
    private final MeterRegistry registry;
    private AtomicInteger stock = new AtomicInteger(100);

    @Override
    public void order() {
        Timer timer = Timer.builder("my.order")
                .tag("class", this.getClass().getName())
                .tag("method", "order")
                .description("order")
                .register(registry);
        timer.record(() -> {
            log.info("주문");
            stock.decrementAndGet();
            sleep(500);
        });
    }


    @Override
    public void cancel() {
        Timer timer = Timer.builder("my.order")
                .tag("class", this.getClass().getName())
                .tag("method", "cancel")
                .description("order")
                .register(registry);
        timer.record(() -> {
            log.info("취소");
            stock.incrementAndGet();
            sleep(200);
        });
    }
}

타이머 예제 2)

- 카운터 예제와 동일

@Configuration
public class OrderConfigV4 {
    @Bean
    public TimedAspect countedAspect(MeterRegistry registry) {
        return new TimedAspect(registry);
    }
    @Bean
    OrderService orderService() {
        return new OrderServiceV4();
    }
}

@Timed(value = "my.order")
@RequiredArgsConstructor
public class OrderServiceV4 implements OrderService {
    private AtomicInteger stock = new AtomicInteger(100);

    @Override
    public void order() {
            log.info("주문");
            stock.decrementAndGet();
            sleep(500);
    }


    @Override
    public void cancel() {
            log.info("취소");
            stock.incrementAndGet();
            sleep(200);
    }
}

참고로 진행 중인 프로젝트에 적용하였을 때 정의한 이름의 메트릭이 생성되지 않아 진짜 몇 시간 동안 삽질을 했는데 혹시나 해서 api를 하나 찍어보니 메트릭이 생성되었다. config와 어노테이션으로 정의만 하는 것이 아니라 실제 호출 되었을 때 DB에 정보가 쌓여야 메트릭 정보도 확인이 가능하였다.... ~~자다가도 생각날 만큼 왜 안될까 고민을 너무 많이 함 ㅋㅋㅋ~~

마지막으로...

김영한 강사님의 로드맵을 끝 마치며 정말 항상 감사하고 마지막 말씀이 너무 감동이라 (~~T인데도 불구하고~~) 모든 로드맵 강의에 별점을 5점 박을수 밖에 없었다... 더욱 정진하겠습니다.

참고자료

김영한 : 스프링 부트 - 핵심 원리와 활용

https://www.inflearn.com/course/%EC%8A%A4%ED%94%84%EB%A7%81%EB%B6%80%ED%8A%B8-%ED%95%B5%EC%8B%AC%EC%9B%90%EB%A6%AC-%ED%99%9C%EC%9A%A9/dashboard

스프링 부트 - 핵심 원리와 활용 | 김영한 - 인프런

김영한 | 실무에 필요한 스프링 부트는 이 강의 하나로 모두 정리해드립니다., 백엔드 개발자를 위한 스프링 부트 끝판왕! 실무에 필요한 내용을 모두 담았습니다. [임베딩 영상] 김영한의 스