Bleeding edge

만들다보니 너무 반복적인 내용이 너무 많이나와서.. 공부보다는 그냥 반복작업을 하는거 같아서 파이어 베이스에서 간단하게 카테고리별로 메뉴가 나오게하고, 무한스크롤을 넣을까.. 생각중이다.

HTML의 Document는, 1. DOMContenLoaded 2. load 3. beforeunload 4. unload 이렇게 네가지의 이벤트로 리소스 로딩 언로딩의 시점에 이벤트를 컨트롤 할 수있습니다. DOMContentLoaded 1. DOMContentLoaded는 document 객체를 기준으로 발생하기 때문에, addEventListener을 사용해야합니다. 2. script안에 있는 스크립트가 모두 처리된 후에 발생합니다. 2 - 1 2에대한 예외로, async 속성이 있는 스크립트는 DOMContentLoaded의 '모두 처리'의 대상에 포함이 안되기 때문에, async가 실행이 안되더라도 DOMContentLoaded는 발생할 수 있습니다. load window 객체의 load가 끝..

For Frontent Favorites 일명, 프론트엔드를 위한 즐겨찾기 깃페이지를 만들려고 한다. 어떤 내용을 넣을까애 대해서는 일주일정도 고민을 했다. 그리고, 어떤식으로 만들까에 대해서도, 고민을 해야하는데, (지금 진행하고있는 IFBAEMIN에 대한 피드백이 어떤식으로 만들까를 너무 이리저리 움직여서 시간이 더 지연됬다고 생각한다) 이 고민하는데 일주일이 걸린거 같다. 1. 내가 이번에 다루고 싶은것은 JSON 파일 정리이다. 즉, 내가 필요한 JSON 파일을 업데이트하여, 사이트에 알맞게 뿌릴 것이다. 2. Button copy를 사용할 것이다. 사실 뭐 다른거 안들어가니? 라고 할 수도 있는데 이번프로젝트는, 내가 CSS 및 다른 JAVASCRIPT, HTML을 만들 때, 공부한다고 하긴 그..

https://programmers.co.kr/learn/courses/30/lessons/68645 코딩테스트 연습 - 삼각 달팽이 5 [1,2,12,3,13,11,4,14,15,10,5,6,7,8,9] 6 [1,2,15,3,16,14,4,17,21,13,5,18,19,20,12,6,7,8,9,10,11] programmers.co.kr 개인적으로, 이 문제는, 내가 코딩테스트를 하면서 수정하거나 신경써야할걸 많이 알려준 문제라고 생각한다. 우선 이문제는 한 4회정도..? (1회차당 하루다) 시도해봤었던 문제인데, 다풀렸다 했을때 항상 error를 못잡았던 기억이 있다. 지금와서 생각해보면 문제풀이에 부족했었던걸 정리해보았다. 1. typeof 문제, 문제풀이에서 Numer와 String가 삽입되거나 ..

https://programmers.co.kr/learn/courses/30/lessons/17680 21 -> 21(같은 1이들어가면 업데이트만 된다) -> 12로 바뀔 수 있게, 수정했다. 그냥 단순히 push shift로만 구현하면 21 -> 1 -> 12가 되기에 구현이 이상하게 되기 때문이다. function solution(cacheSize, cities) { var answer = 0; let stack = []; for(let i =0; icacheSize){ stack.shift() } answer = 5 +answer } } return answer; }

https://programmers.co.kr/learn/courses/30/lessons/12899# 코딩테스트 연습 - 124 나라의 숫자 programmers.co.kr 2단계의 앞부분에 위치하고 있어서 여러번 시도하고 여러번 실패한 문제. 다른분의 풀이를 보니 다른분의 풀이를 보는게 더 나은거 같다. function solution(n) { let answer = [] n = n.toString('3'); n = n.split(''); while(n.length!==0){ if(n[n.length-1]!=='0'){ answer.push(n[n.length-1]) n.pop(); }else if(n[n.length-1]==='0'){ answer.push('4') n.pop(); for(let i..

1. extends HTMLElement with click 음.. 요기서 시간을 엄청 먹을줄은 몰랐는데.. custom element 에서, addeventlisener을 넣는데 자꾸 parameter 2에 대한 에러가 계속 떴다. 그래서 지금 내가 사용하고 있는 extends HTMLElement에 다른 적용법이 있나 검색하다가 connetedcallback에 onclick을 넣은 예제를 발견했다. export default class Login extends HTMLElement { connectedCallback() { this.innerHTML = ` `; this.querySelector('.remove').onclick = e => this.classList.toggle('closed'); ..

https://programmers.co.kr/learn/courses/30/lessons/76502 코딩테스트 연습 - 괄호 회전하기 programmers.co.kr 한가지 사항을 기억하는데 시간이 좀 걸렸었다. 바로 이스케이프 코드를 정규식에 사용하는 방법. const regex = /[\(\)]/g 다음과 같이, 각 이스케이프마다 한번씩 쓰는걸 깜빡해서.. 5분정도 regex match에 시간을 섰다.. regex를 처음 쓸때는 ()와 []많이 헷갈렸었는데 이제는 쓰다보니 연상 암기를 할 수 있게 된거같다 []의 괄호 []는 array와 같으니, 각 개체를 split해서 구분한다. ()의 괄호는, function의 var을 담는 괄호와 같으니 join해서 구분한다!로 연상하니 납득이 됬다. 아참. ..

https://programmers.co.kr/learn/courses/30/lessons/12913 코딩테스트 연습 - 땅따먹기 땅따먹기 게임을 하려고 합니다. 땅따먹기 게임의 땅(land)은 총 N행 4열로 이루어져 있고, 모든 칸에는 점수가 쓰여 있습니다. 1행부터 땅을 밟으며 한 행씩 내려올 때, 각 행의 4칸 중 한 칸만 밟 programmers.co.kr 이렇게 풀어도 되겠지? 하고 고집부리다가 문제 풀이에 시간을 너무 많이 썼던 문제.. dp를 활용하면 금새 풀었을 꺼같지만 이번 기회에 dp에 대해서 공부할 수 있는 기회가 되서 좋았다. 간만에 풀이 감이 안잡혀서 검색을 해봤었는데 https://onlydev.tistory.com/71 [프로그래머스] 땅따먹기 | JavaScript 땅따먹기..