Programming46 vscode - 특정 프로젝트에만 vscode 설정값 적용 (ex. .prettierrc) {"prettier.configPath": ".prettierrc","editor.formatOnSave": true,"editor.defaultFormatter": "esbenp.prettier-vscode"}프로젝트의 루트 경로에 .vscode/settings.json 폴더와 파일을 생성해 다음과 같이 특별히 적용할 내용을 추가할 수 있다. 2026. 5. 19. vite 으로 리액트 프로젝트 시작하기 vite 으로 리액트 프로젝트 시작하기npm create vite@latest my-react-app 1. 위 명령어 입력 후 'y' 로 진행 2. React 선택 (키보드 방향키로 위/아래 이동하고 "React" 항목에 Enter) 3. typescript 를 사용할것이므로 아래와 같이 "Typescript + React Compiler" 항목 Enter(React Compiler 를 사용하면 useMemo, useCallBack 을 자동으로 적용해주므로 선택) 4. 아래와 같이 설치 후 바로 시작 "Yes" 선택 5. 설치 중... 6. 설치 완료 메세지 (브라우저에 아래 주소 입력하여 페이지 확인) 7. 확인 (아래 Count is 0 버튼 클릭하면 숫자가 증가하는것 확인할 수 있다.).. 2026. 5. 19. 플러터 하위 버전으로 다운그레이드 플러터 업그레이드 후 기존 앱 호환성 문제로 인해 하위 버전으로 내려야 할때가 있다.이런때 다운그레이드가 필요하다. 먼저, pc에 플러터가 설치되어 있는 경로를 확인flutter doctor -v 경로를 확인했으면 그 경로로 이동한다. (아래는 예제 경로)cd /opt/homebrew/Caskroom/flutter/{최초설치버전}/ 현재 채널 및 버전 확인 flutter --version 버전 히스토리 확인https://github.com/flutter/flutter/blob/master/CHANGELOG.md 위 링크에서 버전을 확인 후 원하는 특정버전으로 체크아웃 (아래는 3.22.0로 선택하는경우)git checkout 3.22.0 위 버전으로 다운로드 / 설치 및 정보 확인 (체크하웃 이후 .. 2025. 6. 12. cra 로 생성한 프로젝트에 빌드시 콘솔로그 코드 모두 제거하기 (eject 사용안함) * cra 로 생성한 프로젝트에 babel 재정의 하여 빌드시 콘솔로그 코드 모두 제거 (eject 사용안함) 1. 관련 컴포넌트 설치npm i -D customize-cra react-app-rewired babel-plugin-transform-remove-console 2. package.json 파일 내 react-scripts 를 react-app-rewired 로 변경 "scripts": { "start": "react-app-rewired start", "build": "react-app-rewired build", "test": "react-app-rewired test", "eject": "react-scripts eject"} 3. 프로젝트 루트에 config-overrides.js .. 2025. 2. 26. 애플 앱스토어에 플러터 앱 배포 하기 ios build & deploy : 빌드 및 배포 순서 (맥 기준) 1. 버전 올렸는지 확인 (pubspec.yml) 2. 디버깅 중이면 디버깅을 중단하고, xcode 가 실행중이면 종료한다. (중요) 3. 프로젝트 디렉토리에서 아래 명령 으로 빌드한다.flutter build ipa 4. 빌드가 성공하면 아래 경로에 파일이 생성됐는지 확인한다.build/ios/archive/Runner.xcarchivebuild/ios/ipa/tosomebody.ipa 5. 파인더에서 아래 파일을 우클릭하여 XCode 로 연 뒤 빌드한 앱 선택하고 validate, distribute 순차 실행build/ios/archive/Runner.xcarchive 6. 브라우저로 앱스토어 이동한 뒤 testFlight 에 .. 2025. 2. 26. 구글 플레이스토어에 플러터 앱 배포 하기 구글 플레이 콘솔에 계정은 있다고 치고, 1. 버전 올렸는지 확인 (pubspec.yml)..version: 1.5.5+55.* 버전 숫자 증가 : 위의 버전을 업데트하려면 1.5.6+56 으로~ 2. 프로젝트 디렉토리에서 아래 명령 으로 빌드한다.flutter build appbundle 3. 빌드가 성공하면 아래 경로에 파일이 생성됐는지 확인한다. build/app/outputs/bundle/release/app-release.aab 4. 플레이스토어 콘솔 접속하여 앱선택 > 내부테스트 에 위 파일 업로드 5. 디버그 정보 업로드./build/app/intermediates/merged_native_libs/release/out/lib 안의 디렉토리를 통째로 압축하여 하나의 zip파일로 만들어 올린다.. 2025. 2. 26. pm2 로그 관리 : pm2 logrotate pm2 로그를 효율적으로 관리하기 위해 pm2 logrotate 를 사용한다.로그파일을 용량설정에 따라 날짜별로 잘 분리해주며, 오래된 파일은 삭제도 해준다. pm2 logrotate 설치하기pm2 install pm2-logrotate@2.6.0 * 2.6.0 이 최신버전이 아니지만 최신버전인 2.7.0 에 문제가 있어 @2.6.0 버전으로 설치한다. (로그를 날짜별로 잘 분리해주지 못하는 버그 있음) logrotate 의 설정 상태 조회pm2 conf위 목록에 나온 명령셋을 실행하면 설정을 변경할 수 있다. ex) max_size 를 1M로 변경pm2 set pm2-logrotate:max_size 1M node 의 전반적인 상황 모니터링pm2 monit 끝 2025. 2. 25. nodejs 무중단 서비스 : pm2 nodejs 로 서버를 구성하면, 오류발생시 node서버가 죽어버리는 경우가 생긴다. (죽으면 그대로 서비스 정지)pm2모듈은 위와 같은경우 자동으로 재시작하게 해준다. 그 외 클러스터, 로그 등등 편리한 점이 많으니 꼭 사용하자. pm2 설치npm install -g pm2 서비스의 실행 pm2 start {파일명} 서비스 실행 목록 보기pm2 list 상태 확인pm2 status 서비스 정지pm2 stop {파일명} 서비스 리스타트pm2 reload {파일명}또는pm2 restart {파일명} 프로세스 삭제pm2 delete {파일명} 로그 보기pm2 log {process name | process id] 끝. 2025. 2. 25. Linux : nodejs, npm 개발환경 구성 (+ 버전관리 : nvm) 설치하기 이전에 먼저 저장소 업데이트 진행apt update && apt upgrade nodejs, npm 설치apt install nodejs npm 설치된 node 버전 확인node -v버전을 확인 해보고, 원하는 버전이 아닌경우 아래에서 추가 설정한다. (디폴트로 설치된버전은 한참 아래 버전이므로, 대부분 원하는 버전이 아닐듯...) nvm 설치 (nodejs 버전 관리용)curl -o- https://raw.githubusercontent.com/nvm-sh/nvm/v0.39.1/install.sh | bashsource ~/.bashrc nodejs 최신 버전 목록 조회nvm list-remote 위에서 조회된 버전을 확인 후 원하는 버전으로 선택하여 설치 (아래는 20.18.3 를 선택하여 .. 2025. 2. 25. 사용하려는 npm 패키지가 타입스크립트를 지원하지 않을때 사용 가능하도록 하기 (index.d.ts) 타입스크립트 프로젝트 내에 텍스트를 둥글게 만들어주는 "circletype" 라는 패키지를 사용하려는데, 이 패키지는 타입스크립트를 지원하지 않아 그냥 사용시 오류가 발생한다. 참고로 circletype 라는 패키지는 텍스트 문자열를 아래와 같이 둥글게 만들어 주는 패키지이다.관련 링크 : https://circletype.labwire.ca/ 타입스크립트를 지원하지 않는 패키지를 그대로 사용시 아래와 같이 오류가 발생한다. 위 문제를 제대로 해결하려면 해당 패키지의 타입을 제대로 정의하고 사용해야 하겠지만, 임시로 일단 사용 가능하도록 하려면 아래와 같이 진행한다. 1. tsconfig.json 파일중 아래 (typeRoots) 항목을 추가 하고 저장* 아래 내용 중 typeRoots 설정은 원래 없.. 2025. 1. 15. nodejs 프로젝트 생성 : typescript, eslint, prettier 설정 ** nodejs 프로젝트 생성시 typescript 적용 1. nodejs 프로젝트 생성mkdir projectNamecd projectNamenpm init -ynpm i -D typescript ts-node nodemonnpx tsc --init 2. tsconfig.json 파일에 다음 내용 설정{..."target": "es6","module": "commonjs","outDir": "./dist","rootDir": "./src","strict": true,"moduleResolution": "node","esModuleInterop": true,...} 3. 프로젝트 루트에 dist와 src 폴더를 생성하고 src에 index.ts 파일 생성 4. packagejson에 다음 내용 설정{... 2024. 11. 13. 환경변수 설정파일 (.env) 설치 및 설정 / 사용 nodejs 서버 실행시 환경변수로 사용할 값들을 설정하여 사용할 수 있도록 한다. 1. dotenv 설치 npm i dotenv 2. 설치 이후 프로젝트 루트에 .env 파일 생성# 아래와 같은 형식으로 필요한 값 추가SERVER_PORT = 3000API_BASE_PATH = /api 3. .env 파일에 설정한 값을 사용할때는 아래와 같이 사용..import dotenv from 'dotenv';dotenv.config();const apiBasePath = process.env.API_BASE_PATH;const serverPort = process.env.SERVER_PORT;.. [주의].env파일에 중요한 서버 정보를 저장하여 사용하는경우 소스저장소(git 등)에 업로드 되지 않도록 .g.. 2024. 11. 13. 이전 1 2 3 4 다음