호다닥

What is Http? Hyper Transfer Protocol Http is application layer protocol that allows web-based applications to communicate and exchange data. TCP/IP based Protocol Http used to deliver contents for example images, videos, audios, documents 3 Important things HTTP is connetionless - after making the request, the client disconnect from the server, then when response is ready the server re-establis..

It's stupid : 바보 같다 고 해석하시나요? stupid 는 '바보' 보다 강도가 조금 더 쎈 표현이다. 친하지 않은 사람에게 stupid 라고 하면 불쾌해할 가능성이 높은 표현이다. 그럼 It's stupid 는 어떤 의미일까? 단, stupid 는 뉘앙스나 문맥에 따라서 '미쳤다' 라는 의미로 사용하기도 한다. insane, ridiculous 와 같은 느낌 올바른 예시 His truck had a really expensive stereo system in it. It was stupid 걔 트럭에 엄청 비싼 스피커 있어. 완전 미쳤어 His parents spent a ton of money on his birthday party. It was stupid. 걔네 부모님이 걔 생이레 돈 ..

originally : 뿌리, 근원, 처음 올바른 사용 예시 I'm originally from Texas : 난 원래 텍사스에서 왔어, 내 뿌리는 텍사스에 있다. 잘못된 예시 She's originally pretty : 걔가 처음에는 예뻤는데(지금은 글쎄..) 이런느낌이 있다. This was originally for Frank but you can have it : 이거 원래 프랭크한테 주려고 했는데, 이제 프랭크한테 안 주고 너에게 줄게 원래 for instance 1 : 사람에 대해서 말할 때 -> 현재완료를 사용하기 Has he always been like that? : 걔 원래 항상 그래? She's always been kind of shy : 걔 원래 좀 소심하잖아 for instan..

ko.javascript.info/bubbling-and-capturing 버블링과 캡처링 ko.javascript.info capturing 과 bubbling 을 컨트롤하기 위한 꿀팁!! if ( event.target !== event.currentTarget ) { return; } /* 위 코드를 각각의 eventListner 에 삽입해준다. */ cf) event.stopPropagation(); event.stopImmediatePropagation(); stopPropagation 이나 stopImmediatePropagation 은 부모 컨테이너에서 작동하는 event의 동작에 영향을 미칠 수 있기 때문에 사용을 권장하지 않는다.

프로그래밍 언어 약속된 구문 (문법, Syntax)로 구성된 프로그래밍 언어를 사용하여 기계어를 대신 전달한 후, 컴파일러 (Compiler) 혹은 인터프리터(Interpreter)를 통해 기계어로 반환한다. *** 구문(Syntax) & 의미(Semantics) Javascript 자바스크립트는 일반적으로 프로그래밍 언어로서 기본 뼈대를 이루는 ECMAScript와 브라우저가 별도 지원하는 클라이언트 사이드 Web API, 즉 DOM, BOM, Canvas, XMLHttpRequest, Fetch, requestAnimationFrame, SVG, Web Storage, Web Component, Web worker 등을 아우르는 개념이다. 특징 별도의 컴파일 작업을 수행하지 않는 인터프리터 언어이다...

dataset 을 사용하기에 앞서 HTML에 data attribute를 customize 해줘야한다. Home About Skills My Work Testmonials Contact dataset attribute를 customize 하기 위해서는 data-(변수명) 으로 작성하고 value를 주면 된다. 그럼 dataset 에 -link라는 변수에 값들을 할당한 것이다. const navbarMenu = document.querySelector(".navbar__menu"); navbarMenu.addEventListener("click", (event) => { console.log(event.target.dataset.link); });

box-sizing : ( content-box (defualt) / border-box ) --subject-font: 32px;font-size: var(subject-font); border-box 는 box size를 결정할 때 border까지 합한다. 즉, padding 과 border를 모두 포함한다. 기본값인 content-box는 컨텐츠만 지정한다. position : ( static / absolute (default) / relative ) static은 기본값으로 아무런 효과 없다. relative 는 원래 있던 자리를 기준으로 이동한다. absolute 는 근접한 부모 중에 기본값인 static이 아닌 부모의 기준에서 움직인다. 중간에 position: relative 인 부모가 없..

SCSS : CSS Processer (전처리기) CSS Processor 에는 scss 외에도 stylus, less 도 있다. scss가 sass 를 위한 공식적인 syntax로 릴리즈 되면서 scss와 sass 가 점점 업계 표준으로 되어가고 있다. scss는 css를 programming language 처럼 syntax를 개선하는데, 이를 사용하면 css 없는 많은 유용한 기능을 사용할 수 있다. 단, 이것을 위해 compile과 build 하는 과정이 필요하다. gulp 는 compile 하거나 transform 해주는 nodeJS package gulpfile.babel.js 에서 routes 상수를 확인하면 해당 gulpfile 이 styles.scss 라는 특정 파일을 보고 있음을 알 수..

Flex flex 는 기기의 속성에 따라 디자인이 유동적으로 바뀌지 않는 CSS의 단점을 개선하기 위해 사용된다. 요소의 사이즈가 불명확하거나 동적으로 변화할때 유용하게 사용할 수 있다. 단, 부모가 flex-container 이어야만 자식 element 를 움직일 수 있다. FlexBox layout 에서 content, items, self 의 차이 Grid 주요 properties grid-auto-rows ( / [column]) grid-auto-flow : row(default) ( / [column]) - 내가 지정한 grid보다 더 많은 cell 들이 생성될 때, 추가 생성되는 cell 들을 어디로 생성할지 결정 minmax - element 크기 변화에 limit 을 준다. ( 최대값을 ..

function에서 console.log 와 return의 차이 5번째 줄 코드에서 greetNicolas 는 sayHello 함수의 리턴값이다. 다시 말해 greetNicolas는 sayHello의 실행된 결과값이다. 하지만 sayHello 함수는 아무것도 반환하지 않았다. greetNicolas에 반환값을 주고 싶으면 아래와 같이 sayHello 함수에 return , 반환값을 부여하면 된다. return 값을 주어 나만의 function 만들기 1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 const calculator = { plus: function (a, b) { return a + b; }, minus: function (a, b) { ret..