본문 바로가기

Archive/WEB

(32)
[HTML] <Img> 태그 사용법 & alt 속성 SEO HTML 이미지 태그는 이미지 파일을 HTML 문서에 출력해 주는 기능을 수행하는 태그입니다. HTML img 속성 으로는 대표적으로 src, alt, width, height 가 존재합니다. 본 포스팅 에서는 이미지 태그의 사용방법과 이미지 태그의 기본적인 4가지 속성의 사용방법에 대해 소개하고 있습니다. 📃List 1. HTML img 태그 사용 방법 1.1 src 속성 1.2 alt 속성 1.3 width, height 속성 💡 개인적인 공부 내용을 기록하고자 하는 용도로 작성한 글 이며, 계속적으로 수정 및 추가해 나갈 예정입니다. 1. HTML img 태그 사용 방법 1.1 src 속성 img 태그의 src 속성에는 현재 이미지 파일이 존재하는 url을 적습니다. url의 유형은 1.절대경로 2..
[JavaScript] Logical Operator && || 의 또 다른 기능 Short Circuiting JavaScript 에서 Logical Operator [논리 연산자] 라고 불리우는 || && 연산자는 다른 언어와 달리 논리적 기능 이외에도 Short Circuiting 이라는 특이한 성질을 가지고 있다. 다른 언어에서 논리 연산자를 접하고 JavaScript로 넘어온 경우 short circuiting 이라는 개념이 생소할 수 있기에 이번 포스팅 에서 정리해 보고자 한다. 📃List 1. OR Operator short circuiting 2. AND Operator short circuiting 2.1 if statement vs short circuiting 💡 개인적인 공부 내용을 기록하고자 하는 용도로 작성한 글 이며, 계속적으로 수정 및 추가해 나갈 예정입니다. 1. OR Operator..
[JS] this Keyword 정복 하기 Vol1 - about this keyword this keyword는 다른 객체지향 언어(Java, C++...)에서도 등장하는 개념입니다. 일반적으로 프로그래밍 언어에서 this랄 자기 자신을 가리키는 참조 변수입니다. 하지만 JavaScript 에서의 this는 다른 언어들과는 달리 호출하는 대상에 따라서 가리키는 대상이 달라져 기본 작동 원리를 확실하게 이해하지 않으면 상당히 애를 먹을 수 있습니다. 따라서 이번 포스팅 에서는 JavaScript의 this keyword에 대해 정리해 보고자 합니다. 📄목차 ...Before Start 1. 단독으로 호출되는 this 2. 함수 내부에서 호출되는 this 3. 메서드에서 호출되는 this 4. 화살표 함수 내부에서 호출되는 this Note ...Before Start this keyword에..
[JS] querySelector - CSS Property 접근 하기 💬 안녕하세요 nov입니다. 이전 포스팅에서 window document 객체의 querySelector와 querySelectorAll 메서드를 사용해 HTML element에 접근하는 방법에 대해서 정리해 보았습니다. → [JS] querySelector & querySelectorAll - HTML element 접근하기 이번 이어지는 포스팅에서는 querySelector 메서드를 이용하여 CSS Property에 접근하는 방법과 유의할 점에 대해 정리해 보도록 하겠습니다. 💡 개인적인 공부 내용을 기록하는 용도로 작성한 글 이기에 잘못된 내용을 포함하고 있을 수 있으며, 지속적으로 수정해 나갈 예정입니다. querySelector With CSS Property document.querySelec..
[JS] querySelector & querySelecotrAll - HTML element 접근 하기 [List] #1 document.querySelelctor #2 document.querySelectorAll 💡 개인적인 공부 내용을 기록하는 용도로 작성한 글 이기에 잘못된 내용을 포함하고 있을 수 있으며, 지속적으로 수정해 나갈 예정입니다. #1. document.querySelector document.querySelector는 HTML의 Element에 접근할 수 있도록 도와주는 window.document에 정의된 메서드입니다. 괄호 안의 따옴표(' ')안에 접근하고자 하는 Element의 Selector(선택자)를 넣습니다. class에 접근하고자 한다면 클래스 이름 앞에 dot(.)을 붙여 .className 같은 형식으로 작성하며, id에 접근하고자 한다면 아이디 이름 앞에 #을 붙여 ..
[Node.js] Path Module 사용법 * 개인적인 공부 내용을 기록하는 용도로 작성한 글 이기에 잘못된 내용을 포함하고 있을 수 있습니다. * 지속적으로 내용을 수정해 나갈 예정입니다. _contents #1 Path Module이란? #2 Path 모듈 사용법 #2.1 __filename & __dirname #2.2 path.sep & path.delimiter #2.3 path.join #1 Path Module이란? path 모듈은 Node.js에서 폴더와 파일의 경로를 쉽게 조작하도록 제공하는 모듈이다. path 모듈이 필요한 이유 중 하나는 운영체제별로 경로 구분자가 다르기 때문이다. 운영체제의 경로는 크게 Window Type 과 Unix Type(MAC & LINUX)으로 나뉜다. Window Type : C:\Users\No..
[HTTP] HTTP Request & Response 메시지 구조 * 개인적인 공부 내용을 기록하는 용도로 작성한 글 이기에 잘못된 내용을 포함하고 있을 수 있습니다. * 지속적으로 내용을 수정해 나갈 예정입니다. _reference https://developer.mozilla.org/ko/docs/Web/HTTP/Messageshttps://developer.mozilla.org/ko/docs/Web/HTTP/Messages 인프런 - 모든 개발자를 위한 HTTP 웹 기본 지식 (김영한 강사님) _contents #1 HTTP란? #2 HTTP Message Structure #3 HTTP Response & Request Message #1 HTTP란? HTTP(HyperText Transfer Protocol)란 HTML 문서를 전송하기 위해 고안된 프로토콜(규..
[HTTP] Content-Type & MIME *개인적인 공부 내용을 기록하는 용도로 작성한 글 이기에 잘못된 내용을 포함하고 있을 수 있습니다. *지속적으로 내용을 수정해 나갈 예정입니다. _Ref https://developer.mozilla.org/ko/docs/Web/HTTP/Basics_of_HTTP/MIME_types _Content #1 Content-Type #2 MIME #3 Content-Type 종류 #1 Content-Type Content-Type이란 HTTP 통신에서 전송되는 데이터 타입을 나타내는 Header의 한 요소로 수신자는 명시된 Content-Type에 따라 수신측은 데이터를 어떻게 처리할 지를 결정한다. 만약 Content-Type을 따로 명시하지 않으면 수신측은 단순한 텍스트 데이터로 처리한다. Content-..