기록하기

프로젝트를 수행하던 중 REST docs 설정을 한 뒤 간단한 ControllerTest 코드를 수행해보았으나 build 가 되지 않는 문제점을 발견했다. 오류의 주 내용은, 빈 주입이 잘 되지 않아서 security 설정에서 문제가 발생함을 알게 되었고 Spring Security + JWT 방식으로 인증, 인가 기능을 활용했던 프로젝트에서 인증된 정보를 제공받지 않고서는 단위테스트를 실행할 수 없음을 알게 되었다. 따라서 미리 설계해둔 custom 한 UserDetailsService 클래스(필자의 경우 UserService 라는 이름으로 설계를 했다.) 에서 인증 정보를 먼저 제공받은 뒤 테스트를 실행할 수 있도록 처리가 필요했다. @Service @RequiredArgsConstructor pub..

Promise 는 "비동기 통신을 하는데 서버로 응답이 왔을 때 그걸 호출한 함수에서 알 수 있도록 약속할게" 라는 의미를 가지고 있다. 즉, 비동기 통신을 하게 될 경우 특정 코드 실행이 완료될 때까지 기다리지 않고 다음 코드를 수행하는 것을 의미하는데 이 특성 때문에 처리 결과를 받아와야 하는 경우 데이터를 받아오지 못하는 문제가 발생하게 된다. 이를 위해 나온 개념이 Promise 이다. 기존 XMLHttpRequest 객체를 사용하여 통신을 하는 코드를 살펴보도록 하겠다. function getData() { const xhr = new XMLHttpRequest(); xhr.open("GET", "http://localhost:3000/posts"); xhr.setRequestHeader("co..

String.prototype 에는 padStart(), padEnd() 함수가 있다. 이 두 함수의 특징은 전달 받은 길이만큼 원하는 문자를 채우는 함수인데, 자바스크립트의 String 오브젝트를 배우면서 가장 기억에 남는 함수라서 먼저 정리를 해보려고 한다. padStart() 첫 번째 파라미터 길이 두 번째 파라미터 채울 문자 첫 번째 파라미터로 전달 받은 길이 만큼 문자열의 앞에 두 번째 파라미터로 채우는 함수이다. let num = "7"; console.log(num.padStart(4, "0")); //0007 이 함수의 경우, 4월을 04월로 표시를 해야하는 경우에도 사용할 수 있다. 예를 들어, 다음과 같이 작성할 수 있는 코드를 padStart() 함수를 사용하면 좀 더 편리하게 원하는..

백엔드 개발자인 필자에게 css는 생소한 영역이다. 하지만 javascript 공부를 하면서 html, css 에 대한 기초적인 학습을 진행하였고, 모든 내용을 다 정리할 수는 없지만 기초적인 부분이라도 기록을 해보려고 한다. css 적용하는 방법 3가지 1) inline style 태그에서 style 속성을 직접 적용하는 방법이다. 파란색 글자 2) internal css 안에 태그를 작성하여 이 안에 직접 적용하는 방법이다. 3) external css 별도의 css 파일을 만들고 head 태그에 해당 css 파일을 삽입하는 방식이며 가장 많이 사용한다. css 선택자 this is a red colored paragraph. 링크1 링크2 링크3 p 태그 li 태그 li 태그 li 태그 h1 태그 ..

html, css 를 공부하며 기존에 잘 몰랐던 내용을 위주로 정리를 해보려고 한다.(사실 html 태그는 공부를 해도 계속 까먹게 되는 것 같다. 자주 사용해야 까먹지 않을 것이다..) 가장 먼저 html 태그에서 b vs strong, i vs em 태그를 비교해보고 처음 알게 된 abbr, cite, image-map 태그를 정리하겠다. 추가적으로 매 번 헷갈리는 target 의 속성에 대해서도 정리를 해보려고 한다. b vs strong 태그 두 태그 모두 텍스트를 굵게 표현하는데 사용하는 태그이다. 하지만 요소는 텍스트 자체에 주의를 끌기 위해 사용하는 것이고, 요소는 콘텐츠 자체의 중요성을 강조할 때 사용한다는 점에서 차이가 있다. 사실 두 태그 역할이 같은데 굳이 구분해서 사용할 필요가 있을..