모두 이루지리라 얍!

들어가며모바일 웹 환경에서 입력창을 만들다 보면,“엔터를 눌러도 아무 반응이 없다”는 문제를 자주 겪게 됩니다.데스크탑에서는 onKeyDown 이벤트가 잘 작동하는데,모바일(특히 iOS Safari)에서는 동일한 코드가 전혀 반응하지 않는 현상이 발생합니다.이 글에서는 그 원인과 함께,HTML5 속성인 enterKeyHint를 이용해 문제를 깔끔하게 해결하는 방법을 정리합니다.문제의 원인1. 모바일 가상 키보드의 동작 차이모바일 기기의 가상 키보드는 입력 필드의 type 속성이나 form 구조에 따라“엔터(↵)” 키의 역할이 달라집니다.예를 들어,iOS Safari에서는 에서 Enter를 눌러도 줄바꿈 처리만 되고 이벤트가 발생하지 않음Android에서는 브라우저에 따라 Enter가 onKeyDown..

개요Syncthing은 중앙 서버 없이 로컬 장치 간 파일을 자동으로 동기화해주는 오픈소스 도구입니다.이번 글에서는 macOS와 안드로이드 간에 Syncthing을 사용해 Logseq 데이터를 자동으로 동기화하는 방법을 단계별로 정리했습니다.1. Syncthing 개념 이해Syncthing은 다음과 같은 구조로 작동합니다.P2P 방식: 클라우드 서버를 거치지 않고, 장치 간 직접 연결자동 동기화: 파일 변경 즉시 감지 및 전송보안 연결: TLS 기반 암호화 통신, Device ID를 통한 승인된 장치만 연결 가능즉, 같은 네트워크가 아니더라도 인터넷만 연결되어 있으면 언제든 파일을 동기화할 수 있습니다.2. macOS에서 Syncthing 설치 및 실행1) 설치Homebrew를 이용해 Syncthing을..

macOS에는 기본적으로 pf(Packet Filter)라는 방화벽 기능이 내장되어 있습니다. 이를 이용해 PostgreSQL(15432 포트)과 SSH(22 포트)의 접속을 특정 IP만 허용하도록 제어할 수 있습니다. 특히 IP 리스트를 데이터베이스에서 관리하면, 서버 관리 효율성과 보안성을 동시에 확보할 수 있습니다.1. FastAPI를 통한 pf 규칙 적용아래 코드는 FastAPI에서 /apply_ips API를 호출했을 때 DB에서 허용 IP를 조회하고, pf 규칙을 갱신하는 예제입니다.@router.get("/apply_ips")def apply_ips(user: str = Depends(get_current_user)): print("Apply IPs Called") # ✅ DB에서..

맥에서 기본으로 제공하는 화면 공유(VNC)를 이용해 원격 맥에 접속할 때, 텍스트 복사/붙여넣기가 정상적으로 되지 않는 경우가 있습니다.예전에는 원격 맥에서 복사한 내용을 로컬 맥에서 바로 붙여넣을 수 있었는데, 새 컴퓨터로 바꾸고 나니 클립보드 가져오기 버튼을 눌러야만 동작하는 현상이 발생했습니다.이 문제는 공유 클립보드(Universal Clipboard) 기능을 활성화하여 해결할 수 있습니다.증상원격 맥에서 텍스트를 복사한 후 로컬 맥에서 붙여넣기가 되지 않음화면 공유 앱 내에서 클립보드 가져오기를 눌러야만 동작함예전 맥에서는 ⌘C → ⌘V로 바로 사용 가능했음원인macOS 버전 변화 및 기본 설정 차이로 인해 화면 공유 앱에서 자동 클립보드 동기화가 정상적으로 되지 않는 경우가 있습니다.이때, ..

맥에서 Dock을 자동 숨기기로 설정했는데, 커서를 화면 하단에 가져가도 Dock이 나타나지 않는 문제가 발생할 수 있습니다. 이 문제는 종종 macOS의 Dock 프로세스가 일시적으로 오작동할 때 생깁니다. 처음 이런 현상이 생기면 내가 새로운 방법으로 업데이트가 된건 아닌가 하고 한참을 다른 방법을 시도 했었습니다.하지만 시간 낭비일 뿐이 였어요.문제 증상Dock 자동 숨기기 설정이 되어 있음커서를 화면 하단(또는 Dock이 위치한 곳)으로 가져가도 Dock이 나타나지 않음시스템 설정을 껐다 켜도 변화 없음해결 방법아래 방법으로 간단히 해결할 수 있습니다.1. Dock 프로세스 재시작터미널을 열고 다음 명령어를 입력합니다:killall Dock이 명령어는 Dock 프로세스를 강제로 종료하고 자동으로 ..

1. 개요무상증자가 발생한 경우, 기존 가격 데이터를 보정하지 않으면 차트나 백테스트 결과가 왜곡될 수 있습니다. 특히 1주당 3주 무상증자의 경우 기존 가격은 1/4 수준으로 조정해야 하며, 본 문서에서는 일봉과 분봉 데이터에 적용하는 마이그레이션 방법을 설명드립니다.2. 보정 비율 계산1주당 3주 무상증자 → 총 4주 보유보정 비율 = 1 / (1 + 3) = 0.253. 일봉 데이터 보정 쿼리 예시UPDATE stock_dailySET open_price = open_price * 0.25, high_price = high_price * 0.25, low_price = low_price * 0.25, close_price = close_price * 0.25WHERE stock_..

1. 캔들 차트 기본 설정chart = createChart(chartContainerRef.current, { width: chartContainerRef.current.clientWidth, height: 500, layout: { background: { color: '#ffffff' }, textColor: '#000' }, timeScale: { timeVisible: true, secondsVisible: false, rightOffset: 3, barSpacing: 5 }, crosshair: { mode: 1, horzLine: { visible: true }, vertLine: { visible: true } }, grid:..

기존에 Create React App(CRA)로 개발해온 프로젝트를 Vite로 마이그레이션하면서 겪은 삽질과 해결 과정을 정리했습니다. 실제 에러 메시지와 해결 과정을 그대로 담았기 때문에, 비슷한 작업을 하려는 분들에게 도움이 될 수 있을 겁니다.1. CRA에서 Vite로 전환 이유CRA 빌드 속도에 불만HMR이 느림config override가 귀찮음최신 생태계는 Vite를 지향하는 추세2. 초기 설정npm create vite@latest템플릿은 react + javascript 선택기존 CRA 구조와 맞추기 위해 디렉토리 구조는 유지기존 public/, src/ 그대로 복사 후 시작3. entry 파일 변경 (main.js → main.jsx)CRA에서는 index.js 또는 main.js 를 e..

1. nvm이란?nvm(Node Version Manager)은 여러 버전의 Node.js를 한 시스템에서 쉽게 설치하고 전환할 수 있는 도구입니다.2. 설치 방법 (macOS, Linux)2-1. nvm 설치curl -o- https://raw.githubusercontent.com/nvm-sh/nvm/v0.39.7/install.sh | bash2-2. 설치 적용 (터미널 재시작 또는 아래 명령 실행)export NVM_DIR="$HOME/.nvm"[ -s "$NVM_DIR/nvm.sh" ] && \. "$NVM_DIR/nvm.sh"2-3. 설치 확인nvm --version3. Node.js 설치 및 사용법3-1. Node.js 특정 버전 설치nvm install 20.19.03-2. 설치한 버전 사..

숫자를 테이블이나 리스트로 화면에 보여줄 때, 특히 가격이나 수익률 같은 데이터를 다룰 때, "정렬이 이상하게 보인다"는 느낌을 받은 적이 있다면 그 원인은 폰트일 가능성이 크다. 문제 상황: 가변폭 폰트의 한계일반적인 웹 폰트는 대부분 가변폭(font-proportional) 폰트다.이는 글자마다 가로 폭이 다르다는 뜻이다.예를 들어 다음 숫자를 보자:123,000 99,100 6,200겉보기엔 오른쪽 정렬을 했지만 숫자 자릿수가 다르고 각 글자의 폭도 달라서 들쭉날쭉해 보인다.특히 1은 좁고 0은 넓기 때문에 숫자가 시각적으로 밀려 보이는 문제가 생긴다.해결책: 고정폭 폰트(monospace)고정폭 폰트는 모든 문자(숫자 포함)의 너비가 동일하다.즉, 1이나 0이나 동일한 간격으로 표현된다. 이 ..