채윤이네집

개요 "Certbot"을 이용하여 Let’s Encrypt에서 최초 SSL 인증서를 발급 받을 때(계정을 만들 때) 이메일 주소를 제공한 경우, 인증서가 갱신될 때 만료 통지를 자동으로 보냅니다. 만료 이메일은 SSL 인증서가 만료되기 20일 전에 발송하고, 통지는 만료되기 10일과 1일 전에 각각 발송합니다. 만료 메일 주소 변경 여러 이유로, 만료 메일을 받을 이메일을 변경해야할 수도 있는데, 그럴 경우에 다음과 같이 이메일 주소를 변경할 수 있습니다. certbot update_account --email yourname@example.com "certbot/certbot" 도커를 이용할 경우에는 다음가 같이 만료 이메일 주소를 변경할 수 있습니다. docker run -it --rm --name ..

자바스크립트로 날짜 문자열을 "YYYY-MM-DD hh:mm:ss" 형식으로 만드는 방법을 정리해 둡니다. "Date" 클래스의 getFullYear(), getMonth, getDate() 가장 쉬운방법으로 "Date" 클래스의 getFullYear(), getMonth, getDate() 함수를 이용하면 다음과 같이 "YYYY-MM-DD" 문자열을 만들 수 있습니다. let current_date = new Date() let current_date_string = current_date.getFullYear() + '-' + (current_date.getMonth() + 1) + '-' + current_date.getDate() // Result // 2022-8-2 위와 같이 수행하면 10이하..

프로젝트 실무에서 적용한 코드 리팩토링 예를 정리해 봅니다. 위 화면과 같이, 어떤 결과에 대해 화면에 테이블 형태로 표시하여주는 함수를 최적화하여 보았습니다. /** * @brief 수행한 BIT 결과를 하단 상태바의 자체점검 결과에 표시합니다. * @param bit_results 수행한 BIT 결과를 담고 있는 객체 */ function load_bit_results_on_footer(bit_results) { let elmTable = document.querySelector('#bit_latest_footer'); if (elmTable == null) { elmTable = document.createElement('tr') elmTable.id = 'elmfooter' document.bod..

문제점 및 증상 잘 접속이 되던 웹 서비스가 https를 적용한 이후, 갑작스럽게 접속에 문제가 발생하기 시작하였습니다. 특정 리소스들이 모두 불러와지지 않고 화면이 깨지는 현상이 발생하였습니다. 원인분석 브라우저의 개발자 도구를 통하여 웹 서비스에 접속하여 보니, 다음과 같은 오류들이 콘솔창에 표시되었습니다. "Mixed Content" 관련 내용을 확인하여 다음과 같은 해결 방법들을 찾았습니다. 사용자가 브라우저에서 임시 해결하기 최종 사용자 입장에서 웹 서비스에서 바로 수정이 어려운 경우, 브라우저에서 URL 주소 옆의 자물쇠 버튼을 눌러 "사이트설정"을 선택하고, 그 사이트 설정에서 "안전하지 않은 콘텐츠"가 기본적으로 "차단"으로 설정되어 있는 것을 "허용"으로 변경하면 http 컨텐츠를 불러올..

개요 AJAX API 호출을 위하여 FORM 태그의 여러 INPUT 컨트롤의 입력 정보를 모아서 호출하려면, jQuery를 이용할 경우 다음과 같이 작성하게 됩니다. form_data = 'user_name=' + $('#user_name') + '&passowrd=' + $('#password') //+ ... 위와 같이 INPUT 컨트롤의 ID로 직접 값을 가져오는 방식은 컨트롤의 개수가 적을 때는 크게 문제가 되지 않지만, 수 십개가 넘어가게 되면 노가다?가 되어 버립니다. 중간에 오타라도 있다면 재앙이 시작됩니다. ^^; FORM의 모든 INPUT 태그를 getElementsByTagName() 함수로 얻어, forEach 하는 방식도 이용할 수 있겠으나, 어쨌든 관련 로직을 이해하고 코딩을 직접..

개요 CanvasRenderingContext2D.arc() 함수에 대하여 알아 보겠습니다. 기본 사용법 CanvasRenderingContext2D.arc() 함수는 다음과 같이 2가지 형태로 이용할 수 있습니다. arc(x, y, radius, startAngle, endAngle) arc(x, y, radius, startAngle, endAngle, counterclockwise) 각 파라미터가 의미하는 것은 다음 그림과 같습니다. x : 수평측 좌표 y : 수직평측 좌표 radius : 호의 반지름 startAngle : 호의 시작 각도 (라디안 값) endAngle : 호의 끝 각도 (라디안 값) counterclockwise : 반시계 방향으로 그릴지에 대한 여부 90도 호 그리기 다음은 간..

개요 CanvasRenderingContext2D.drawImage() 함수에 대하여 알아 보겠습니다. 기본 사용법 CanvasRenderingContext2D.drawImage() 함수는 다음과 같이 3가지 형태로 이용할 수 있습니다. drawImage(image, dx, dy) drawImage(image, dx, dy, dWidth, dHeight) drawImage(image, sx, sy, sWidth, sHeight, dx, dy, dWidth, dHeight) 각 파라미터가 의미하는 것은 다음 그림과 같습니다. 이미지 회전하여 출력하기 이미지를 회전하여 출력하기 위해서는 좌표계를 회전하는 rotate(), translate() 및 save(), restore() 함수도 알고 있어야 합니다. ..

NaN (Not a Number) 이란? "NaN" (Not a Number)은 영문 그대로 숫자가 아닌 상태를 표시하는 전역 속성입니다. 그래서 그 자체는 상수처럼 불변이고, "NaN"은 서로 같지 않습니다. "NaN" 은 "Number.NaN"와 동일합니다. NaN == NaN // false NaN == Number.NaN // false NaN 값 비교하기 NaN과 비교하기 위하여 isNaN() 함수나 Number.isNaN() 함수를 이용할 수 있습니다. 그런데, 두 함수가 조금씩 차이가 있습니다. isNaN() 함수의 경우 함수의 매개변수로 전달된 인자가 숫자로 변환이 가능한지를 확인하고, Number.isNaN() 함수는 인자 자체가 "NaN" 값인지를 확인합니다. let a = 1; isN..

개요 배열 각 요소들에 대한 처리 후, 하나의 형태로 값을 얻어야 하는 경우가 상당히 많은데, 그 동안은 for, forEach 등의 구문을 많이 사용했었습니다. 그러다가 reduce() 함수가 아주 유연하게 이용될 수 있음을 알게 되어 소개해 보고자 합니다. 각 배열 요소 다루기 다음은 간단한 배열의 합을 for 문을 이용하여 구하는 일반적인 코드입니다. const array1 = [1, 2, 3, 4, 5, 6, 7, 8, 9]; let sum = 0; for (let index = 0 ; index < array1.length ; index++) sum += array1[index]; console.log(`array1 summary = ${sum}`); 위 코드를 reduce() 함수를 이용하여 ..

자바스크립트에서 날짜를 "yyyy-mm-dd hh:MM:ss" 형식으로 출력하는 방법으로 많이 알려진 방식은 아래와 같습니다. function timestamp(){ function pad(n) { return n