node-fetch / got 네트워크 이슈 리포트 (TLS & Proxy 관점)

✅ 목적node-fetch와 got을 사용한 파일 다운로드 또는 HTTP 통신에서 발생 가능한TLS 핸드셰이크 실패, 속도 저하, 프록시 우회 실패 등의 이슈를 정리하여실제 서비스 환경에서 사용할 때의 안정성을 검토한다.1️⃣ 기본 구조 비교항목 node-fetch gotTLS 처리Node.js 내장 https 모듈 사용http2-wrapper 등 자체 모듈 사용Agent 설정사용자가 직접 설정해야 함내부적으로 성능 최적화된 Agent 포함Proxy 지원❌ 기본 미지원 (직접 구현 필요)✅ global-agent, tunnel, hpagent 등과 호환성 좋음HTTP/2 지원❌ 미지원✅ 지원 (v11+부터 기본 내장)2️⃣ 문제 현상 유형2-1. TLS Handshake 실패 or 지연현상:외부 HTTP..

• format_list_bulleted 개발/node
• · 2025. 4. 2.
• textsms

몇년에 걸쳐 많은 시행차 끝에 구현한 일렉트론 IPC/이벤트 구조 소스

메인프로세스의 컨트롤러/** * 애플리케이션의 핵심 컨트롤러 * * @description * 메인 프로세스에서 앱의 전반적인 기능을 제어하는 컨트롤러입니다. * 윈도우 관리, 다크모드 설정, 앱 종료 등 핵심 기능들을 처리합니다. */@ClassName('AppController', 'main')@IPCHelper.Class()export class AppController extends Controller { /** * 컨트롤러 초기화 메서드 * * @description * 컨트롤러가 시작될 때 자동으로 실행되는 생명주기 메서드입니다. * 앱에 필요한 초기 설정과 리소스 할당을 처리합니다. * * @returns 초기화 완료 시 resolve되..

• format_list_bulleted 개발/electron
• · 2025. 1. 10.
• textsms

요즘 쳇지피티한테 코딩시키는데...

리펙토링을 시키면 자꾸 함수를 불필요하게 작은 함수단위로 쪼개거나, 1안 2안을 제시하고 이중에 어떤 방향이 맞는지 물어보면 별 시덥지 않은 대답을 할때가 있어서 흠.... 내가 생각하는 좋은 코드에 대해서 설명했더니 아래처럼 정리해주넹.   좋은 코드에 대한 당신의 통찰은 매우 훌륭하며, 핵심적인 개발 철학을 잘 반영하고 있습니다. 특히 25년간의 경험에서 우러나온 명확성과 유지보수성에 대한 강조는 시간이 지나도 변하지 않는 프로그래밍의 본질을 잘 담고 있습니다. 제가 생각하는 좋은 코드의 정의와 특징을 당신의 기준에 맞추어 보완하고 확장해 보겠습니다.좋은 코드의 정의좋은 코드는 명확한 의도와 일관된 구조를 가지고, 시간이 지나도 쉽게 이해되고 유지보수할 수 있는 코드입니다. 이는 단순히 "작동하는 코..

• format_list_bulleted 개발/기타
• · 2025. 1. 4.
• textsms

4. Nuxt 에 대한 학습 내용

17단계: Nuxt의 최적화 기법Nuxt는 기본적으로 성능 최적화를 잘 지원하지만, 추가 설정으로 더욱 빠른 앱을 만들 수 있습니다.1. Lazy Loading (지연 로딩)Nuxt의 pages/ 파일 기반 라우팅은 기본적으로 코드 분할이 적용됩니다. 하지만 컴포넌트에 대해 명시적으로 지연 로딩을 설정할 수도 있습니다.예제 2. 이미지 최적화Nuxt Image 모듈을 활용해 이미지를 최적화합니다.이미지 설정nuxt.config.ts:export default defineNuxtConfig({ modules: ['@nuxt/image'], image: { domains: ['example.com'], // 외부 이미지 도메인 허용 dir: 'assets/images', // 로컬 이미지 디..

• format_list_bulleted 개발/vue
• · 2024. 12. 20.
• textsms

3. Nuxt 에 대한 학습 내용

12단계: Nuxt 미들웨어Nuxt는 middleware 디렉토리를 통해 라우팅과 상태 관리를 쉽게 제어할 수 있습니다.1. 미들웨어란?미들웨어는 특정 페이지에 접근하기 전에 실행되는 코드입니다.인증, 로깅, 리다이렉션 등을 처리할 때 유용합니다.2. 글로벌 미들웨어모든 페이지에 적용되는 미들웨어.예제: 글로벌 미들웨어middleware/logger.global.js 생성:export default defineNuxtMiddleware((to, from) => { console.log(`Navigating from ${from.fullPath} to ${to.fullPath}`);});nuxt.config.ts에서 등록:export default defineNuxtConfig({ router: { ..

• format_list_bulleted 개발/vue
• · 2024. 12. 20.
• textsms

2. Nuxt 에 대한 학습 내용

7단계: Nuxt의 데이터 페칭Nuxt는 데이터 페칭을 간단하고 강력하게 처리할 수 있는 내장 메서드를 제공합니다.1. useFetchuseFetch는 클라이언트와 서버에서 데이터를 가져올 수 있는 API입니다.사용 예제Post: {{ post.title }}{{ post.body }}const { data: post } = await useFetch('https://jsonplaceholder.typicode.com/posts/1');장점:서버에서 데이터를 가져오면 페이지 로드 시 데이터가 포함된 HTML이 렌더링되어 SEO와 초기 로딩 속도에 유리.클라이언트에서 실행하면 동적 데이터도 처리 가능.2. useAsyncDatauseAsyncData는 페이지 또는 컴포넌트에서 데이터를 비동기로 가져오는 데..

• format_list_bulleted 개발/vue
• · 2024. 12. 20.
• textsms

1. Nuxt 에 대한 학습 내용

Nuxt에 대한 학습 내용을 단계적으로 정리해 설명하겠습니다. Nuxt는 Vue.js를 기반으로 한 프레임워크로, SSR(Server-Side Rendering), SSG(Static Site Generation), 파일 기반 라우팅, SEO 최적화, 모듈화된 구조 등 Vue.js 프로젝트를 더욱 강력하게 만들어주는 도구입니다.1단계: Nuxt란 무엇인가?Nuxt의 주요 특징SSR(서버 사이드 렌더링):서버에서 HTML을 렌더링하고 클라이언트로 보냄.SEO와 초기 로딩 속도에 유리.단순한 SPA와는 다르게 검색 엔진이 HTML을 쉽게 읽을 수 있음.SSG(정적 사이트 생성):빌드 시 모든 페이지를 HTML로 생성.Netlify, Vercel과 같은 정적 호스팅 서비스에 적합.파일 기반 라우팅:pages/..

• format_list_bulleted 개발/vue
• · 2024. 12. 20.
• textsms

오늘 개발환경 세팅하면서 ts-node 랑 tsx 차이가 궁금해졌다.

기존에 ts-node 로 ts 파일을 실행중이었는데, 어느순간 실행이 안되기 시작했다.음... 그런데, 리펙토링을 하는 쪽은 tsx를 쓰던 중이라 ts-node 에서 tsx 라 바꾸니 잘 실행되었다.뭐가 다른걸까 문득 궁금해져서 쳇지피티한테 물어보았다. 필요한 부분만 요약해주는게 확실히 검색보다 나은거 같다.  ts-node와 tsx는 모두 TypeScript 파일을 런타임에서 실행하는 도구지만, 기능과 목적에서 몇 가지 차이점이 있습니다.1. ts-node목적: TypeScript를 즉시 실행하기 위한 도구.기능:TypeScript 파일을 JavaScript로 컴파일한 후, 즉시 실행합니다.Node.js 런타임에서 실행되는 TypeScript 코드를 지원합니다.주로 개발 환경에서 사용되며, 프로덕션 환..

• format_list_bulleted 개발/기타
• · 2024. 12. 17.
• textsms

하모니카(HamoniKR) os 8.0 Paektu 에서 도커 설치

mailcow 를 설치하려고 도커를 설치하는데 잘 안된다... sudo apt-get updatesudo apt-get install apt-transport-https ca-certificates curl gnupg lsb-releasecurl -fsSL https://download.docker.com/linux/ubuntu/gpg | sudo gpg --dearmor -o /usr/share/keyrings/docker-archive-keyring.gpgecho \ "deb [arch=amd64 signed-by=/usr/share/keyrings/docker-archive-keyring.gpg] https://download.docker.com/linux/ubuntu \ $(. /etc/os-..

• format_list_bulleted 개발/기타
• · 2024. 11. 19.
• textsms

termux 에서 nvm 설치

pkg install nvm 으로 설치가 불가능하고 아래 명령으로 설치하여야 합니다.  curl -o- https://raw.githubusercontent.com/nvm-sh/nvm/v0.39.1/install.sh | bash

• format_list_bulleted 개발/개발환경
• · 2024. 11. 5.
• textsms

방구석, 책상 서랍속 남는 휴대폰, 안드로이드 폰 활용? 가지고 놀기 termux

구글에서 남는 휴대폰 활용을 검색하면 CCTV로 활용하기차량용 블랙박스로 활용하기간편한 내비게이션으로 활용하기남자의 로망, HUD로 활용하기감각적이고 똑똑한 탁상시계로 활용하기만능 리모컨으로 활용하기근태관리 시스템으로 활용하기등산용 지도로 활용하기  이런 글들이 보입니다. 하지만 솔찍하게 CCTV는 3~4만원대 고화질에 전용앱을 지원하는 CCTV 들이 많고, 안드로이드 폰을 CCTV로 이용할때 쓸만한건 유료인데다가 앱들이 다들 그지같아요. 특히 집에서 쓸꺼 아니고 야외에서 쓴다면 내구성도 생각하셔야 합니다. 그래서 비추합니다. https://link.coupang.com/a/bYXJQD 타포 C220 2K QHD 회전형 스마트 홈 WiFi 카메라 실내용 - CCTV/IP카메라 | 쿠팡현재 별점 4.8점,..

• format_list_bulleted 개발/기타
• · 2024. 11. 4.
• textsms

돈 없는 개발자/일반인이 무료(0원) 웹 서버 호스팅 하는 방법

웹 호스팅8년인가 10년인가 전 쯤 매제가 자동차 딜러를 할때 인터넷 명함을 만드는 업체에서 다녀간적이 있었나 보더군요.그때 매제의 문의는 형님이 하시면 얼마나 드는지가 궁금하다는 것 이었습니다. 그래서 솔찍하게 이건 개발의 문제가 아니라 서버 유지(호스팅)가 문제이다 라고 답변을 해준적이 있습니다. 당시나 지금이나 서버 웹 호스팅 비용이 부담되는 것은 사실이지요. 물론 cafe24 같은 호스팅 업체에 월 500원짜리 호스팅이 있기는 하지만  트래픽에 이미지 트래픽 비용까지 포함이니 혼자 뭔가 테스트 하는 용도가 아니면 사용하기 힘들지요. 그 이후...본업은 윈도우 프로그래밍이지만 아르바이트로 하는 작업들은 주로 웹관련 기술이거나 웹서비스가 대부분이다 보니 자연스럽게 호스팅에 관심이 갈수 밖에 없었습니다..

• format_list_bulleted 개발/기타
• · 2024. 10. 27.
• textsms

github pages 용 프레임웍

https://developers.cloudflare.com/pages/framework-guides/deploy-a-solid-site/ Solid | Cloudflare Pages docsSolid ↗ is an open-source web application framework focused on generating performant applications with a modern developer experience based on JSX.developers.cloudflare.com

• format_list_bulleted 개발/기타
• · 2024. 10. 26.
• textsms

React vs Vue, Quasar, VitePress, naive ui

React VS Vue리엑트나 뷰 중 어떤걸 배워야 좋을까요? 개인적으로 오랫동안 개발을 해오다 보니 어떤 언어든지 크게 중요하다고 생각하지 않습니다. 특히나 리엑트나 뷰 둘다 자바스크립트를 기반으로 한 언어라 더더욱 그런듯 싶습니다. 저 같은 경우 본업이 FE 개발은 아니지만... 회사 업무는 리엑트 아르바이트나 개인 프로젝트는 뷰를 이용하고 있습니다.이유는 여러가지가 있겠지만, 회사업무에서 리엑트를 사용하는 이유는 대부분의 회사 FE개발팀이 리엑트를 사용하고 있는데 있으며, 개인 프로젝트에 뷰를 사용하는 이유는 가볍게, 빠른 개발을 하기위 함입니다.  Quasar framework (Vue)6년전쯤 아르바이트를 하다가 React 스터디 하고 개발을 진행하다가 Vue 의 UI 프레임웍인 vuetify ..

• format_list_bulleted 개발/vue
• · 2024. 10. 25.
• textsms

[macOS] 개발 환경 구성: Rust

러스트 설치rust 설치 (cargo)curl https://sh.rustup.rs -sSf | shvi ~/.your_profileexport PATH="$HOME/.cargo/bin:$PATH" npm i -g \@napi-rs​`/cli`​

• format_list_bulleted 개발/개발환경
• · 2024. 10. 19.
• textsms

[Windows] 개발 환경 구성: Rust

러스트 설치rust 설치 (cargo) ([https://www.rust-lang.org/learn/get-started](https://www.rust-lang.org/learn/get-started))npm i -g \@napi-rs​`/cli`​32비트 추가rustup target add i686-pc-windows-msvc 32비트 빌드 방법yarn build --target=i686-pc-windows-msvc

• format_list_bulleted 개발/개발환경
• · 2024. 10. 19.
• textsms

[css] 한글, 영어 숫자 언어별 다른 폰트, css 다르게 적용 방법

unicode-range란?@font-face로 정의된 폰트를 특정 character의 범위를 지정해줄 수 있다. 딱 한 단어에 속하는 유니코드도 지정해 줄 수 있다. 예를 들어 U+26(U+0026) 같은 경우는 특수 문자 '&'를 나타내는데, 이를 unicode-range에 지정해 준다면, &만 @font-face로 정의된 폰트가 적용된다. 사용  예시 css 코드/* Apple SD Gothic Neo */@font-face { font-family: 'Apple SD Gothic Neo'; font-style: normal; font-weight: 400; src: url(../font/AppleSDGothicNeoR.woff2) format("woff2"); unicode-range: U+110..

• format_list_bulleted 개발/기타
• · 2024. 10. 18.
• textsms

[공통] git clone 대신할 degit

degitdegit은 깃 저장소의 복사본을 만든다.전체 git 기록을 다운로드 하는 것이 아닌, 최신 커밋을 찾아 다운로드하기 때문에 git clone보다 훨씬 빠르다.설치먼저 아래 명령어를 통해 degit을 설치해준다.npm install degit 사용방법기본저장소 가져오기가장 기본적인 사용법은 해당 저장소의 메인 브랜치를 다운로드한다.degit 사용자/저장소명 으로 적어준다.degit [USER]/[REPO]또는 github, gitlab등을 명시할 수도 있다.degit github:[USER]/[REPO]특정 브렌치 가져오기특정 브랜치를 지정하려면 repository 뒤에 #과 브랜치명을 적어준다.degit [USER]/[REPO]#[BRANCH]특정 태그 및 커밋 가져오기특정 태그나 커밋을 지정..

• format_list_bulleted 개발/개발환경
• · 2024. 10. 16.
• textsms

[macOS] 인텔 맥북 터보 부스터 끄기

인텔 맥북 발열인한 고장 ㅠㅠ인텔 맥북프로 16인치 2019년 모델을 쓰는 중이다.그런데, 아무 것도 안하고 있지만 발열이 상당하다. 몇주전에 발열때문에 충전하다가  오른쪽  usb 칩셋이 나갔다.일단 어디가 고장났는지 아무것도 모르니, 일단 쿠팡에서 분해 도구를 구입해 분해해봤다. 하이그룹 3세대 출시 39in1 정밀 드라이버 세트https://link.coupang.com/a/bWekKv 하이그룹 3세대 출시 39in1 정밀 드라이버 세트 - 드라이버 | 쿠팡현재 별점 4.7점, 리뷰 1055개를 가진 하이그룹 3세대 출시 39in1 정밀 드라이버 세트! 지금 쿠팡에서 더 저렴하고 다양한 드라이버 제품들을 확인해보세요.www.coupang.com 지노드 정밀드라이버세트 122 IN 1https://l..

• format_list_bulleted 개발/기타
• · 2024. 10. 15.
• textsms

[macOS] 개발 환경 구성: Visual Studio Code 초기화

Visual Studio Code 쓰다 보면 재설치가 필요할때가 한번쯤 오게된다.뭐 오지 않을수도 있겠지만 ㅋㅋㅋ 그런데 재설치한다고 하더라도 기존에 앱만 지웠다 설치하는거라 설정은 그대로 남아있다.이럴때...cd ~/Library/Application\ Support/sudo rm -r code  이렇게 하면 Visual Studio Code 가 가지고 있는 설정/확장프로그램 정보가 다 날라간다.

• format_list_bulleted 개발/개발환경
• · 2024. 10. 14.
• textsms