목록전체 글 (56)
carrots-day
URL (Uniform Resource Locator) 네트워크 상에서 자원이 어디 있는지를 알려주기 위한 규약으로 위치 정보 문자열, 즉 웹 리소스에 대한 주소이다. 그냥 우리가 흔히 아는 웹 주소를 의미한다. 여러분이 오덕이라고 가정했을 때 야애니 피규어 사진을 다운로드한다 치자. 웹 서버는 입력된 URL을 통해 해당 사진을 찾아 당신의 브라우저로 보내줄 것이다. 이때 그 리소스에 대한 주소를 말한다. URL 구조 scheme:[//[user[:password]@]host[:port]][/path][?query][#fragment] scheme : 프로토콜 (http 또는 https) user와 password : 리소스 접근시 로그인이 필요한 서비스의 경우 사용자 id / pw host와 port ..
IT 실무 용어 IT는 참 이상하다. 개발 기술 자체는 명확한데 개발자들끼리 커뮤니케이션하다보면 말하는 방법도 다르고 단어도 다르다. 그래서 정리해봤다. 간지나는 실무 용어 정리다. 자료조사와 생각나는대로 이 게시글에 정리해볼 생각이다. 인프라 인프라 IT 리소스, 시스템, 플랫폼, 환경을 제어하는 인력으로 대부분 하드웨어나 CI/CD 관리를 한다. DevOps Development + Operation 개발과 운영을 결합해 탄생한 개발 방법론으로 개발 운영 둘다 하란 뜻이다. 컴파일 컴파일이란 소스 A > B로 변환하는 작업을 말한다. 우리가 Java, C#로 코드를 짜봤자 컴파일이 없다면 컴퓨터는 해당 소스를 실행시키지 못한다. 한마디로 기계어로 변환하는 작업을 말한다. 인터프리터 인터프리터는 프로그..
이벤트의 전파 이벤트는 상위에서 하위, 하위에서 상위로 전파되는 특징을 지녔다. 전파 방향에 따라 버블링, 캡처로 구분된다. 이벤트에 대해 공부하다 보면 버블링, 캡쳐, 위임에 대한 내용을 한번쯤은 봤을 것이다. 이번 글에서 브라우저에서 특정 화면 요소의 이벤트를 감지하는지, 그 이벤트를 어떻게 다른 화면 요소에 전파하는지 알아보자 이벤트 버블링 (Event Bubbling) 특정 화면 요소에서 이벤트가 발생하였을 때, 특정 요소뿐이 아니라 상위 요소들로 전파되는 특성을 의미한다. 버블링은 하위요소 부터 시작해 최상위 요소까지 전달된다. 코드로 보면 이해가 가능하다. const divs = document.querySelectorAll("div"); // 각 div 객체에 이벤트 등록 divs.forEa..
이벤트 (Event) 이벤트(event)란 여러분이 프로그래밍하고 있는 시스템에서 일어나는 사건(action) 혹은 발생(occurrence)인데, 이는 여러분이 원한다면 그것들에 어떠한 방식으로 응답할 수 있도록 시스템이 말해주는 것입니다. 존대해도 간지나는 척 말하는건 좀 재수없다. 쉽개 말해서 브라우저에서 일어나는 브라우저에서의 사건을 말하는 것이다. 여기서 사건이란 사용자가 특정 행동을 했을 때 상호작용으로 인해 발생하는 것을 말한다. 예를 들어 당신이 브라우저 버튼을 클릭하면 클릭 이벤트가 발생하는 것이다. 이벤트 종류 전적으로 많이 사용하는 이벤트를 정리해봤다. (사실 다른 글에서 퍼옴 ㅎㅎ) 정리 잘해놓으셨네 ㅋㅋ.. JavaScript - 이벤트(Event), 이벤트의 종류, 이벤트 연결 ..
AJAX (Asynchronous JavaScript And XML) 비동기적인 웹 애플리케이션의 제작을 위해 아래와 같은 조합을 이용하는 웹 개발 기법이다. AJAX란 주로 웹 서버(백엔드 소스)와 통신할때 사용하는 기법으로 브라우저 내장 XMLHttpRequest 객체를 통해 웹 서버와 비동기적 통신을 중개하는 것을 말한다. 비동기 처리에 관한 내용은 이전글에서 작성했으니 그거 보면된다. >> 동기/비동기 처리, callback/Promise/async & await [ 동기/비동기 처리, callback/Promise/async & await ] 동기/비동기 처리의 개념과 callback/Promise/async&await에 대해 알아보자 velog.io 에이잭스, 아작스등으로 불리는데 뭐가 맞다 ..
Node.js Node.js는 Chrome V8 JavaScript 엔진으로 빌드 된 JavaScript 런타임이다. 공식 문서에서 말하는 Node.js다. 늘 그렇듯 간지나는 말로 도배되있을 뿐, 찰떡같이 이해되지 않는다. 손 많이 가는 녀석들.. 나름대로 요약해보면 Node.js는 확장성이 있는 네트워크 어플리케이션 개발에 사용되는 소프트웨어 플랫폼으로 javascript를 활용하여 구축하며, Non-blocking I/O와 단일 스레드, 이벤트 루프를 통한 높은 처리 성능을 가지고 있는 것이 특징이다. 쉽게 말해 백엔드 소스를 포함하고 있는 일반 어플리케이션보다 경량화되어있고, JAVA가 JVM을 활용하여 운영체제의 영향없이 런타임을 구성하듯 V8 엔진 베이스 javascript 런타임 환경을 구성..
this this는 javascript 예약어로 수행하는 주체가 되는 인스턴스를 지칭하는 자기 참조 변수이다. 상황에 따라 this가 지칭하는 대상이 다르기 때문에 상황별로 어떤 것을 참조하는 지 알아둘 필요가 있다. 난 일을 할때 this에 대한 정확한 개념을 갖고 쓰진않았다. 그냥 여기서 this쓰면 이놈이겠지? 하면서 썼다. 근데 그게 맞았다. 내 자랑이 아니라 그만큼 this는 사용함에 있어 어느정도 추측이 가능하단 얘기다. 그래도 이 글을 읽는 사람들은 this의 사용 위치에 따라 정확히 어떤 것을 참조하는 지 알고 싶어서 읽는 것이라고 생각한다. 그래서 조사해봤다. this 특징 this의 값은 함수를 호출한 방법이 결정한다. 실행하는 중 할당으로 설정할 수 없고 함수를 호출할 때 마다 다를 ..
동기/비동기 처리 javascript는 기본적으로 싱글 스레드 엔진을 기반으로 실행되기 때문에 기본적으로 동기 처리되어 작성한 순서대로 수행된다. 하지만 소요가 큰 작업이 수행되면 어떨까? 선행 코드가 수행되기까지 기다려야한다. 선행 여부와 관계없이 수행할 수 있는 기능이 바로 비동기처리이다. javascript에서 코드를 실행시킬때 방식은 2가지로 분류할 수있다. 동기처리 방식과 비동기처리 방식이다. 다음 그림이 동기와 비동기의 차이를 명확하게 해준다. 동기처리 : 서버에 요청을 보냈을 때 응답이 돌아와야 다음 동작을 수행할 수 있다. 비동기처리 : 서버에 요청을 보냈을 때 응답 여부와 관계없이 다음 동작을 수행 할 수 있다. 대표적으로 setTimeout과 AJAX가 있다. 쉽게 말해 실행 시점의 차..