20220713 TIL

자바스크립트로 시간 비교하기1

Date 객체 안에 2022-05-04와 같은 형식뿐 아니라 다양한 형태의 날짜 타입 데이터를 넣으면 잘 된다.

심지어 2022-07-05 16:03:51.815442000 이걸 넣어도 잘 적용됨

많은 예시들이 이걸 굳이 다 parsing하고 처리하고 있었는데

그러면서 코드도 길어져서 심리적 장벽이 있었는데 간단히 처리가 가능했다...

const date1 = new Date('2022-05-04');
const date2 = new Date('2022-05-05');

console.log(date1 > date2);
console.log(date1 >= date2);
console.log(date1 < date2);
console.log(date1 <= date2);

https://codechacha.com/ko/javascript-compare-dates/

JavaScript - 날짜/시간 비교, 3가지 방법

자바스크립트 시간 계산하기

elapsedMSec 이 값이 크게 나와서 나누기 1000을 한 번 해줘야 실제 초와 같은 값이 나오고

그래서  elapsedMin = elapsedMSec / 1000 / 60; 이런식으로 60을 한 번 더 나눠서 분을 구할 수 있다.

var date1 = new Date(year, month, day, hours, minutes);                    // 현재 
var date2 = new Date(sttYear, sttMonth, sttDay, sttHours, sttMinutes);     // 파라미터
 
var elapsedMSec = date2.getTime() - date1.getTime(); 
var elapsedMin = elapsedMSec / 1000 / 60; 
 
elapsedMin = parseInt(elapsedMin);    // 정수 표기를 위해 parseInt    
출처: https://itworldyo.tistory.com/73 [잇월드:티스토리]

자바스크립트 인자로 날짜 넣어서 계산하려다가 실패 -> 밖에서 계산해서 int값으로 넣어줌

---

자바스크립트로 이메일 유효성 검사하기

<script>
  function fn_submit() {
      var text = document.getElementById('text').value;

      var regEmail = /^[0-9a-zA-Z]([-_\.]?[0-9a-zA-Z])*@[0-9a-zA-Z]([-_\.]?[0-9a-zA-Z])*\.[a-zA-Z]{2,3}$/;
      if (regEmail.test(text) === true) {
          alert('입력된 값은 이메일입니다.');
      }
  }
</script>

휴대폰 번호 및 자세한 설명: https://plitche.github.io/language/javascript/2021-05-30-regularEx/

[JavaScript] 휴대폰번호, 이메일 정규식 체크하기

CSS로 마우스 커서 포인터로 바꾸기

<p style="cursor:pointer">Pointer</p> 

기타 효과는 링크 참조 :   http://www.homejjang.com/09/cursor.php

[CSS] 버튼 클릭 시 테두리 및 효과 삭제 + 벌마/부트스트랩 적용된 요소에 새 스타일 입히기

Textarea와 버튼이 클릭하면 아웃라인이 생겼는데

두 가지 방법을 같이 써서 해결

1. bulma와 bootstrap 파일 불러오는 스크립트를 먼저(위에) 작성하고, 그 아래에 내가 작성한 css파일을 작성하면 라이브러리를 바탕으로 내 CSS파일을 추가로 오버랩해서 쓸 수 있다.

2.  :active, :focus 를 명시해서 border:none, box-shadow:none 처리 하고,

정말 해결이 안되면 !important로 강제성을 더 부여해준다.

.btn { color: #fff; background-color: #fff; cursor: default; }
.btn:active, .btn:focus { border: none; box-shadow: none; } 
.btn { color: #fff; background-color: #fff; cursor: default; }
.btn:active, .btn:focus { border: none !important; box-shadow: none !important; } 
.btn { color: #fff; background-color: #fff; cursor: default; }
.btn:active, .btn:focus { outline: none !important; box-shadow: none !important; }

출처: https://neopang.tistory.com/entry/CSS-버튼-클릭-시-테두리-표시-삭제 [팡이네:티스토리]

JPA 작성하기

유저이름으로 찾기만 했더니 순서가 뒤죽박죽이어서 findAllByOrderByCreatedAtDesc

findAllByOrderByCreatedAtDesc 를 보고

findAllByUsernameByOrderByCreatedAtDesc 이렇게 했다가 안 돼서 검색을 해보았더니

findByAgeOrderByLastnameDesc 이런식의 예제가 있어서 반영했다.

https://sundries-in-myidea.tistory.com/91

Spring Data JPA에서 Query를 사용하는 방법

깃허브 이슈와 (자동으로!) 연관시켜서 커밋하기

원격 레포지토리에 이슈를 등록하면 그 이슈에 대한 #일련번호가 자동 생성된다

커밋할 때 커밋 내용에 #일련번호(ex. #28)를 입력해놓고 푸시를 하면

자동으로 이슈내에 해당 커밋들이 달려있는 것을 볼 수 있다!