기록

블루-그린 배포 방식인 Nginx의 로드 밸런싱 기능과 헬스체크를 통해 무중단 배포에 대해 알아보겠습니다. 무중단 배포 시나리오는 다음과 같습니다.새로운 배포 시 두 인스턴스 중 하나만 업데이트하고 Nginx가 트래픽을 새 인스턴스로 라우팅하도록 합니다.배포가 완료되면, 나머지 인스턴스도 동일하게 업데이트합니다.이 과정에서 Nginx가 트래픽을 분산하여 중단 없이 배포를 수행할 수 있습니다.  개발 환경 : AWS EC2(ubuntu 24), Nginx 1.24.0, Spring Boot 31. 헬스 체크 API 만들기헬스 체크는 애플리케이션 인스턴스가 정상적으로 작동하는지 확인하는 메커니즘입니다.간단한 헬스 체크 API 만듭니다.@RestControllerpublic class KeepAliveCont..

티스토리에서 게시글 작성을 하다가 사진을 업로드 하면 가끔 로딩 창이 사라지지 않습니다.로딩 창이 있으면 작성한 글을 수정이나 저장을 할 수 없습니다.그래서 새로고침을 했더니 로그아웃이 되어 있었고 기존에 작성된 글이 사라졌습니다.허망했다. 임시 저장이라도 해둘껄...  이 문제를 해결하기 위해서 위에 있는 로딩 창을 없애고 기존에 작성한 글을 복사하여 다시 작성하는 방법으로 해결하였습니다.순서는 다음과 같습니다.개발자 콘솔로 들어가기오른쪽에 있는 화살표를 클릭마우스를 왼쪽 화면으로 이동왼쪽 화면 전체가 파란색이 되면 클릭5. div 중에 id="mce-modal-block" 찾아가서 postion : fixed 체크 되어 있는 것을 해제한다.그러면 로딩 창이 사라지고 작성한 글을 복사할 수 있습니다...

1. Highcharts 개념과 사용[ Highcharts 이란? ]자바스크립트만으로 다양한 차트를 그려낼 수 있는 차트 라이브러리로, 웹 페이지에서 실시간으로 변경되는 다양한 차트를 그려줄 때 매우 유용한 라이브러리입니다.  [ Highcharts 설치 ]npm install highcharts  개발환경 : React 18, highcharts 6.0.4[ Highcharts 생성 ]import React, { Component } from "react";import Highcharts from "highcharts";const defaultOptions = {  chart: { width: 1560,      height: 250,   },  xAxis: {    crosshair: true..

도서 관리 프로젝트에서 공통적인 4개 항목들을 개별적으로 변경해야 하는 작업을 맡게 되었습니다. 일반적으로 이러한 변경 작업은 모델 창을 사용하여 수행됩니다. 그러나, 모델 창을 통해 데이터를 하나씩 수정하는 방식은 사용자 경험을 저하시키고 작업 효율성을 떨어뜨릴 수 있습니다. 이 문제를 해결하기 위해, 더 가벼운 대안으로 툴팁을 활용해 보았습니다.   1. React-Tooltip 개념과 사용[ React-Tooltip 이란? ]툴팁은 사용자에게 필요한 정보를 간결하고 직관적으로 제공할 수 있는 도구로, 쉽게 말해 말풍선이나 복잡한 UI를 단순화하고 사용자가 더 쉽게 접근할 수 있게 도와줍니다. 특히, React-tooltip 라이브러리를 사용하면 툴팁을 간편하게 구현하고 데이터 수정 작업을 보다 유연..