본문 바로가기
반응형

전체 글70

[Spring Boot] ERROR 31389 --- [nio-8080-exec-8] o.a.c.c.C.[.[.[/].[dispatcherServlet] 에러 해결하기 [ 문제 상황 ] Sping Boot 프로젝트를 진행하는데 다음과 같은 오류가 나면서 프로젝트가 시작되지 않았다. ERROR 31389 --- [nio-8080-exec-8] o.a.c.c.C.[.[.[/].[dispatcherServlet] [ 해결 방법 ] 위 오류는 return을 하는 어떠한 값 중에서 null이 반환되기 때문에 생기는 오류이다. 필자의 경우 tsv 파일에서 데이터를 가져와서 매핑을 했다. 해당 파일 원본은 존재하지만, out 폴더에 있는 해당 파일이 삭제되어서 위의 오류가 나온 것이었다. 일반적으로는 데이터베이스의 값을 가져와서 매핑을 한다. 이러한 경우라면 데이터베이스의 column 이름과 내가 가져온 이름이 맞는지 확인해서 null 값이 반환되었는지 확인해보길 바란다. 2022. 9. 13.
[Spring Boot] Kotlin + Spring Boot IntelliJ Hot Reload 설정 (compiler.automake.allow.when.app.running 없는 버그 해결) 처음 Spring Boot 프로젝트를 시작하고 개발을 하다보면 수정사항이 있을 때마다 재시작을 해야지 변경사항이 반영된다. 조금씩 바꿀 때마다 다시 시작한다는 것은 불편하고 시간도 낭비되어서 Hot Reload 설정을 찾아보았다. 그런데 대부분 Spring Boot + Java 가 대부분이고, IntelliJ 버전도 이전을 기준으로 한 설명이 많아 최근 버전을 기준으로 정리해보았다. 현재 스택 : Kotlin + Spring Boot + Gradle + IntelliJ 2022.2 [ Hot Reload 설정 방법 ] 1. Spring Boot Dev Tool 을 프로젝트 Dependency에 추가하기 코틀린에서는 프로젝트 루트에 build.gralde.kts 가 있다. 이 중에서 dependencies.. 2022. 9. 12.
[CSS] mobile address bar 포함하여 100vh 적용하기 + React, SCSS [ 문제점 ] 일반적으로 css 에서 100vh를 사용하면 데스크탑에서는 문제가 되지 않는다. 그냥 창 전체 크기로 알아서 맞추어 주지만, 모바일에서는 url 주소창이 있기 때문에 문제가 생긴다. 주소창의 형태와 크기는 safari, chrome 에 따라 다르고, 버전에 따라서도 다르기 때문에 각각의 경우를 나누어서 계산하기는 힘들다. [ 해결 방법 ] 찾아보니 CSS에서 height: -webkit-fill-available; height: fill-acaiable; 이런저런 속성들이 있다고 했다. 그래서 적용시켜보니 safari에서는 돌아가는데 chrome에서는 또 적용이 안되는 오류가 있었다. 그래서 chrome에서는 또 따로 분기를 나누어서 처리하고 하려고 하다가 다음과 같은 방법을 발견하고 해결.. 2022. 9. 5.
[Android] ADB connect, 원격으로 핸드폰 연결하기 - android studio, 안드로이드 개발 현재 Android Studio를 사용하여 플러터 개발을 하고 있는데, 대부분 안드로이드 에뮬레이터를 사용하지만, 실기기에서 테스트 할 때가 종종 있다. 매번 USB를 연결해서 할 수도 있지만, 원격으로 할 수도 있다. [ 원격 연결 방법 ] 처음에는 USB와 컴퓨터를 연결해야 한다. 핸드폰에 USB 디버깅을 허용하시겠습니까? 와 같은 팝업이 뜬다면 확인을 하고, cmd에서 adb devices 명령어를 입력한다. 정상적으로 연결이 되었다면 디바이스의 정보가 나올 것이다. 그 다음으로는 adb tcpip 5555 를 입력해준다. tcp로 접속하겠다는 것을 입력하는 것인데, 이를 입력한 뒤 부터는 USB로 연결이 되어있지 않아도 된다. 마지막으로는 연결하려는 디바이스의 ip 주소를 입력한다. adb con.. 2022. 8. 24.
[React] Uncaught ReferenceError: setImmediate is not defined 해결 [ 문제 상황 ] react 에서 nodemailer를 사용하는데 다음과 같은 오류가 나왔다. [ 해결 방법 ] github을 찾아보니 jest 버전 문제라는 경우도 있고, 여러 경우가 있었는데 정확히 어디서 문제가 생긴건지는 파악하지 못했다. 그러나 맨 아래의 링크를 참고하여 오류는 해결하였다. 먼저 setImmediate가 없다고 하니 이를 install 해준다. npm install setimmediate 그 다음 오류가 난 페이지에서 다음과 같이 Import 를 해준다. import 'setimmediate'; [ 출처 ] 2022. 8. 17.
[CSS] width에 padding, margin 포함시키기 [ 문제점 ] 일반적으로 div 에 width를 지정하면 이는 padding, margin이 포함되지 않는다. figma와 같은 디자인을 받았을 때 전체 width 값이 주어지고, padding과 margin이 따로 주어진다면 이를 맞추기 위해서 패팅, 마진의 값을 계산으로 빼주어야 하는 상황이 발생한다. [ 해결 방법 ] 이와 같은 상황에서 패딩, 마진을 포함해서 width를 정하게 해주는 방법이 있다. css에서 box-sizing을 border-box로 해주면 된다. .box { box-sizing: border-box; width: 865px; padding: 64px; } 2022. 8. 3.
[React] Failed to execute 'connect' on 'AudioNode': cannot connect to an AudioNode belonging to a different audio context 에러 해결 [ 문제점 ] Web Audio API의 MediaStream, Analyzer, AudioContext 등을 사용하여서 녹음하고, 이를 시각화 하는 작업을 하고 있었다. 그러나 웹을 실행시키면 다음과 같은 에러가 나와서 아예 웹이 죽어버렸다. [ 해결 방법 ] AudioNode 라는 것이 다른 context에 연결되어서 에러가 났다는 것이었다. 나는 분명 audio context를 새로 만들거나 다른 것에 연결한 적이 없었는데 위와 같은 오류가 떠서 해결하는데 많은 시간이 걸렸다. 오류가 일어난 원인은 React의 2번 렌더링 하는 것이었다. Create React App 을 사용하여서 React를 시작할 경우 React.StricMode 로 App을 감싸서 개발할 때 렌더링을 2번한다. import .. 2022. 8. 1.
[CSS] 가로, 세로 스크롤 없애기 업무 중 스크롤을 만들고 디자인 해야하는 경우가 있었다. 스크롤을 만들기 위해서 overflow: scroll 을 설정하니 다음과 같이 가로, 세로 스크롤이 모두 생겼다. 1. 가로 스크롤 없애기 이런 경우 가로 스크롤을 없애기 위해서는 2가지 방법이 있다. overflow-y: scroll; overflow-x: hiddle; 위 2가지 방법 중 한 가지를 사용하면 된다. 2. 세로 스크롤 없애기 위와 비슷한 방법으로 다음과 같은 방법이 있다. overflow-x: scroll; overflow-y: hiddle; 2022. 7. 28.
[React] 함수형(function, arrow) 컴포넌트에서 generic 사용하기 React에서 함수형 컴포넌트를 작성하는 방법은 두 가지가 있습니다. 첫 번째는 function 을 사용하여서 나타내는 방식이고 두 번째는 ECMA6 에 추가된 화살표 함수를 사용하는 방식입니다. 각각의 방식에서 generic을 어떻게 선언해야 하는지 알아보겠습니다. 1. function 키워드를 사용한 경우 interface Props { value: T } function App(prorps: Props) { return App } export default App 2. Arrow function을 사용하는 경우 interface Props { value: T } const App = (props: Props) => { return App; } export default App 이와 같은 방식으로 g.. 2022. 7. 25.
반응형