WEB

BE JS Node.js

JWT를 이용해 로그인 검증하기

JWT 인증 JSON 형식의 웹 토큰을 이용하는 인증 방식이다. 로그인 시 Token 2종(Access, Refresh)을 발급하고, Storage에 저장해 검증에 이용한다. Key […]

JS

ES6 새로운 연산자

+=, -=, *=, /= 변수의 값을 업데이트할 때, 변수를 지속적으로 기재하는 번거로움을 줄이도록 ES6부터 도입된 표현식이다. let i = 1;

JS

Template literal 표기법

`${}` ES6부터 도입된 문자 표기 문법. 백틱과 ${} 사인을 이용해 문자열과 변수를 자유롭게 사용할 수 있다. 파이썬에서 fstring 같은 느낌. const

JS

JS 로 스크롤 위치 이용하기

window.scrollY 뷰포트 최상단에서부터 현재 스크롤까지의 거리를 구하고 이용하기 // 현재 스크롤까지의 거리를 정수로 구하기 const currentY = Math.round(window.scrollY); function scrollEvent()

JS

JS 의 eventListner 사용하기

addEventListener 대상에 대한 event 를 기준으로 function 을 실행하는 함수 // 대상.addEventListener("이벤트", "function 이름") heyKi.addEventListener("click", beHappy);

CSS HTML

HTML 를 이용해 tooltip 만들기

1. 기본 순서 말풍선 컨테이너 만들기 말풍선 안에 p 만들고 스타일링하기 Image Sprite 사용해 말꼬리 붙이기 hover 상태일 때만 보이도록

CSS HTML

Accessibilipidia

1. a 페이지 이동만 시켜줄 경우 사용하기 링크로 사용할 때는 underline 을 제거하지 말기 text-underline-offset 또는 text-decoration-color 을 통해 customize

CSS HTML JS

230205

230205 1. button 에 리디렉션 액션 만들기 onclick 이벤트를 추가해 리디렉션 링크로 이동시킨다. <button type="button" onclick="location.href=''"></button> 2.media query 이용하기 @media

JS

230115

230115 저장된 To-Do 리스트 불러오기 localStorage 를 사용해 todos array 를 호출하기 → 값이 있을 시 JSON.parse, forEach 를 이용해

JS

230101

230101 시계 만들기 1. setInterval(a, b) ( f ) // 특정 함수를 정해진 시간마다 반복적으로 실행한다. setInterval(실행할 함수, 초*1000); 2.

위로 스크롤