# js
객체 연습 js
분명히 아무런 오타도, 실수도 없는데 문제가 발생한다면 DOM이 로딩되기전에 js가 작동해서 일어나는 문제일 가능성이 있으므로 window.addEventListener("DOMContentLoaded", () => {}안에 넣어버리자.아직 덜 끝남
[JS] event.target
이벤트가 발생한 대상 객체를 가리킵니다.지정된 event target(html 요소) 에지정된 event type(click, input 등등)이 발생하면지정된 event handler(함수)가 실행된다.버튼을 클릭 했을 때 콘솔 창에 입력이 출력된다.버튼을 클릭 했을
(11) Rock, Paper, Scissors solution
이 솔루션은 Rock, Paper, Scissors challenge on Frontend Mentor 챌린지 참여 결과물입니다.
[Node.js]auth-session
.env.example파일을 .env파일로 바꿔주고 안의 비밀번호를 초기에 설정한 값으로 세팅을 해준다..env파일에 적혀있는 이름대로 데이터베이스를 생성해준다.mkcert로 받은 인증서를 server폴더에 복사한다.우선 CORS 및 세션 옵션을 설정해준다.index.
[Node.js]Cmarket database
먼저 env.example파일을 .env파일로 바꿔주고,DATABASE의 값을 초기에 mysql로 만든 db설정 값으로 넣어준다.test케이스에서 users router파일이 존재해야 한다 했으므로, routes폴더 밑에 users파일을 만들어준다./routes/ind
12장~14장: Modern Javascript Deep Dive
12장. 함수 함수와 관련되어 용어를 정리할 필요가 있습니다. 함수가 작동하기 위해 입력받는 변수 : 매개변수, parameter 입력 : 인수, argument 출력값 : 반환값, return value
[React] notificatioin API 이용하여 브라우저에 알림 띄우기
Notification API의 존재현재 작성한 내용은 기본 알림이고 더 많은 알림은 아래 링크 참조https://developer.mozilla.org/ko/docs/Web/API/notification
[React] 스크롤 작동으로 스타일 변경하기
scroll은 state를 객체 형태로 받는 게 편하다객체를 return하면 const {y} = useScroll(); 로 받는다.사실 스크롤이 안 생겨서 확인은 못 했다^^
[React] useEffect를 사용하여 network on/off 표시
navigator.online은 개발자도구 network의 online/offline을 boolean 형태로 반환
[React] useRef를 사용하여 fadeIn 적용
useRef를 element에 스프레드 연산자로 사용하면 useRef의 모든 효과가 적용된다.(기존에는 ref={fadeInH1} style={{opacity: 0}} 적었음)useRef.current는 현재 가리키는 element다.return시 ref의 프로퍼티를
[React] mouseleave를 useEffect를 활용하여 컨트롤
clientY를 이용해 위로 나갔을 때만 콘솔을 띄운다.useEffect에 return 안 써도 결과 똑같은데 왜 써주는지 이해가 안 간다...
웹 컴포넌트와 섀도우 돔
아래 내용들은 자바스크립트 완벽가이드 15장 중의 일부분입니다.input prefix에 검색 아이콘이 있고 사용자가 x 아이콘을 클릭하면 input 요소에 입력된 내용을 지우는 검색박스 가 필요하다. 이 검색 박스 하나를 추가할 때마다 아이콘을 넣고 입력된 내용을 지우
[2022.08.15] 자바스크립트 Array().fill().map 체이닝 해서 사용하기
Array 생성자로 배열 생성 후 배열 내장 메소드를 체이닝해서 사용하는 것을 보고 코드를 이해하기 위해 정리해보았다.참고할 코드는 제로초님 자바스크립트 영상 중 공뽑기 영상에 있는 코드이다.빈 배열을 만들고 arr.push()해서 반복문을 돌려도 동일한 결과를 얻을
[React] 'beforeunload' 이용하여 페이지 이동 전에 confirm 받기
리액트에서 addEventListener를 쓰면 적폐인 줄 알았는데 사실 개꿀이다.e.returnValue = '' 이거는 크롬에서는 암튼 써줘야한다고 한다....
[백준 10814] 나이순 정렬.js
여기서는 sort가 필요해서 shift 사용비교할 대상만 남은 input을 sort해서 숫자들만 가지고 비교들어온 순서는 이미 정렬이 되어있으니 나이순으로만 배치해주면 됨예전에 기본 sort 사용했다가 시간 초과 떠서 병합 정렬을 찾아서 했었다. 그래서 sort만 보면
[백준 10250] ACM 호텔.js
역시나 shift 사용 안 하고 for문을 i=1부터 시작뒤에 붙는 호실(roomNum)은 꼭대기 층을 고려하여 guest%height === 0 일 때는 guest/height를 한다.층(floor) 역시 꼭대기 층일 때는 height 출력padstart를 이용해 호