티스토리

믹아의 개발일기

검색하기

블로그 홈

믹아의 개발일기

mik-a.com/m

개인 공부 블로그

구독자: 2

방명록 방문하기

주요 글 목록

Nextjs 로딩 next-nprogress-bar 적용 안되는 이슈 사용법은 간단하고 다른곳 문서, 설명도 많으니 여기선 생략 합니다. --- next-nprogress-bar 로 로딩 이미지를 보여주고 있었는데 어느 순간 안되기 시작.progressbar dom 은 추가되는데 스타일이 안먹는 것 보고 확인해봄 next-nprogress-bar 에서는 #nprogress 즉 id 를 이용해서 스타일을 먹이고 있음. next-nprogress-bar 에서 사용중인 라이브러리 nprogress-v2 코드를 보러가자 엥 여기는 클래스 이름으로 nprogress 를 먹이고 있음. 근데 예전엔 잘 됐었는데? 싶어서 이전 버전을 보러감1.0.4 버전이 다운로드수가 제일 많아서 그냥 바로 1.0.4 보러감 원래는 id 로 nprogress 를 주고 있었음...버전 업데이트 하면서 .. 공감수 0 댓글수 0 2025. 3. 26.
Docker login - User interaction is not allowed. $ docker login {registryURL}$ Error saving credentials: error storing credentials - err: exit status 1, out: `error storing credentials - err: exit status 1, out: `User interaction is not allowed.`` 이렇게 뜸.$ security unlock-keychain$ docker login {registryURL}Login Succeeded 이렇게 해결 공감수 0 댓글수 0 2025. 2. 12.
node-gyp 에 의한 ModuleNotFoundError: No module named 'distutils' 에러 yarn 으로 package 를 설치하는데 에러가 발생했다 에러 전문 Progress: resolved 763, reused 737, downloaded 0, added 739, done node_modules/.pnpm/node-sass@9.0.0/node_modules/node-sass: Running install script, done in 260ms node_modules/.pnpm/node-sass@9.0.0/node_modules/node-sass: Running postinstall script, failed in 366ms .../node_modules/node-sass postinstall$ node scripts/build.js │ Binary found at /Users/mik_a/.. 공감수 0 댓글수 269 2024. 3. 14.
Nginx 에서 Socket.io 세팅하기 개발 당시에는 localhost:3000 의 주소를 이용해서 nodejs socketio 서버랑 통신했었다. 이후 서버에 올리고 포트번호가 아닌 cname 을 통해서 통신하기 위해서 nginx 세팅을 했다. server { listen 443 ssl; ssl_certificate /etc/letsencrypt/live/my.co.kr/fullchain.pem; ssl_certificate_key /etc/letsencrypt/live/my.co.kr/privkey.pem; server_name api.my.co.kr; access_log /var/log/nginx/my-access.log; error_log /var/log/nginx/my-access.log; location / { proxy_pass .. 공감수 2 댓글수 20 2023. 2. 11.
Windows Cuda, Pytorch 설치 기록 pytorch 를 사용하는데 세팅을 자주 하는게 아니다 보니 매번 까먹어서 기록할려는 글. windows용 도커도 조만간 만들어야겠다. 1. cuda 설치 https://developer.nvidia.com/cuda-11-7-0-download-archive?target_os=Windows&target_arch=x86_64&target_version=10 CUDA Toolkit 11.7 Downloads Resources CUDA Documentation/Release NotesMacOS Tools Training Sample Code Forums Archive of Previous CUDA Releases FAQ Open Source PackagesSubmit a BugTarball and Zip Ar.. 공감수 1 댓글수 265 2022. 12. 12.
Package.json dependencies 최신 버전으로 업그레이드 하기 npm i -g npm-check-updates ncu -u npm install 알아서 최신 버전으로 업데이트 된다 공감수 0 댓글수 24 2022. 12. 2.
[AWS EC2] EC2 Timezone 한국으로 변경 nodejs express 서버를 로컬에선 오차없이 실행되다가 서버에만 올리면 이상해지길래 timezone 문제라고 생각이 들었다. sudo rm /etc/localtime sudo ln -s /usr/share/zoneinfo/Asia/Seoul /etc/localtime 이후 nodejs 재실행하니 제대로 동작했다. 공감수 0 댓글수 26 2022. 9. 5.
[Flutter] iOS : 개발자를 확인할 수 없기 때문에 ‘iproxy’을(를) 열 수 없습니다. 새로운 맥에서 ios 실기기 빌드하는데 해당 에러가 뜨면서 앱이 하얀화면에서 멈춰있었다. [VERBOSE-2:FlutterObservatoryPublisher.mm(101)] Failed to register observatory port with mDNS with error -65555. [VERBOSE-2:FlutterObservatoryPublisher.mm(103)] On iOS 14+, local network broadcast in apps need to be declared in the app's Info.plist. Debug and profile Flutter apps and modules host VM services on the local network to support debugg.. 공감수 1 댓글수 10 2022. 8. 3.
[Nextjs] useEffect 가 2번 실행되는 문제 nextjs에서 useEffect가 아무리봐도 2번 실행시킬 코드가 아닌데 자꾸 2번 실행돼서 찾아봤다. next.config.js 에서 reactStrictMode 를 false 로 변경하고 앱을 재실행하자. [ Found a change in next.config.js. Restart the server to see the changes in effect. ] const nextConfig = { reactStrictMode: false, } 됐다 https://stackoverflow.com/questions/71835580/useeffect-being-called-twice-in-nextjs-typescript-app useEffect being called twice in Nextjs Types.. 공감수 1 댓글수 6 2022. 6. 7.
[Flutter] flutter 3.0 업데이트 후 iOS 빌드 에러 Xcode's output: ↳ Writing result bundle at path: /var/folders/mw/s87p0r9j4cnbnl0pbskz815h0000gp/T/flutter_tools.NCX2rj/flutter_ios_build_temp_dirpXAxz0/temporary_xcresult_bundle : Error: Member not found: 'UnicodeChar'. ../…/src/structs.g.dart:661 int get UnicodeChar => Char.UnicodeChar; ^^^^^^^^^^^ : Error: Setter not found: 'UnicodeChar'. ../…/src/structs.g.dart:662 set UnicodeChar(int value) .. 공감수 1 댓글수 17 2022. 5. 18.
[Flutter] Avoid 'print' calls in production code. 의 이유 개발하다보면 값을 확인하기위해 print 로 확인하는 경우가 많다. 그런데 Avoid 'print' calls in production code. 가 뜨면서 사용을 권장하지 않는다. 이유가 뭘까 일단 이 경고가 뜨는건 flutter 2.3.0 이후로 추가된 flutter_lints 패키지의 영향이다. 간단하게, flutter 에서 권장하는 문법으로 코딩하게 조언해주는 패키지다 pubspec.yaml 파일에 가보면 이렇게 패키지가 등록되어있을텐데 삭제하면 이 경고는 더 이상 뜨지 않는다. 경고를 해주는 이유는 print() 는 release 모드로 빌드해도 logcat 등에 그대로 출력된다. 만약 사용자에게 숨겨야하거나 민감한 내용을 print 를 삭제하지 않아서 로그에 그대로 나오게 된다면 문제가 생길수.. 공감수 1 댓글수 8 2022. 5. 9.
[Flutter] xcode build parse issue module not found ios 빌드를 해야하는 일이 있어서 xcode 에서 빌드를 하는데.. Parse Issue, Module not found 에러가 떴다.. 알고보니 flutter/ios 폴더의 Runner.xcodeproj 파일로 프로젝트를 열었는데 Runner.xcworkspace 로 프로젝트를 열어야 했다. 아무튼 이렇게 빌드랑 시뮬레이터에서 실행까진 완료했는데 archive 하려니깐 또 위의 에러가 뜨더라.. 쩝. 해결하긴 했는데 뭐가 문젠진 모르겠다. 1. flutter clean 2. flutter pub get 3. cd ios 4. pod install clean 으로 빌드 파일 등을 싹 지우고 pod install 로 새로 설치해주니 archive 가 되긴 되더라. 아마 앱패키지명이랑 버전등 이것저것 바꾸.. 공감수 1 댓글수 8 2022. 2. 4.
[Flutter] CocoaPods could not find compatible versions for pod "Firebase/CoreOnly" flutter 에서 fcm 을 추가하기 위해 firebase core 와 firebase messaging 을 추가하고 빌드하려니 에러 발생. -------------- firebase_core: Using Firebase SDK version '8.10.0' defined in 'firebase_core' firebase_messaging: Using Firebase SDK version '8.10.0' defined in 'firebase_core' [!] CocoaPods could not find compatible versions for pod "Firebase/CoreOnly": In Podfile: firebase_core (from `.symlinks/plugins/firebase_core.. 공감수 1 댓글수 1,025 2022. 1. 12.
[Flutter] VScode 에서 region 을 이용하여 코드 folding 하기 어떤 기능에 대한 코드를 아주 많이 작성하는 경우도 있다. 이게 줄이 길어질수록 한눈에 딱딱 보기가 조금 어려워진다 예전에 유니티할땐 #region ~~ 으로 묶을수가 있었는데 flutter[dart] 에서는 그런기능이 없나? 찾아봤다 https://marketplace.visualstudio.com/items?itemName=maptz.regionfolder #region folding for VS Code - Visual Studio Marketplace Extension for Visual Studio Code - Provides folding for text wrapped with #region comments in VS Code. marketplace.visualstudio.com vscode의.. 공감수 0 댓글수 441 2021. 12. 30.
[Nginx] 403 forbidden ( 13 : permission denied ) nginx로 웹서버를 하나 열었더니 권한 에러가 뜬다 "/root/master/index.html" is forbidden (13: Permission denied), 해당 index.html 의 권한을 먼저 보고 ls -l root 사용자로 돼있다. 이후 nginx 설정 파일을 수정하자 nano /etc/nginx/nginx.conf 첫줄의 user 를 root 로 바꿔주니 해결됐다. 이것저것 찾아보니 방법이 많던데 나는 이걸로 해결돼서 일단 올려놓음 공감수 4 댓글수 48 2021. 11. 23.
[Nginx] 에러 로그 실시간 확인 하기 tail -f /var/log/nginx/error.log tail 명령어에 -f 옵션을 줘서 실시간으로 변경되는걸 확인 할 수 있다 공감수 1 댓글수 51 2021. 11. 23.
Fail2ban 설치 0. 집에 라즈베리파이를 설치, 서버를 열어놨다. 근데 어느순간부터 ssh가 렉이 엄청 먹길래 무슨일인가 싶어서 보니 cpu 사용량이 100%를 찍고있었다. 아무것도 안했는데 그래서 해킹인가 싶어서 ssh 접속 기록을 찾아봤다 sudo nano /var/log/auth.log 난리가 났다. 모르는 아이피에서 엄청나게 짧은 간격으로 계속 접속을 시도하고 있었다. fail2ban 을 설치해서 한번 무차별 접속을 막아보자 1. 설치 sudo apt install fail2ban 2. 세팅 세팅 파일을 작성하자 sudo nano /etc/fail2ban/jail.local # jail.local [DEFAULT] # 최대 입력 허용 횟수 maxretry = 5 # 밴 시간 (초), -1 : 영구 bantime .. 공감수 0 댓글수 47 2021. 6. 7.
Flutter doctor - Android Studio (not installed) 해결 분명 안드로이드 스튜디오가 설치되어있는데 설치되지 않았단다. flutter config --android-studio-dir="C:\Program Files\Android\Android Studio" 안드로이드 스튜디오의 경로를 지정해주자 안드로이드 스튜디오 문제는 해결됐다 그런데 이제 갑자기 Android toolchaing 에서 경고가 뜬다. flutter doctor --android-licenses 이게 제대로 라이센스 동의하는 문구가 나올수도 있고 이런 에러가 나올 수도 있다. (Exception in thread "main" java.lang.NoClassDefFoundError: javax/xml/bind/annotation/XmlSchema) 라이센스 동의하는 문구가 나오면 y 입력으로 그.. 공감수 10 댓글수 7 2021. 5. 22.
[Flutter] listview 이전 아이템들 렌더링 유지하기 listview 를 사용중인데 item 에 image 가 들어간다. 문제는 이 이미지가 network 에서 받아와서 이미지의 높이를 받아오기전까지 모른다는거... 그래서 이미지를 받아와서 container height 를 설정해주고 있다 문제는 리스트뷰를 쫙~ 내리고 다시 올라올때 listview 특성상 기존 아이템들을 잠시 제거했다가 화면에 보일때 다시 렌더링한다는거... 기존 아이템이 제거돼서 높이가 0이 됐다가 다시 화면에 보여 렌더링되면서 높이가 100? 200? 정도 로 설정되면서 스크롤이 갑자기 한움큼 내려가버리는 문제 발생. 그래서 listview 나 pageview 같은 곳에서 기존 아이템들을 살릴 수 있는 방법을 찾아봤다. import 'package:flutter/material.dar.. 공감수 1 댓글수 19 2021. 5. 21.
[Flutter] 위젯 크기, 위치 구하기 flutter 에서 Globalkey 를 이용하여 위젯의 크기와 위치를 구하는 방법. 크기를 구할땐 LayoutBuilder 위젯도 있다. 여기선 GlobalKey 로 구하는 법 베이스 코드 // ... GlobalKey _redBoxKey = GlobalKey(); GlobalKey _greenBoxKey = GlobalKey(); GlobalKey _blueBoxKey = GlobalKey(); @override Widget build(BuildContext context) { return Scaffold( body: SafeArea( child: Column( mainAxisAlignment: MainAxisAlignment.spaceAround, children: [ Center( child: C.. 공감수 2 댓글수 6 2021. 5. 4.
[Flutter] Unhandled Exception: Bad state: Insecure HTTP is not allowed by platform flutter 개발 중 내부 서버와 http 통신을 하려고 했는데 발생한 에러. https 서버도 열어놨었는데 내부 서버라 인증서 문제로 http 서버를 열어서 하는데 http 통신도 안되는거.. http 통신이라도 해결해보자 [root]\android\app\src\main 의 AndroidManifest.xml 파일을 수정 공감수 1 댓글수 15 2021. 4. 27.
[Flutter] keyboard bottom overflowed -- by pixels 인풋을 위해 keyboard 가 나왔을 때 bottom overflowed 문제가 발생했다. 현재 내 코드와 상황. return Scaffold( appBar: AppBar( elevation: 0, leading: leadingIcon, backgroundColor: Colors.white, titleTextStyle: TextStyle( color: Colors.black, ), centerTitle: true, title: Text( 'Welcome', style: TextStyle(color: Colors.black), ), ), body: Center( child: Column( mainAxisAlignment: MainAxisAlignment.spaceAround, children: [ Con.. 공감수 1 댓글수 8 2021. 4. 23.
[Dart] VScode 자동 줄 바꿈 글자 수 수정 어떻게 flutter를 개발하게 되어 코딩중인데 vscode 에서 80자만 넘어가도 자동으로 줄 바뀜이 일어나버린다.. 일단 코딩 가이드에선 80자 이상을 피하라고 한다. 그래도 일단 바꾸는 법 vscode 세팅을 들어가서 dart.line 을 검색하면 80으로 설정되어있다. 수정하면 된다. 80으로 설정된 숫자를 변경하면 된다. 아직 내가 dart 언어에 안 익숙해서 보기가 좀 불편해서 잠시 바꿨는데 다른 사람과 작업할때도 많을 것 이고 이왕이면 코딩 가이드에 맞춰서 짜는걸 추천한다. 공감수 2 댓글수 14 2021. 4. 20.
Day.js Timezone 현지 시간 구하기 node.js 를 사용한 서버에서 new Date() 로 현재시간을 저장하는 코드가 있었다. 근데 서버를 하나 빌렸더니 외국 어딘가로 돼있어서 시간 저장이 이상하게 되더라... 서버 시간을 바꾸는 법도 있겠지만 가끔 docker 사용시 서버 시간이 외국으로 돼있는 경우도 있기에 그냥 nodejs 에서 처리하기로 생각 예전엔 moment.js 를 썼었는데 요새 크기가 너무 커지고 뭐 별로라해서 day.js 사용해봤다. npm install dayjs // node.js const dayjs = require('dayjs'); const timezone = require('dayjs/plugin/timezone') const utc = require('dayjs/plugin/utc'); dayjs.exten.. 공감수 4 댓글수 38 2021. 4. 13.
CSS 애니메이션 성능 최적화하기 애니메이션 공부하면서 알게된 내용 정리 웹 브라우저는 위의 이미지와 같은 로딩, 렌더링 순서를 거친다. 이 중 Layout, Paint, Composite 단계에 주목하자 3. Layout 브라우저에서 엘리먼트의 도형, 위치를 생성한다. 대표적인 속성값으로 width, height, margin, padding, left,top,rigth,bottom 등이 있다 4. Paint 각 엘리멘트의 픽셀을 채운다. box-shadow, border-radius, color, background-color 등이 있다. 5. Composite 화면에 모든 레이어를 그리기 시작한다. transform, opacity 가 있다. 여기서 만약 width, height 등의 값 (Layout 에 해당하는 속성 값)을 애니.. 공감수 1 댓글수 8 2021. 4. 7.
[Typescript] A* 길찾기 알고리즘 구현 https://mika0203.github.io/Pathfinding-Algorithm/ 일단 구현 페이지.. 대충 이런 느낌으로 구현했다. 알고리즘 구현은 이 단계를 걸쳤다. A*의 자세한 알고리즘은 아래에 내가 참조한 사이트를 첨부할 예정. 즉 알고리즘 설명은 거의 없다 1. startPosition, targetPosition, obstacles 지정 2. currentNode 를 startPosition 으로 지정 3. currenNode 를 closeNodeList 에 추가, openNodeList 에서 제거 4. currentNode 에서 8방향으로 Node 를 생성하여 ( 여기서 closeNodeList 에 있는 노드는 제외한다) 생성된 Node 들을 openNodeList 에 저장 5. o.. 공감수 1 댓글수 10 2021. 4. 5.
[Javascipt] Blob, File 을 Base64 로 컨버팅 이미지 파일을 선택하면 이미지를 연결된 소켓에 뿌리는 작업을 하고 있었다. 파일을 선택하면 blob 형태로 만들어 뿌렸는데 이게 같은 디바이스에서는 제대로 동작했는데 다른 디바이스에선 제대로 안나오더라.. 그래서 생각해낸게 blob 을 base64 로 컨버팅해서 base64를 넘기는 형태로 변경 const reader = new FileReader(); const blob = ---; // blob or file reader.readAsDataURL(blob); reader.onloadend = () => { const base64data = reader.result; // base64 converted! console.log(base64data); } 샘플페이지 codepen.io/mika0203/pe.. 공감수 2 댓글수 8 2021. 3. 29.
[Javascript] bool 값으로 정렬하기 bool 값으로 정렬해보자. const booleanArray = [true,false,false,true,false,true,false,true]; booleanArray.sort((a,b) => a === b ? 0 : a? 1 : -1); // [false, false, false, false, true, true, true, true] booleanArray.sort((a,b) => a-b); // [false, false, false, false, true, true, true, true] // -------------------------------------------------------------------------- booleanArray.sort((a,b) => a === b ? 0.. 공감수 1 댓글수 19 2021. 3. 29.
[Javascript] Unity Mathf.PingPong 구현 요새 javascript 알고리즘 문제 풀고 있는 사이트에서 문제가 올라왔는데 min 값과 max 값의 사이를 오가는 숫자를 구하는 문제였다 yeu.kr/Ptkt6 코딩문제를 풀어보세요 미션: 토글카운터를 만들어보자 yeu.kr unity 에선 Mathf.PingPong(float, length) 함수로 쉽게 구할 수 있었는데 js에서는.. 아마 없는듯? 오르는 중인지 내려가는 중인지 bool 값으로 할 수 있었는데 그냥 구현해보고 싶었다 // value 를 넣으면 min, max 값을 오가는 값을 리턴 하는 함수 const pingpong = (min,max, value) => { // 0을 기준으로 값을 맞춰준다 const normalizeMin = 0; const normalizeMax = max .. 공감수 0 댓글수 17 2021. 3. 26.
[Raspbian] 라즈베리 파이 VNC 접속하기 1. 라즈베리 파이 ssh 에서 vncserver -geometry 1920x1080 입력 (해상도는 마음대로) $ vncserver // geometry 옵션으로 해상도 설정가능 $ vncserver -geometry 1920x1080 그럼 하단에 나는 192.168.0.13:2 VNC 접속 주소가 주어졌다. 원래 1번포트부터 줄텐데 글쓰느라 한번 더 명령어를 입력해서. 2. VNC 뷰어로 저 주소에 접속 시도한다. www.realvnc.com/en/connect/download/viewer/ 나는 이 프로그램을 썼는데 이상하게 다른 프로그램으론 접속이 안되더라.. 더 알아봐야할듯 아까 주소로 접속 시도 라즈베리 파이 계정명과 패스워드를 입력한다 접속확인 재부팅하면 1번부터 다시 진행해야함. 공감수 1 댓글수 14 2021. 3. 17.

문의안내

티스토리
로그인
고객센터

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