요리 좋아하는 개발자

크롤링이란? 인터넷에서 데이터가 방대해지면서 우리는 그걸 활용할 필요성이 높아졌다. 이런 정보들을 우리가 분석하기 쉽고 활용하기 편하게 데이터를 수집하는 행위를 크롤링(Crawling) 이라고 하고 크롤링하는 프로그램을 크롤러(Crawler)라고 한다. 원하는 데이터를 추출하는 스크래핑(Scraping)과 개념이 혼동되기도하는데 크롤링의 정확한 정의는 다양한 웹사이트의 페이즈를 브라우징하는 작업을 말한다. 그런데 사실상 정보를 수집하기 위해선 브라우징만 하는건 쉽지가 않다. 페이지 안에 있는 데이터를 추출해 가공하는게 대부분 최종 목표이기도 하다. 크롤링의 원리 웹페지는 HTML 문서로 작성되어 있다. 그리고 이 문서에는 인터페이스를 참조할 수 있는 CSS파일과 페이지 상호작용을 위한 JavaScript..

document.createElement() 이란? document.createElement() 메소드는 지정한 tagName의 HTML 요소를 만들어 반환합니다. createElement를 통해 페이지 로딩시점에는 없었던 요소를 원하는 시점에 동적으로 만들어서 삽입 할 수 있습니다. 삽입은 .append()를 통해서 합니다. let element = document.createElement(tagName [options]); tagName: 생성할 요소의 유형을 가리키는 문자열 option: is속성을 가진 ElementCreationOptions 객체 활용 예시 let div = document.createElement("p"); 이러면 html에 없던 p 태그가 로딩 시점에 동적으로 나오는 현상을 ..

자신만의 달력을 만들어서 간단한 메모를 할수 있도록 하면 한다면 이럴떄 보통 데이터베이스(DB) 서버나 클라우드 (Cloud) 플랫폼에 데이터를 저장하는 경우가 많습니다. 하지만 중요하지 않거나 잃어버려도 되는 데이터라면 서버단에 데이터를 저장하는 것이 낭비일수가 있고 설정하고 관리하는것도 힘들수가 있스빈다. 이럴 때 클라이언트 단, 즉 브라우저 상에 데이터를 저장할 수 있느 기술인 웹 스토리지를 사용합니다. 로컬 스토리지 VS 세션 스토리지 웹 스토리지(Web Stroage)에는 로컬 스토리지(local Storage)와 세션 스토리지 (session Stroage)가 있습니다. 이 두 개의 매커니즘의 차이점은 데이터가 어떤 범위 내에서 얼마나 오래 보존하냐에 있습니다. 세션 스토리지는 웹페이지의 세션..

window.onload = function () { let today = new Date(); const calendarBody = document.querySelector('.calendar-body'); const prevEl = document.querySelector('.prev'); const nextEl = document.querySelector('.next'); const inputBox = document.querySelector('.input-box'); const inputBtn = document.querySelector('.input-btn'); const inputList = document.querySelector('.todoList'); const showList = doc..

var(function - scoped) 재선언과 재할당이 가능하며 전역 변수이다. 이는 유연한 변수 선언으로 간단한 테스트에는 편리할 수 있겠으나, 코드량이 많아진다면 어디에서 어떻게 사용될지도 파악하기 힘들뿐더러 값이 바뀔 우려가 있다. // var는 function-scope이기 때문에 for문이 끝난다음에 i를 호출하면 값이 출력이 잘 된다. // 이건 var가 hoisting이 되었기 때문이다. for(var j=0; j

callback과 promise를 차이점을 알아보기전에 동기와 비동기에 대해서 먼저 알고 시작해야 한다. JS는 기본적으로 동기 처리이기 때문에 중간에 대량의 데이터를 응답 받거나 대량의 이미지 업로드를 실행한다면 이 실행이 다 끝날때까지 뒤의 실행들이 blocking된다. 그래서 실행이 오래 걸리는 실행문들은 비동기로 처리하여 전송을 보내놓고 응답을 받으면 실행되게 된다. 동기란? 동기는 말 그대로 동시에 일어난다는 뜻이다. 요청과 그결과가 동시에 일어난다는 약속인데, 바로 요청을 하면 시간이 얼마나 걸리든 요청한 자리에서 결과가 주어져야 한다. 비동기란? 비동기는 동시에 일어나지 않는다를 의미한다. 요청과 결과가 동시에 일어나지 않을거라는 약속이다. 동기와 비동기의 단점과 장점 동기방식은 설계가 매우..