고고마코드

a tag를 사용할 때 동적으로 disable처리를 해주어야 할 때가 있습니다. a tag에는 따로 disable속성이 없습니다. 그래서 동적으로 href를 변경하거나 지워야 합니다. 해결한 과정을 기록합니다. 방법 a tag 에 data-href 로 링크를 미리 담아둡니다. 또는 동적으로 여러개를 써야 한다면, data-href1, data-href2 이런 식으로 미리 담아두는 방법도 있습니다. 이벤트가 있을 경우 href 속성 값의 유무에 따라 동적으로 값을 추가하고 뺍니다. 테스트 코드 준비 버튼을 클릭하면 a 태그의 링크를 지우고, 다시 클릭하면 a 태그의 링크를 살리는 테스트를 진행하겠습니다. 결과물 코드 HTML 소스 toggle button 구글로 이동 이동JQuery 방식 $(documen..

MongoDB Compass로 localhost:27017 연결 시도 시 오류가 발생했습니다. 해당 오류를 해결하는 과정을 기록합니다. 오류 발견 localhost 접속을 위해 mongodb://localhost:27017를 시도 오류 connect ECONNREFUSED 127.0.0.1:27017 원인 mongod, mongo 서비스가 켜져 있지 않은 상태 근본적인 원인은 위와 같지만, 켜지지 않은 이유는 아래 해결에서 설명 해결 mongo 서비스 실행 mongod > mongo 순서로 실행 서비스의 경로 : C:\Program Files\MongoDB\Server\\bin 별도로 환경 변수 PATH가 잡혀 있으면 바로 다음으로 넘어가셔도 됩니다. mongod.exe, mongo.exe 순서대로 직접..

크롬 기반 브라우저에서는 정규식 후방탐색을 지원하지만, 사파리에서는 후방탐색을 지원하지 않기 때문에 다른 방법으로 대체해야 합니다. 대체하는 방법을 작성합니다. 후방탐색 일반적인 사용 방법 var input = `test string`; var regExp = /(?

본 글은 Cafe24 웹 호스팅 서버에서 SMTP 인증된 메일을 발송하는 과정입니다. 꼭 Cafe24 웹 호스팅 서버 환경이 아니더라도 PHP로 SMTP 인증된 메일 발송이 필요하다면 3번부터 참고하시면 됩니다. 1. 무료 웹메일 신청 cafe24 호스팅센터에 로그인 후 아래 링크를 클릭해 무료 웹메일을 가입하세요. 카페24 호스팅센터/서버호스팅 - 무료웹메일서비스 (cafe24.com) [호스팅 관리 > 무료그룹웨어/웹메일 신청] 신청하기 클릭 후 "웹메일 관리자 비밀번호 등록" 란에 비밀번호를 입력하면 바로 웹메일 신청이 완료됩니다. 메뉴 찾기가 어렵거나 동영상으로 보고 싶으신 분은 아래 igotit 님의 동영상을 참고하세요. 웹메일 신청 동영상 2. 무료 웹메일 관리자 로그인 - 계정 확인 및 추가..

정규식 플래그에 관한 내용이 궁금하다면 아래 글을 참고해 주세요. 정규 표현식/정규식(RegExp) 플래그(Flag) 자세하게 알아보자! 정규식 패턴에 관한 내용이 궁금하다면 아래 글을 참고해 주세요. 예제로 정리한 정규식 패턴 1. Javascript에서 정규식을 만드는 두 가지 방법 RegExp 객체 const regExp = new RegExp(/reg/, 'g'); new RegExp(/pattern/, 'flag') RegExp 객체의 생성자를 호출해 정규 표현식을 만듭니다. 패턴과 플래그에 대한 자세한 내용은 다루지 않습니다. 해당 내용은 상단의 링크를 참고하세요. 정규 표현식 리터럴 const regExp = /reg/g; /pattern/flag 정규 표현식 리..

경고 element must have a lang attribute: The element does not have a lang attribute 웹 개발을 할 때 개발자도구를 열었더니 위와 같은 경고가 발생했습니다. 원인 html-lang-valid 규칙을 지키지 않았기 때문에 발생하는 경고입니다. 웹 페이지의 언어를 지정해야 한다는 규칙입니다. 웹 페이지의 언어를 지정하지 않으면 screen reader는 사용자가 설정한 기본 언어로 가정합니다. screen reader는 언어의 특성에 따라 서로 다른 사운드 라이브러리를 사용합니다. 만약 문서에서 읽을 언어가 올바르게 지정되어 있지 않다면 screen reader가 다른 언어로 문서를 읽으므로 혼란스러운 부분이 생길 수 있습니다. 이러한 부분으로 인..

예제 코드는 Javascript로 작성되었습니다. 예제 코드에 플래그 활용이 포함됩니다. 플래그를 모른다면 아래 글을 참고하세요. 정규 표현식/정규식(RegExp) 플래그(Flag) 자세하게 알아보자! 1. 기본 dot(.) : 줄바꿈(\n)을 제외한 모든 문자(특수문자 포함) var test = `1a 2b @#`; test.match(/./g) [ '1', 'a', '2', 'b', '@', '#' ] \d:모든 숫자 \D:숫자가 아닌 것(\d의 반대) var test = `1a 2b @#`; test.match(/\d/g) test.match(/\D/g) [ '1', '2' ] [ &#..

javascript 기반으로 작성합니다만, 플래그는 모든 언어에서 비슷하므로 플래그에 대한 이해에는 도움이 될 것입니다. 하단으로 내려갈수록 기존 플래그를 활용하는 부분도 있습니다. 원활한 이해를 위해 플래그 순서대로 읽어주세요! 정규식 패턴에 대한 내용이 궁금하다면 아래 글을 참고하세요. 예제로 정리한 정규식 패턴 1. 정규 표현식을 사용하는 방법 정규 표현식 선언 방법 // new RegExp('정규식', '플래그'); let regExp1 = new RegExp('hello', 'g'); // /정규식/플래그; let regExp2 = /hello/g; regExp1 new RegExp('정규식', '플래그')는 ..

1. 오류 저는 swiper-bundle.min.js 를 호출했더니 발생한 오류입니다. 2. 원인 문제의 원인을 이해하기 위해서는 sourceMap이 무엇인지 부터 알아야 합니다. 우선 JS와 CSS는 특정 도구(webpack)들을 이용해 번들링 되어 난독화&압축됩니다. 우리가 가끔 jquery 구문의 오류가 발생할 경우 어디서 발생한 오류인지 찾기 어려울 때가 있습니다. 브라우저의 디버깅 툴은 난독화된 코드에서 에러를 가리키기 때문에 어디서 발생한 오류인지 찾기 어렵습니다. sourceMap은 원본코드를 어떠한 알고리즘으로 인코딩하여 키워드로 매핑시켜놓은 것을 뜻합니다. 브라우저에서는 이렇게 인코딩된 것을 디코딩하여 복원시킬 수 있습니다. 그리고 이러한 sourceMap 파일을 연결하는 것이 sourc..

1. 프로젝트 생성 angular-cli @angular/cli 가 이미 전역에 되어 있는 분은 넘어가셔도 됩니다. $ npm i @angular/cli angular 프로젝트 생성 $ ng new angular-bootstrap-example 2. 버전 확인 및 패키지 설치 ng-bootstrap 설치 전, 자신의 버전을 확인해야 합니다. 해당 버전에 맞게 다른 패키지(bootstrap, ng-bootstrap)를 설치해야 하니까요. (생각보다 예민합니다. 버전을 최대한 맞춰주세요.) { "name": "angular-bootstrap-example", "version": "0.0.0", "scripts": { "ng": "ng", "start": "ng serve", "build": "ng build..