티스토리

신규하 블로그

검색하기

블로그 홈

신규하 블로그

gyuha.tistory.com/m

신규하 님의 블로그입니다.

구독자: 3

방명록 방문하기

주요 글 목록

VSCode에서 python 개발 환경 구성 하기 간만에 python을 개발해 보려고 vscode에 세팅을 하다가 Ruff라는 것을 알게 되어서 정리 해 봅니다. Ruff 소개 Rust로 작성된 매우 빠른 파이썬 린터 및 코드 포매터입니다. 이전에 formatter와 linter를 쓰기 위해서 black, flake8 또는 pylint 등 이것 저것 조합해서 사용을 했었는데. 이걸 한번에 사용 할 수 있습니다. 거기다 기존 linter나 formatter보다 속도가 10~100배까지 빠르다고 합니다. VSCode에서 설정 하기 설치 확장 Python: 파이썬 개발을 위해서 가장 기본적으로 설치 해 줘야 하는 확장입니다. Pylance : 유용한 랭기지 서버로, Pyright를 이용해서 정적 유형 검사로 구동 되며, IntelliCode를 같이 사용 하면.. 공감수 1 댓글수 0 2023. 12. 19.
발헤임 유니티 에디터기에서 띄워보기 발헤임을 유니티 에디터기에서 띄워 보기를 해 봤는데.. 잘 되어서 기록 해 봅니다. 그런데, 버전이 중요 합니다. 버전이 달라 지면, 잘 안 되네요 ㅜ.ㅜ 발헤임을 분석해 보고 싶거나, 모드를 만드시려는 분은 참고 하세요. 준비물 발헤임 버전 v0.209.10 되도록이면 위 버전이 좋습니다. 최신 버전에서는 이벤트 관련 오류가 잔뜩 발생하고, 이전 버전은 유니티 2019로 개발 되어서 테스트 해 보지 않았습니다.. 포럼에 보니.. 버전이 올라가면 다른 오류가 발생 하는 것 같더라군요... 위 버전이 트러블 없이 가장 깔끔하게 실행이 되었습니다. AssetRipperGUI 0.2.3.0 다운로드를 받고 실행 하고 싶은 곳에 압축을 풀어 줍니다. ValheimExportHelper 1.2.0 다운르도를 받고.. 공감수 2 댓글수 0 2022. 10. 6.
Fontforge로 영문 폰트와 한글 폰트 합치기 먼저 Fontforge 사이트에서 소프트웨어를 다운로드 받습니다. https://fontforge.org/en-US/ FontForge FontForge is a free and open-source outline font editor. fontforge.org 설치 하고 나면, 한글이 나오는데.. 많은 부분이 깨져서 나옵니다. 영문으로 실행 하고 싶다면, C:\Program Files (x86)\FontForgeBuilds\fontforge.bat 파일에서 ::set LANGUAGE=en 위 부분은 아래와 같이 변경 해 줍니다. set LANGUAGE=en 한글이 잘 되면 좋은데.. 깨져서 나와서.. 도저히 쓸 수가 없어서.. 전 이렇게 사용 했습니다. 여기서 사용한 폰트는 JetBrains Mono .. 공감수 0 댓글수 0 2022. 10. 5.
유니티에서 BlendShape의 노멀이 깨져 보일때.. 이렇게 보이면, 해당 모델의 인스펙터에서.. Blend Shape Normals를 None 또는 Import로 변경해 주시면 됩니다. 공감수 0 댓글수 0 2022. 9. 14.
WSL2에서 Docker Desktop을 사용하지 않고 docker 설치하기.. Docker Desktop이 2022년 8월 31일 부터.. 250명 미만이고 년간 수익이 천만달러(약100억) 미만인 기업에서만 Docker Desktop을 무료로 사용 할 수 있다고 합니다. 개인이나 비영리는 계속 사용 가능 하고요. 그래서, Docker Desktop에서 벗어 날려고 자료를 좀 정리 해 봤습니다. WSL에 Docker 설치하기 먼저 시스템에는 WSL2가 설치가 되어 있어야 합니다. wsl이 설치가 되어 있지 않다면 아래 URL을 참고 해서 설치 해 주시면 됩니다. https://docs.microsoft.com/ko-kr/windows/wsl/install wsl의 배포판이 설치 되어 있지 않다면, 아래와 같이 wsl --list --online 이라고 하면 유효한 배포 목록이 나옵.. 공감수 0 댓글수 0 2022. 8. 29.
윈도우 10에서 Docker desktop이 포트 충돌로 실행 되지 않을 때.. 윈도우10에서 도커를 사용하면서 간혹 포트가 충돌 난다고 해서.. 도커 이미지가 뜨지 않을 때가 있습니다. 이럴때는 아래와 같이 해 보세요.. 우선, 관리자 모드롤 cmd또는 powershell을 띄웁니다. 우선 하이퍼-V를 꺼 줍니다. dism.exe /Online /Disable-Feature:Microsoft-Hyper-V 재부팅을 해 줍니다. 해당 포트를 제외해 줍니다. 여기서는 1433포트를 예제로 했습니다. netsh int ipv4 add excludedportrange protocol=tcp startport=1433 numberofports=1 그리고 다시 파이퍼-v를 켜 줍니다. dism.exe /Online /Enable-Feature:Microsoft-Hyper-V /All 그리고 .. 공감수 0 댓글수 0 2021. 8. 20.
웹페이지 파비콘을 이미지로 사용하기 link 태그에 아래와 같은 형식으로 이모지를 넣어 주면 된다. Emoji 공감수 2 댓글수 0 2021. 4. 21.
vscode에서 한번에 여러 프로젝트 한번에 불러 오기 vscode로 작업 하면서, 프론트와 백엔드를 별도의 제작해서 사용하는 경우가 있습니다. 매번 실행 프로젝트를 띄울때 마다.. 여러개의 창을 띄워야 하는데.. 이게 귀찮아서 한방에 띄우는 batch 파일을 한번 만들어 봤습니다. @echo off set paths[0]="C:\workspace\project-frontend\" set paths[1]="C:\workspace\project-backend\" set paths[2]="C:\workspace\project-cms\" for /F "tokens=2 delims==" %%s in ('set paths[') do ( echo run %%s cd %%s CALL code . ) 위에서 코드에서 paths의 폴더와 숫자를 신경써서 넣어 주시면 됩니다. 공감수 0 댓글수 0 2021. 3. 10.
Typescript로 만든 react 프로젝트에서 경로 별칭 사용하기.. react 프로젝트를 진행하다 보면 아래와 같이 경로가 복잡해 지는 경우가 있습니다. import MyComponent from "../../../../../components/MyComponent" 이럴때 간단하게 별칭을 사용해서 아래와 같이 줄이는 방법을 소개 합니다. import MyComponent from "@/components/MyComponent" tsconfig.json에 아래와 같이 추가를 해 줍니다. { "compilerOptions": { // 추가 룰 "baseUrl": "./src", "paths": { "@/*": ["*"], } } } create-reacte-app으로 프로젝트를 만들었다면, npm run eject를 해 주시고 tsconfig-paths-webpack-pl.. 공감수 1 댓글수 0 2020. 11. 23.
Create React App으로 만든 electron앱에서 fs 사용하기.. fs 모듈을 쓰려고 하면 `Module not found` 라고 오류가 발생합니다. 문제는 webpack 타겟을 electron-renderer으로 잡아야 하는데, CRA(Create React App)으로 만든 프로젝트는 yarn eject를 해서 수정을 해 줘야 한다. 여기서는 eject를 하지 않고 해결하는 방법이 2가지을 소개 합니다. craco를 사용하기 craco는 CRA로 만든 프로젝트를 eject하지 않고 간단하게 설정하게 해 주는 패키지이다. 먼저 craco를 설치해 줍니다. $ npm i -D @craco/craco 그리고, craco.config.js 파일을 만들고 아래 내용을 입력해 줍니다. module.exports = { webpack: { configure: { target: .. 공감수 0 댓글수 0 2020. 9. 20.
react-create-app으로 만든 typescript 프로젝트에 eslint 적용하기 적용해 보면서 하도 고생해서 정리해 봅니다. Create-react-app 먼저 create-react-app를 통해서 프로젝트를 생성합니다. $ yarn create react-app my-app-name --template=typescript $ cd my-app-name Eslint 생성된 프로젝트 폴더로 이동한 후 eslint를 설치 해 줍니다. $ yarn add -D eslint 이게 yarn eslint --init을 통해서 eslint를 설정해 줍니다. $ yarn eslint --init ? How would you like to use ESLint? To check syntax only To check syntax and find problems ❯ To check syntax, fin.. 공감수 0 댓글수 0 2020. 9. 15.
Typescript 기반으로 React Electron App 시작하기. 먼저 기본적으로 node.js가 설치가 되어 있다는 가정으로 설명 합니다. yarn이 설치 되어 있지 않다면 먼저 yarn을 설치해 줍니다. yarn은 npm과 같은 node의 패키지 매니저 입니다. $ npm install -g yarn 그리고, create-react-app을 통해서 타입스크립트 기반의 프로젝트를 생성해 줍니다. $ npx create-react-app my-app-name --template typescript $ cd my-app-name 위와 같이 명령어를 넣어 주면 타입스크립트 기반으로 react와 webpack 설정이 되어 있는 프로젝트가 설정 됩니다. 이제 Electron과 실행에 필요한 패키지를 설치해 줍니다. 아래 패키지들은 개발에서만 사용되는 패키지라서 --dev를 붙.. 공감수 5 댓글수 2 2020. 9. 15.
vscode에서 vue 프로젝트 생성시 ESlint와 Prettier 설정해 주기 기존에 사용하던 TSLint가 더이상 지원을 받지 못 하게 되면서, ESlint로 넘어가야 상태가 되었습니다. 여기서는 Vue 프로젝트를 생성하면서 ESlint와 Prettier를 사용하는 세팅을 간단하게 설정하려고 합니다. 사용하는 툴은 vscode입니다. vue create myproject 형태로 기본 프로젝트를 선택 합니다. > npx vue create myproject ? Please pick a preset: Manually select features ? Check the features needed for your project: (*) Babel (*) TypeScript ( ) Progressive Web App (PWA) Support ( ) Router ( ) Vuex (*) CS.. 공감수 2 댓글수 0 2020. 4. 19.
Postman에서 응답으로 받은 변수 사용하기 Postman을 사용하다 보면 요청한 값을 변수를 이용해서 저장하고 싶은 데이터가 있을 경우가 많습니다. 예를 들면 인증키 값이라던지, 사용자 정보 등등.. 이 있는데.. 이럴때 사용할 수 있는 유용한 기능이 있어서 소개 합니다. Tests를 기능을 이용하는 방법입니다. 물론 테스트용도로 사용한다면 더욱 훌륭하게 사용 할 수 있을 겁니다. 먼저 사용할 요청에서 Tests 탭을 선택하고 아래와 같이 넣어 줍니다. var jsonData = JSON.parse(responseBody); if (jsonData.result === true) { pm.environment.set("authToken",jsonData.data.authToken); } 그리고 혹시 요청의 내용을 보고 싶다면 아래와 같이 conso.. 공감수 0 댓글수 0 2020. 4. 7.
medis를 윈도우용으로 빌드하기.. https://github.com/luin/medis medis는 앱스토어에서 $4.99에 판매하는 redis용 gui 어플리케이션입니다. 하지만, 소스를 직접 컴파일하면 사용이 가능 합니다. 그런데 윈도우용 컴파일 링크가 있는데.. 이상한 설치 화면이 나오고, 빌드 한지도 2년이 넘었길래 빌드 하는 스크립트를 만들어서 직접 빌드를 해 봤습니다. https://github.com/gyuha/medis 아래 주소에서 소스를 clone 받으신 후 > npm install > npm run packWin 이렇게 하면 .\dist\out\Medis-win32-ia32 폴더에 실행 파일이 생깁니다. 실행하면 아래와 같이 나옵니다. https://github.com/gyuha/medis/commit/acf42bec.. 공감수 3 댓글수 3 2020. 4. 4.
자바스크립트 배열 메서드 정리 Array 추가/삭제 Array.push() 배열의 마지막 요소를 추가해 줍니다. let number_arr = [ 1, 2, 3, 4, 5 ]; number_arr.push(6); console.log(number_arr); // [ 1, 2, 3, 4, 5, 6 ] Output : [1, 2, 3, 4, 5, 6] Array.unshift() 배열의 가장 첫번째 요소를 추가해 줍니다. let number_arr = [ 1, 2, 3, 4, 5 ]; number_arr.unshift(6); console.log(number_arr); // [ 6, 1, 2, 3, 4, 5 ] Output : [6, 1, 2, 3, 4, 5] Array.pop() 배열의 가장 마지막 요소를 삭제 합니다. let numb.. 공감수 0 댓글수 5 2020. 2. 2.
윈도우 터미널 프리뷰 복사/붙여 넣기 단축키 설정하기 Windows Terminal (preview)를 기본 cmd 대신 써 볼까하고 사용중인데.. 복사/붙여넣기가 잘 동작하지 않아서 방법을 찾아서 공유 합니다. 메뉴에서 settings 또는 Ctrl + ,을 누르면 메모장에 설정값이 표시 됩니다. 여기서 keybindings에 아래와 같은 내용을 추가 하면 됩니다. "keybindings": [ { "command": "paste", "keys": ["ctrl+shift+v", "shift+ins"] }, { "command": "copy", "keys": ["ctrl+shift+c"] } ] 복사는 ctrl+shift+c로 가능하고 붙여 넣기는 ctrl+shift+v또는 shft+ins로 가능해 집니다. 잘 사용하세요~ 공감수 1 댓글수 2 2020. 1. 28.
vscode에서 JetBrains Mono 폰트 사용하기 개발툴로 유명한 JetBrains에서 코딩용 새로운 고정폭폰트를 공개 했습니다. 상업적용도와 비상업적용도 모두 사용이 가능한 아파치2.0 라이센스 입니다. 그런데, 이 폰트에 보면 합자(ligature)기능이 있습니다. 이 기능은 코딩하다 보면 많이 쓰이는 ==이나 !=를 합자 형태로 표시해서 가독성을 높여주는 기능입니다. 대략적으로 보면 아래와 같이 차이가 있습니다. 그리고, vscode에서는 합자 기능을 사용할 수 있습니다. 설정하는 방법은 File > Preferense > Settings (단축키: Ctrl + ,)을 선택하고 상단에 Open Settings(JSON) 버튼을 눌러 줍니다. 그리고, 아래 내용을 추가해 주면 됩니다. { "editor.fontFamily": "Jetbrains Mo.. 공감수 8 댓글수 0 2020. 1. 17.
TypeORM 데이터베이스 자료형 TypeORM에서 자료형이 데이터베이스 마다 약간이 다른게 지원하고 있어서.. 정리 해 본 김에 공유 합니다. 표를 다시 만들려고 했지만, 너무 번거로워서 캡쳐 본을 올립니다. 자세한 내용은 아래 링크를 봐주시면 됩니다. https://docs.google.com/spreadsheets/d/1YqU1048fIpxxLMJ5eOxLEfxKUAN9AdVuTaL4kbPad7g/edit?usp=sharing 공감수 0 댓글수 0 2020. 1. 12.
MediaWiki에 VisualEditor 설치하기 어쩌다 미디어위키에 Visual Editor를 설치 할 일이 생겨서 설치 하면서 고생을 많이 해서 정리해 둡니다 ㅜ.ㅜ. Visual Editor Extension 설치 하기 https://www.mediawiki.org/wiki/Extension:VisualEditor 우선 이 사이트에 방문해서 아무런 생각없이 사이트에서 git으로 설치 하라는 대로 설치하고 띄워 봤더니.. 하얀 화면만 나오고 아무것도 없이 먹통이 되더군요 -_-;; 뭐가 잘 못 된지도 모르고 하얀 먹통이라서 뭐가 잘 못 된지도 모르는 채 하루를 날려 버렸습니다. 😨 결국 알아 낸것이 버전에 맞는 extension을 설치해야 하는 것이였습니다.. 아래 url에 가서 내가 설치한 mediawiki와 맞는 버전을 찾아서 받아서 설치해야 합.. 공감수 1 댓글수 10 2020. 1. 11.
윈도우용 패키지 매니저 Chocolatey 사용법 Chocolatey는 윈도우용 패키지 매니저로, 설치하려는 윈도우용 소프트웨어를 일일이 웹사이트에서 찾아서 설치할 필요 없이 간단하게 커맨드 만으로 윈도우용 소프트웨어를 설치 할 수 있게 해 줍니다. Chocolatey 설치 chocolate를 설치 하려면 관리자 권한 cmd나 PowerShell을 실행해서 설치를 해 줘야 합니다. cmd 사용시 @powershell -NoProfile -ExecutionPolicy Bypass -Command "iex ((new-object net.webclient).DownloadString('https://chocolatey.org/install.ps1'))))" && SET PATH=%PATH%;%ALLUSERSPROFILE%\chocolatey\bin power.. 공감수 8 댓글수 3 2020. 1. 10.
타입스크립트, AWS 서버리스로 들어올리다. 올해 초에 쓰기 시작했는데.. 연말이 돼서야 겨우 완료했습니다. 실무 개발을 해 보면서 프로젝트를 진행할 때, 최소한 이런 건 알고 하면 좋겠다 싶은 것들을 넣다 보니까 페이지가 많이 늘어나 버렸습니다. 뭔가 하나를 깊게 파는 서적인 아니지만, 전체적인 흐름 파악이나 개발의 선택 과정을 파악 할 때는 도움이 될 것이라는 생각으로 글을 썼습니다. 책 소개 타입스크립트를 활용한 웹 애플리케이션 개발 가이드 북 현재 웹 애플리케이션을 개발하기 위한 많은 개발 환경과 그 환경에 맞는 다양한 방법들이 생겨나고 있다. 그래서 우리는 어떤 방법으로 개발을 시작해야 할지 선택하기를 주저하게 된다. 이 책에서는 실무에 적합한 플랫폼과 다양한 개발 프레임워크 및 라이브러리를 소개하고, 각 상황에 맞는 플랫폼 및 프레임워크.. 공감수 0 댓글수 48 2019. 12. 9.
Typescript에서 default import 개선.. express를 import하면 아래와 같이 import 했을 겁니다. import * as Express from 'express'; 하지만 tsconfig.json 파일에 아래 내용을 추가 하면.. { "compilerOptions": { "allowSyntheticDefaultImports": true, "esModuleInterop": true, } } 이렇게 import가 가능해 집니다. import Express from 'express' 공감수 0 댓글수 0 2019. 8. 12.
세계 국기 SVG 파일 국제화 개발 하다 보면, 간혹 필요한 국기 이미지 입니다. 벡터인 svg 파일이라서 필요에 따라서 변환해서 사용 하세요. 공감수 2 댓글수 0 2019. 7. 12.
웹 캐시를 지우고 리로딩하기.. SPA를 개발하다 보면, 앱의 버전을 올려서 서버에 반영을 했는데, 웹은 캐시를 타버려서 업데이트가 되지 않는 경우가 빈번합니다. 웹 서버와 웹 어플리케이션의 버전이 맞지 않아서 이상하게 동작도 하고.. 대략적으로 난감한 경우가 발생해서, 캐시를 지우고 리로드 하는 코드를 간단하게 만들어 봤습니다. caches .keys() .then(c => { for (const i of c) { caches.delete(i); } }).then(() => { location.reload(true); }); 그리고 아래는 axios를 이용해서 버전을 확인하고 업데이트를 진행하는 코드 입니다. import * as axios from 'axios' console.log('current version :', versio.. 공감수 0 댓글수 3 2019. 5. 24.
Git에서 branch를 master로 바꾸기.. 소스를 관리 하다가.. master가 branch와 간격이 많이 버러졌는데.. branch를 master로 써야 할 경우 입니다. git checkout newFunction git merge -s ours master git checkout master git merge newFunction 방법은 새로운 브렌치에 master를 ours로 머지해 버리고 maser에 다시 머지하는 방법입니다. -s ours 는 —strategy=ours 의 단축 된 표현 입니다. 공감수 0 댓글수 0 2019. 4. 18.
bash에서 git 업데이트 체크 하기.. git에서 업데이트 된 내용이 있으면 받는 bash 스크립트 입니다. changed=0 git remote update && git status -uno | grep -q 'Your branch is behind' && changed=1 if [ $changed = 0 ]; then exit 0 fi git pull # 실행 할 코드 들... 주기적으로 업데이트가 있으면 pull을 받았으면 해서 찾아 봤습니다. 공감수 0 댓글수 0 2019. 4. 10.
vscode에서 현재 Typescript 파일 디버깅... 먼저 node_modules에 ts-node와 typscript를 추가해 준다. $ npm install --save-dev ts-node typescript .vscode/launch.json 파일에 아래와 같이 추가.. { "version": "0.2.0", "configurations": [ { "name": "Debug Current ts file", "type": "node", "request": "launch", "program": "${workspaceRoot}/node_modules/ts-node/dist/bin.js", "args": ["${relativeFile}"], "cwd": "${workspaceRoot}", "protocol": "inspector", "env": { "stag.. 공감수 1 댓글수 0 2019. 3. 12.
Node.js에서 euc-kr 인코딩 하기... node에서 어쩌다 보니.. euc-kr을 인코딩 디코딩 할 일이 생겨서 해 보고 고생한 김에.. 메모를 남긴다. 우선 iconv-lite 패키지를 설치해야 한다. $ npm install iconv-lite 아래는 euc-kr인 문서를 읽어서 utf-8로 바꾸고 euc-kr로 바꾸는 예제이다. let iconv = require('iconv-lite'); let fs = require('fs'); // 처음 로딩시 enc-kr 파일 let content = fs.readFileSync('content-kr.txt'); console.log(content.toString()); let utf8Str = iconv.decode(content, 'euc-kr'); console.log(utf8Str); //.. 공감수 2 댓글수 9 2019. 3. 7.
VSCode에서 Live2d 캐릭터 띄우기.. 먼저 띄운 화면을 보고 가시죠~캐릭터 얼굴이 마우스 움직이는 방향으로 움직입니다.너무 귀엽죠?그러면, 설치를 해 볼까요?먼저, 확장프로그램에서 live2d를 검색해서 설치해 줍니다.그리고 재실행을 해주시면, 아무것도 안 나옵니다. -_-;F1 또는 Ctrl+Shit+P을 누르고 live2d install을 해 줍니다. 그리고 다시 VSCode를 실행 해 줍니다.그러면, 고양이가 왼쪽 하단에 나옵니다.그리고, 나오는 경고… 살포시 무시하기 위해서 고양이를 살짝 옮기시고, 기어 버튼을 누릅니다.그리고 그만볼래(Don't Show Again)을 눌러 줍니다.우리는 고양이에 만족 할 순 없으니.. 다른 캐릭터를 찾아 봅니다.https://github.com/summerscar/live2dDemo위 주소를 이동해.. 공감수 0 댓글수 0 2019. 1. 23.

문의안내

티스토리
로그인
고객센터

티스토리는 카카오에서 사랑을 담아 만듭니다.