- 이번 포스팅에서는 NextJS 를 사용하여 다국어 처리를 어떻게 하는지와 SEO(Search Engine Optimization, 검색 엔진 최적화)에 대해 알아보겠습니다.아시다시피 IT 는 물리적 공간의 제약을 넘어서는 기술이고, 국내 시장에 비해 국제시장의 규모는 굉장히 가능성이 많은 기회를 제공합니다.서비스 종류에 따라 다르긴 하지만, 언제든 다국어를 지원할 수 있게 처리를 해둔다면 추후 고생할 것 없이 이득을 볼 수 있겠죠.또한, 웹 서비스를 만드는 이유와, 특히 Server Side Rendering 프레임워크인 NextJS 를 사용하는 이유는 검색엔진이 내 사이트를 잘 파악해서 홍보하게 만드는 것이므로, NextJS 에서 검색엔진 최적화를 어떤 방식으로 처리하는지를 정리할 것입니다. (결과..

- 이번 포스팅에서는 MSA(Micro Service Architecture) 에서 인증/인가 서비스를 따로 떼어내어 운용하는 방식의 장점과 그 구조, 효율적인 구성 방식에 대해 알아보겠습니다.실제 코드 구현에 대한 설명글이 아니므로 프로그래밍 언어, 프레임워크와는 무관한 이론적인 내용이 될 것입니다. (MSA 의 중요성)- 먼저 MSA 의 중요성에 대해 먼저 설명하겠습니다.제가 이 글을 쓰는 이유는, 아직 MSA 를 본격적으로 적용하지 않는 개발자들이 많음을 알고 있기 때문이며,다른 것은 아니더라도 인증/인가 서비스 정도는 MSA 로 구현한다면 정말 도움이 많이 될 것이라고 생각하기 때문입니다.고로 사용하지 않는다는 것은 해당 기술의 중요도나 장점에 대해 모르기 때문일 것이므로 기본부터 설명드리는 것입..

- 이번 포스팅에서는 Zoom 과 같은 인터넷 영상 통신 서비스에서 실시간 배경 합성을 어떤식으로 구현한 것인지를 알아보겠습니다.간단히 코드만 공개드립니다. 1. ReactJS 에서 Tensorflow 를 동작 가능하게 지원해주는 라이브러리를 사용하기 위하여,생성한 ReactJS 프로젝트에서 터미널에,npm install @tensorflow/tfjs @tensorflow-models/body-pix 위 명령어를 입력하여 ReactJS 텐서플로 라이브러리를 설치하면 준비가 됩니다. 2. ReactJS 코드는 아래와 같습니다.import React, { useEffect, useRef, useState } from "react";import * as bodyPix from "@tensorflow-model..

- 이번 포스팅에서는 티켓과 서버 큐를 사용하여 서버 접속량 폭증에 대한 처리를 어떻게 해야하는지를 정리하겠습니다.예를들어 유명 콘서트 예매 서비스나 강의 수강, 정부 정책에 따른 전국민 재난 지원금 서비스, 기대작 게임의 런칭시 짧은 시간 내에 굉장히 많은 인원이 몰릴 것이라 예상이 되는 상황에 흔히 대기열이라는 것이 생기고 순차적으로 인터넷 서비스를 제공하는데,이를 어떤식으로 구현하는 것인지에 대한 전체적인 아키텍쳐와 패턴에 대해 정리하고 설명할 것입니다. - 적용 기술은 아래와 같으므로 이미 알고 계시다면 바로 적용이 가능할 것입니다.1. Client-Server 구조 RestAPI2. SSE or WebSocket or Polling3. Redis4. DBMS5. 공유락 - 접속 대기 처리는 현실..

- 이번 포스팅에서는 ReactJS 를 사용하여 SSE 이벤트를 수신하는 방식을 알아보겠습니다.SSE 기술에 대한 설명은, Springboot SSE(Server Sent Event) 구현하기 포스트를 참고하세요. - SSE 에 대하여 간단히 설명하자면,application/json 형식의 단발식 요청 - 응답 네트워크 기술이 아니라,Socket 과 같이 연결식으로 데이터를 받아오는 기술인데,양방향으로 정보를 교환하는 것이 아닌, 단방향으로 서버에서 발행한 이벤트를 수신만 하는 기술을 의미합니다. ChatGPT UI 에서, 위와 같이 한번에 답을 반환하는 것이 아니라,토큰 하나씩 지속적으로 결과를 반환하는 기술을 구현한다면 서버에서 반환하는 응답을 한번에 받는 것이 아니라 계속해서 연결해 두어야 하며, ..

- 이번 포스팅에선 음성인식, 객체 탐지, 이미지 분류, 이미지 검색, OCR 등 모바일 인디바이스 환경에서 처리할 수 있는 매력적인 기능들을 구현하기 위한 첫번째 스탭으로, 모바일에 딥러닝 모델을 올려서 실행하는 방법에 대해 정리하겠습니다. 1. HuggingFace 에서 사전 학습된 모델 가져오기2. 모바일 연동용 모델 변환3. 파인 튜닝의 필요성4. 모바일 연동 샘플 위와 같은 순서로 진행하겠습니다. (허깅 페이스에서 사전 학습된 모델 가져오기)- 모바일 디바이스는 아시다시피 PC 와 달리 굉장히 제한적인 환경입니다.반대로 딥러닝은 모델 종류에 따라 일반적인 PC 에서도 사용하기 어려울 수 있는 무거운 기술이고요.먼저, 개발할 기능을 설계할 때, 해당 기술이 현 시점의 모바일 환경에서 실행 가능할지..

- 오랜만에 Flutter 를 다루게 되어 이렇게 글을 올립니다.Flutter 에 대해서는 제 블로그에 거의 올리지 않았기에 먼저 기술 소개부터 드리자면,Flutter 는 모바일 앱(iOS, Android), 웹, PC 응용 프로그램(Linux, Windows, MacOS) 을 한번에 개발 가능한 만능 클라이언트 개발 프레임워크입니다. 빌드 결과물의 성능이 네이티브 응용 프로그램에 거의 뒤지지 않을 수준이므로,잘만 사용한다면 1인으로 모바일에서 웹까지, 클라이언트를 전부 맡아서 개발이 가능하다는 것(바이브 코딩도 곁들여서)과, 모듈화 및 프로젝트 구조화만 잘 한다면 서로 다른 플랫폼 배포 및 관리도 최소 비용으로 가능하다는 장점이 있습니다. - 이번 포스팅에서는 Flutter 를 사용하여 ClientSi..

- 이번 포스팅에선 Java Springboot 에서 JPA 라이브러리를 사용할 때,Entity 에서 각 변수를 어떻게 매핑해야 할 지에 대해 정리하겠습니다. - JPA 는 ORM(Object Relational Mapping) 입니다.즉, Database 의 저장 정보를 Programming Language 에서의 객체로 다루는 기술로,Database 의 테이블 단위로 Java Class 에 매핑하여 사용합니다. 즉, Database 테이블이 하나의 class 로 표현해야 하며,이때에 각 컬럼은 프로그래밍 언어의 변수로 표현됩니다. 본 게시글에서는 Database 컬럼 타입별 Java 언어에서 어떠한 변수로 매핑해야 하는지에 대해 정리할 것입니다. RDBMS 는 MySQL 을 기준으로 하며,이에따라 M..

- FastAPI 에는 동기 처리 방식과 비동기 처리 방식이 있습니다.동기 처리 방식은, API 요청시 하나의 요청을 다 처리한 후 다음 요청을 처리하는 방식입니다.즉, 처리에 5라는 시간이 걸리는 작업과 1이라는 시간이 걸리는 작업이 순차적으로 요청된다면,작업 5 가 다 끝나야 작업 1 이 시작되는 것이죠. 비동기 처리 방식은 다릅니다.작업 5 가 처리되는 도중에 작업 1이 요청되면, 두 작업이 병렬적으로 처리되는 방식입니다. 이처럼 서버의 작업 처리는 비동기 방식이 보다 성능상 유리하다는 것을 알 수 있습니다. - FastAPI 에서 비동기적으로 작업을 처리할 때에는 멀티 스레드를 사용하는 것이 아닙니다.멀티 스레드를 사용하면 위에서 설명한 병렬 처리가 될테지만, 스레드를 너무 많이 생성하면 일어날 ..

- 이번 포스팅에선 FastAPI 에서 Database 를 사용하는 방법을 정리할 것입니다.https://github.com/RaillyLinker/Python_FastApi_Template설명에 사용할 코드는,위 레포지토리 안의 module_sample_sql_alchemy 폴더에 모듈 단위로 떼어내 정리하였으므로 참고하면 되며,본 게시글에서는 코드상 중요한 부분을 설명하겠습니다. - ORM 이란,Object-Relational Mapping의 줄임말입니다.ORM은 데이터베이스의 테이블을 프로그래밍 언어(예: Python, Java 등)의 '객체'처럼 다루게 해주는 기술로,SQL 쿼리(SELECT, INSERT, UPDATE 등)를 직접 작성하는 대신,클래스(예: User, Product)와객체(예: ..