쓰리뷰 기술블로그 (Page 3)

aws

AWS Summit Seoul 2024

* 강연 목록 1.Key Note * Gen Ai (생성형 Ai) 시대의 도래 2.카카오페이 손해보험 클라우드 DX * 원장 데이터베이스의 집중도를 줄이기 위한 시도 * 원장: 거래를 계정별로 기록하는 장부 * 메시징 기반의 Event Driven 비지니스 로직 처리 * 비용절감을 위한 95%의 Graviton (ARM) CPU 노드 사용 (EKS) * EKS: 쿠버네티스 * 년 1회 실서버 재해복구

ftp

How to access FTP from client with firewall in Windows OS Explorer

Problem (문제점) 윈도우즈 OS, File Explorer를 통해 FTP 접속을 하는 경우 아래와 같은 에러메시지를 보게 됩니다. (방화벽 네트워크 장비를 사용하는 회사에서 접속할 경우) Active Mode vs Passive Mode 원인은 FTP서버는 기본적으로 Passive Mode로 데이터 전송 포트를 별도로 사용하는데 비해 회사 방화벽에서는 Well Known (잘 알려진) 포트 외에는 기본적으로 허용하지 않기

Axios interceptors 를 활용한 Refresh token 만료 시 처리 구현

이슈 JWT refresh token 만료 시 로그인 페이지로 이동하지 않는 현상 문제점 refresh 토큰이 만료된 경우를 구분이 어렵다 access 토큰은 만료되었으나 refresh 토큰은 만료되지 않은 경우에 첫 요청은 실패하지만 react-query에서 3번 더 요청을 하기 때문에 두 번째 요청을 보내기 전에 next auth에서 refresh 토큰을 발급받아서 두 번째 요청은 성공했다 해결

Typescript 함수의 입력 타입과 출력타입 추출하기

라이브러리를 사용하다보면 제공하는 메서드의 대부분의 타입을 import 해서 사용할 수 있지만 그렇지 않은 경우도 있습니다 함수의 입력타입 추출하기 함수로 부터 입력 파라미터 타입을 추출할 수 있는 유틸타입(Parameters)을 사용하면 쉽게 타입을 정의해서 사용할 수 있습니다 * Parameters<함수타입> 과 같이 사용하면 함수의 파라미터타입을 배열로 받을 수 있습니다 function add(a:

github

GitHub PR Approval to Slack

1.Slack의 GitHub 앱의 문제점 Slack GitHub App은 Pull Request 요청에 대한 알림은 보내지만 해당 PR이 승인되었다는 메시지는 보내지 않는 문제점을 가지고 있습니다. 이를 해결하기 위해 GitHub Actions 에서 WebHook을 호출하는 방법으로 문제를 해결하였습니다. 2.Slack WebHook 생성 3.GitHub Actions Yaml 적용 @ 참고자료 Sending messages using incoming webhooksCreate an

[Next.js] Dynamic Import 적용

NextJS환경에서 리포팅 툴을 테스트하면서 dynamic import 라는 흥미로운 기능이 있어 공유 해 봅니다. 리포팅 툴이란 시스템에서 추출한 결과 값을 보고서 양식으로 출력해주는 개발툴입니다. 기존 프로젝트에 다른 개발자가 개발한 서비스를 적용하는 것은 생각보다 쉽지 않은 일입니다. 저는 Next.js 로 구성된 환경에 active report에서 제공하는 Report Viewer를 적용하는 과정에서 몇 차례

azure

루트 도메인, Azure Front Door (CDN) 인증서 등록, 트러블 슈팅기

1.요구사항 루트 도메인에 Azure Front Door(CDN)를 사용하도록 처리해야 하는 과제가 주어졌습니다. 기존에 서브도메인을 CDN 처리할때는 채 10분도 걸리지 않았었던터라 가볍게 생각하였는데 뜻밖의 난관을 여러번 겪게 되었습니다. 2.첫번째 난관 루트 도메인의 경우 @ 레코드를 변경해야 합니다. 하지만 이 DNS 레코드는 중요하기 때문에 기본적으로 사용자가 처리할 수 없게 막혀있습니다.

기술뉴스 모음 2024-03-25

Redis, 라이선스를 BSD 에서 듀얼 라이선스로 변경 (GeekNews) 개발과 보안 통합 '데브섹옵스' 중요해지는 이유 (Wishket) [번역] React 19에서 새롭게 등장하는 클라이언트 사이드 훅 (velog blog) 2030년 AI 글로벌 시장 규모 1800조...2023년 9배 달할 것 (Aitimes) 오픈AI, 올해 중반 'GPT-5' 출시 유력..."일부 기업에 데모 전달" (Aitimes) 피규어 AI, 인간과

대량 엑셀 다운로드

대량 엑셀 다운로드를 구현하기 위해 시도한 시행착오를 정리해보았습니다 😊 기존 엑셀 다운로드 구성 * Machine365의 '기록' 페이지를 렌더링 하기 위한 API 사용하여 데이터를 가져오고 가져온 데이터를 브라우저에서 엑셀파일로 구성해서 다운로드가 되는 방식이었습니다 기존 다운로드의 문제점 * 기존 모니터링 데이터를 가져오는 API는 페이지를 렌더링하기 위해 페이지네이션이 적용되어 있었습니다 * 따라서 엑셀로 구성하는 데이터 수에 비례해서

[flutter] 비동기 병렬 처리(Future.wait) flutter 앱 적용기

들어가는 말 최근 진행했던 flutter 프로젝트에는 화면 당 초기에 2-3번 많게는 4-5번의 api 호출 을 하게 됩니다. 이처럼 여러 번의 api 호출 시 응답 속도를 개선한 경험이 있어 공유합니다. 이때 flutter의 비동기 처리 방식이 javascript와 유사한 부분이 많아 비교 참조 하였습니다. javascript의 비동기 처리 방식 어플리케이션에서 네트워크 요청, 파일 읽기/

기술뉴스 모음 2024-03-11

* 앤트로픽, 현존 최강 LMM '클로드 3' 출시..."GPT-4·제미나이 성능 능가" (aitimes.com) * LLM은 옛말...이미지까지 학습한 'LMM' 뜬다 (aitimes.com) * 머스크 “오픈AI를 오픈하라”…법정까지 가는 ‘인공지능의 철학’ (hani.co.kr) * 앞으로 모든 회사는 콘텐츠 회사가 될 겁니다! (blog.brunch.com) * AI시대에 필요한 개발자, Product Engineer (yozm.wishket.com) * (번역)

[Javascript] 기준 날짜를 내가 설정한 시간의 기준 날짜로 구하기

이슈 * 사용자 기준 시간이 내가 설정한 시간이 아닌 브라우저 시간을 기준으로 나오는 현상이 있었습니다 예시 * 한국(UTC+9) 2024년 3월 5일 아침 8시에 내가 설정한 시간대가 UTC-1이고 기준 날짜를 구하는 경우(UTC+9와 UTC-1은 10시간 차이가 납니다) * 한국 시간: 2024-03-05 08:00 -> 기준 날짜: 3월 5일 * 설정 시간: 2024-03-04

기술뉴스 모음, 2024-03-05

* 2024년 주목해 볼 AWS 주요 고객 사례 모음(amazon.com) * Git의 새로운 기본 Merge 전략 ort(blog.outsider.ne.kr) * CI/CD 도구를 선택하는 방법: 프레임워크(jetbrains.com) * 개발-운영 생산성 모니터링하기(inflab.com) * Jira의 이슈 정렬 방식이 Integer 방식이 아니라고?!(lycorp.co.jp) * 140만, 국내 1위 다이어트 앱은 어떻게 성장했을까?

atlantis

Atlantis for Terraform Automation with Azure multi-subscription

1.Make Azure Service Principal with Multi-Subscription az ad sp create-for-rbac -n "xxx" --role Owner --scopes /subscriptions/xxx-xxx-xxx-xxx-xxx /subscriptions/xxx-xxx-xxx-xxx-xxx 2.Dockerfile command FROM ghcr.io/runatlantis/atlantis:latest ENV ARM_CLIENT_ID=xxx ENV ARM_CLIENT_SECRET=xxx ENV ARM_TENANT_ID=xxx ENV ARM_SUBSCRIPTION_ID=xxx RUN

아키텍처 결정 레코드(ADR)

아키텍처 결정을 가장 효과적으로 문서화하는 방법은 아키텍처 결정 레코드(Architecture Decision Reccord, ADR)을 작성하는 것 입니다 기본 구조 ADR의 기본 구조는 제목(Title), 상태(Status), 콘텍스트(Context), 결정(Decision), 결과(Consequences) 이렇게 5개 섹션으로 구성됩니다 여기에 컴플라이언스(Compliance)와 노트(Notes)라는 추가 섹션을 덧붙일 수 있습니다 제목 * 아키텍처

startup

What is startup traps?

스타트업이 빠질 수 있는 함정에 대해 고민하며 웹서핑을 하다 아래 글이 가슴에 와 닿아서 공유합니다. (번역) 3View는 일당백하는 슈퍼개발자 필수인원을 채용하였고 Full Stack Engineer를 지향하며 업무를 교차하고 Datadog(SaaS)을 통해 SRE, QA를 실현하고 있습니다. 1. 숙련된 개발자를 찾는데 투자하라 2. 품질관리에 일찍 투자하라 3. 프레임웍과 기술 선택에 유의하라 4.

Latest