dog paw / development

서랍 속에 잠자는 구형 안드로이드 폰 있으신가요? 그냥 두기엔 아깝고 팔기엔 값어치도 없는 그 폰, 웹서버로 만들 수 있습니다. 완전 무료로요.이게 진짜 되나요?됩니다. 안드로이드 폰은 결국 리눅스 기반 컴퓨터입니다. Termux라는 앱을 설치하면 폰에서 리눅스 명령어를 실행할 수 있고 웹서버도 띄울 수 있습니다.활용 예시:- 개인 테스트 서버- 개발 중인 사이트 데모용- 가족/지인에게 임시 공유용- 집 안에서만 쓰는 내부망 서버준비물✅ 안드로이드 폰 (버전 7.0 이상)✅ 충전기 (계속 꽂아둬야 함)✅ Wi-Fi 연결✅ 저장공간 여유 1GB 이상1단계 - Termux 설치Play 스토어 버전은 오래된 버전이라 F-Droid에서 설치해야 합니다.1. f-droid.org 접속 → F-Droid 앱 다운로..

✅ 목적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..

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

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', // 로컬 이미지 디..

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: { ..

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는 페이지 또는 컴포넌트에서 데이터를 비동기로 가져오는 데..

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/..

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

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-..

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

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

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

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

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

러스트 설치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

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..

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

인텔 맥북 발열인한 고장 ㅠㅠ인텔 맥북프로 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..

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

자바스크립트자바스크립트를 처음 접한것이 고등학교를 졸업(1997년)하고 전문컴퓨터 학원에서 공부를 하며 정보처리 기사시험을 본 후 유료강좌 수업을 들어갔을때 였습니다.당시 과정은 2년과정으로 1년은 정말 빡시게 정보처리 기사 공부를 하고(시간이수를 위해서 하루 8시간씩...), 시험을 합격한 다음해에는 학원에 유료과정 중 원하는걸 아무거나 들을 수 있었습니다.당시에 당시에 영화 접속이 한창 유행이었네요. 그리고 국내 웹사이트들이 막 태동기 였습니다. 그래서 웹페이지를 만드는 수업을 배우며 자바스크립트에 대해서 듣게 되었습니다.그때, 강사선생님이 앞으로 자바스크립트를 설명하며 자바라는 언어가 있는데, 둘은 완전히 다른 언어이며 앞으로 자바가 대세가 될꺼라고 이야기하셨습니다. 그래서 본인도 자바를 지금 배우..