전체보기 Javascript 2024. 11. 1. [Javascript] 이메일주소 마스킹 처리하기 const email = "happyhee@email.com";// 이메일 형식이 맞는지 검증email.includes("@"); // true// 이메일을 @를 기준으로 나누어서 변수에 담기let emailSplit = email.split("@"); // ["happyhee", "gmail.com"]// 이메일 앞부분(유저 ID)let emailId = emailSplit[0]; // "happyhee"// 이메일 뒷부분let emailCompany = emailSplit[1]; // "gmail.com"// 아이디의 앞부분 + 마스킹 처리할 텍스트를 배열에 담기let maskingId = [];maskingId.push(emailId[0]);maskingId.push(emailId[1]);maski.. 기타 2023. 12. 7. GitHub / GitLens 에서 정확한 커밋 날짜와 시간 확인하기 Github와 GitLens에서 예전에 커밋한 부분의 날짜가 궁금해서 보려고 했던 적이 있다. 하지만 2주 전... 2개월 전... 이런식으로 애매하게 나와서 이게뭐람 싶었는데 혹시몰라서 그 애매한 날짜 부분에 마우스를 가져다대보니까 정확한 날짜와 시간을 알 수 있었다. GitHub / GitLens 에서 정확한 커밋 날짜를 확인하는 방법은, ~주 전, ~개월 전 이런식으로 되어있는 부분에 마우스를 가져다대고 기다리면 정확한 커밋 날짜와 시간을 알 수 있다. (마우스를 가져자대고 잠시 기다리면 날짜가 나온다.) 문제 해결 2023. 11. 30. 네트워크 응답 데이터를 로드할 수 없음(status 400 / Network status cancelled) 에러 해결 (개발환경 : React / Javascript / Next.js) 게시판을 만들고 리스트의 제목 부분을 클릭했더니 상세페이지로 이동이 되지 않았다. 근데 계속 그런 건 아니고 이동이 되다가 안 되다가 하는? 현상이었다. 어쩔 땐 페이지로 이동이 안되고, 또 어쩔 땐 이동이 잘만 됐다. 허허 희한하네... 될 거면 되고 안 될거면 안 되지 됐다가 안 됐다가 하는 건 뭐람? 가끔 그러니 상관 없지 않나?라고 순간 생각했지만... 사용자 입장에서 생각해 봤을 땐 이런식으로 이동이 잘 안 되면 빡칠 수 있는 경우이기 때문에, 그리고 또 이런 상황이 다시 발생 할 수 있으니까 원인을 알아내서 너무너무 해결하고 싶었다! 개발자 도구를 열고, 네트워크탭을 살펴보니 이런 부분들이 확인됐다. 대체 뭐가 문제일까... .. 문제 해결 2023. 10. 27. ReferenceError: alert is not defined 에러 해결 (& Nothing was returned from render) React 와 typescript 환경에서 작업을 하던 중에 갑자기 문제가 생겼다. 게시글의 id 값을 가져와서 그 값이 string 값인지 확인한 후, 상세 페이지를 보여주는 화면이었는데 나타난 에러문은 바로 이것... Referenceerror: alert is not defined 그래서 어라? 이게 왜 발생했지? 하고 바로 저 에러를 복사해서 검색을 해보았다. Node.js 와 관련되어 있다는 내용들이 대부분... 근데 왜인지 저것과 관련이 있는 것 같지 않았다. 그래서 혹시나하여 아! alert 부분이 문제라면 저 alert 부분을 다른 걸로 바꿔볼까? 라는 생각에 console.log 로 바꿔보았다. 그랬더니... 이번엔 다른 에러가 나타났다. Nothing was returned from r.. 문제 해결 2023. 10. 12. body 태그 안, 위쪽에 공백이 생기는 문제 해결 () 작업을 하는데 갑자기 문제가 생겼다. 오잉? 이게 뭐지? 상단에 알 수 없는 여백이 생긴 것이다. 개발자 도구로 확인해보니, 내가 작성하지 않은 알 수 없는 텍스트가 들어있었다. (나같은 경우는 "" 라는 텍스트가 들어있었다.) 작업중인 파일만 계속 살펴보다가 문득 든 생각... 아! 혹시나 저번에 해결했던 것처럼 인코딩 문제일 수도 있지 않을까? 싶어서 그쪽을 살펴보니 UTF-8 이 아닌 UTF-8 with BOM 으로 되어있었다. 그렇다. 이 문제는 인코딩과 관련이 있었다. 해결 방법 해결 방법은 간단하다. 인코딩을 바꿔주면 되는데 (VSCode의 경우) 우측 오른쪽에 있는 인코딩 부분을 클릭하고 뜨는 창에서 'Reopen width Encoding' 을 클릭, UTF-8 을 선택해주면 .. 기타 2023. 9. 26. VSCODE 에서 Remote - SSH 사용하여 SSH 연결하기 Remote - SSH 설치 및 사용 방법 vscode 에서 SSH 연결을 할 일이 생겼다. Remote-SSH 를 설치하면 편리하다길래 바로 플러그인을 설치했다. 설치한 후 F1을 눌러 Remote-SSH 를 검색하면 나오는 것들 중 Open SSH Configuration File 을 클릭한다. 클릭하면 자동으로 설정 파일 경로가 있는 곳이 나오는데 그걸 클릭한다. 그리고 나오는 설정 파일에서 설정을 작성해주면 된다. Host : 내가 알아볼 수 있는 이름으로 지으면 된다. 여러개를 사용할 시 구분하기 좋음! HostName : 나같은 경우는 IP 주소를 사용하여 접속해야 했다. 그래서 IP 주소를 넣었다. User : 유저 ID Port : 포트 번호 ... 이렇게 작성하고 나니 생기는 궁금한 점... Javascript 2023. 9. 5. [Javascript] Map 객체와 map 메서드(반복문)의 차이 공부를 하다가 헷갈리는 부분이 생겼다. 분명 내가 알던 map 은 반복문이었는데?? map을 반복할 때 for...each를 사용한다고? 으잉? map 자체가 반복문 아니였나? 뭐지? map을 사용하는 방법이 두개인 건가? 그리고 검색에 검색을 거쳐... 이 두가지는 다른 것이란걸 알게되었다. Map 객체와 map 메서드 Javascript 에는 Map 객체와 map 메서드, 이렇게 두가지가 있다. 이 둘은 서로 다른 목적과 맥락에서 사용된다. 아래에서 간단하게만 설명해 보겠다. 1. Map 객체 Map 객체는 Javascript 의 표준 내장 객체이다. 데이터를 저장하고 관리하며 키-값 쌍을 추가, 삭제, 업데이트 및 순환하는 등의 작업을 수행할 수 있다. 예시 코드 // 맵을 만든다. const me.. Javascript 2023. 9. 4. [Javascript] alert창(경고창) 텍스트 줄바꿈 하기 alert창(경고창) 에서 텍스트 줄바꿈 하는 방법 alert창에서도 줄바꿈이 가능하다! 최근까진 잘 모르고 가능하지 않을까~ 라고 어렴풋이 생각하고 있었는데 마침 딱 사용할 일이 와서 알아보았다. 줄바꿈을 하는 방법은 두가지 방법이 있다. \n 을 사용한 줄바꿈 줄바꿈을 할 텍스트 뒤에 \n 를 넣어주면 줄바꿈이 된다. 코드 alert('안녕하세요?\n만나서 반갑습니다.'); 출력물 템플릿 리터럴 ` ` 을 사용한 줄바꿈 템플릿 리터럴 ` ` 을 사용하면 줄바꿈을 한 상태로 입력을 하면 alert 창에서도 줄바꿈이 된다. 주의할 점은 ` 바로 뒤나 앞에서 줄바꿈을 하거나, 가독성을 위해서 탭키를 사용하면 그것 역시 적용이 되므로 주의해야한다! 코드 alert(`안녕하세요? 만나서 반갑습니다.`); 출력.. 이전 1 2 3 4 ··· 9 다음