web
URI와 URL
URI와 URL
2021.09.29이전까지는 URL만 알고 있다가, 학교에서 웹 프로그래밍 수업을 들었을때 URI라는 것을 처음 알게되었다. 그렇다고 찾아본 건 아니고, 현재까지도 일을 하면서 매번 URI, URL 구분없이 사용하고 있다. 구분없이 사용한다고 큰 문제는 생기지 않지만, 개발자는 명확한 정의를 아는 직업 아닌가? 이 기회에 URI와 URL의 정의와 용도를 통해 둘의 차이를 알아보자. URI URI는 특정 자원(Resource)를 식별하는 통합 자원 식별자(Uniform Resource Idendifier)를 의미한다. 웹 상에서 논리적/물리적 리소스를 식별하는데 사용되는 고유한 문자열의 시퀀스이다. URI의 하위 개념으로는 URL과 URN이 있다. URL URL은 일반적으로 이야기하는 웹사이트 주소이다. 통합 자원 지시자(..
input 태그의 type 속성 종류와 예제
input 태그의 type 속성 종류와 예제
2021.01.21HTML에서 양식을 만들 때, form 태그를 사용하고, input 태그를 통해 입력 영역을 만듭니다. 입력 영역의 종류는 다양하며 type 속성의 값에 따라 동작 방식이 현격히 달라집니다. 특성을 지정하지 않는 경우 기본값은 text입니다. input 태그의 type 속성값 속성 설명 text 기본값으로 한 줄의 텍스트 입력 칸을 만듭니다. (기본 너비 문자는 20입니다.) password text 속성과 같지만, 입력 문자를 별표(*)로 대체해서 표시합니다. checkbox 선택 항목 중 여러개를 선택할 수 있는 체크박스를 만듭니다. radio 선택 항목 중 1가지만 선택 가능한 라디오 버튼을 만듭니다. button 누를 수 있는 기본 버튼을 만듭니다. submit 전송 버튼을 만듭니다. reset ..
tsconfig.json 컴파일 옵션 정리
tsconfig.json 컴파일 옵션 정리
2020.05.28tsconfig.json Typescript는 동적 타입언어인 JavaScript를 타입이 있는 형태로 코딩할 수 있게 해주는 언어입니다. 따라서 TypeScript로 짜여진 코드를 JavaScript로 변환해 줄 트랜스파일러(컴파일러)가 필요합니다. 컴파일은 다음과 같은 커맨드로 사용 가능합니다. tsc foo.ts 해당 컴파일 과정에 여러 옵션을 정할 수 있는데 이 옵션을 작성하는 파일이 tsconfig.json입니다. tsconfig.json의 기본 형태는 다음 커맨드를 통해 생성할 수 있습니다. npx tsc --init 해당 커맨드로 생성되는 기본 형태의 tsconfig.json 및 옵션들은 다음과 같습니다. tsconfig.json의 컴파일 옵션 정리 { "compilerOptions": { ..
[HTML] 🤔 HTML이란?
[HTML] 🤔 HTML이란?
2020.01.11🤔 HTML이란? HTML은 웹페이지를 만들기 위한 하이퍼텍스트 마크업 언어(HyperText Markup Language, 문화어: 초본문표식달기언어, 하이퍼본문표식달기언어)라는 의미의 웹 페이지를 위한 지배적인 마크업 언어다. HTML은 다음과 같은 특징을 가지고 있다. HTML은 태그를 통해 웹 페이지의 구조를 알려준다. HTML은 다양한 요소들로 이루어져있다. HTML은 브라우저에게 어떤 것이 보여질 지를 알려준다. HTML은 태그를 통해 표현된다. HTML 태그는 머릿말, 문단, 표 같은 것들을 라벨링한다. 📄 간단한 HTML 문서 첫 머릿말 첫 문단 해당 문서의 의미는 다음과 같다. 라는 선언은 해당 문서가 HTML5라는 것이다. 요소는 HTML 페이지의 root 요소이다. 요소는 문서에 대한..
[HTML] HTML DOM(Document Object Model)
[HTML] HTML DOM(Document Object Model)
2019.11.27HTML DOM(Document Object Model)이란? DOM은 W3C(World Wide Web Consortium) 표준으로 DOM은 문서를 접근하기 위한 표준을 정의합니다. W3C DOM은 프로그램들과 스크립트들이 콘텐츠나 구조, 문서의 스타일에 동적으로 접근하고 수정하기 위한 플렛폼이자 언어 중립적 인터페이스입니다. W3C DOM 표준은 3개로 나뉘어져 있습니다. Core DOM - 모든 문서 종류에 대한 표준 모델 XML DOM - XML 문서에 대한 표준 모델 HTML DOM - HTML 문서에 대한 표준 모델 DOM은 문서의 구조화된 표현 제공을 통해, 프로그래밍 언어가 DOM구조에 접근할 수 있는 방법을 제공하여 그들의 문서 구조 및 스타일이나 내용등을 변경할 수 있게 합니다. 우리..
[JavaScript] 변수의 범위(variable scope)
[JavaScript] 변수의 범위(variable scope)
2019.02.11변수 범위(Variable Scope) 변수 범위는 특정 변수가 존재하는 영역입니다. 이를 통해 어디서 변수를 접근할 수 있는 지 알 수 있습니다. 변수(variable)은 지역 범위(local scope)와 전역 범위(global scope)를 둘 중 하나를 갖게 됩니다. 지역 범위(local scope, function-level) C 혹은 C++이나 JAVA같은 프로그래밍 언어와는 달리, JavaScript는 블록 수준(block-level)의 범위를 가지고 있지 않습니다. 대신 JavaScript는 함수 수준(function-level)의 범위를 가집니다. 함수 안에서 정의된 변수는 지역 범위(local scope)를 가지며, 해당 함수와 그 내부 함수에서만 접근 가능합니다. 내부 함수에서의 외부..
[CSS] 🐸 게임으로 Flex 박스 CSS 익혀보자! Flexbox Froggy
[CSS] 🐸 게임으로 Flex 박스 CSS 익혀보자! Flexbox Froggy
2018.12.24Flexbox Froggy Flexible 박스 레이아웃 모듈은 유연한 반응형 레이아웃 구조를 만들 수 있는 CSS의 매우 강력한 효과 중 하나이다. justify-content, align-items... 이런 저런 것들 어떻게 시작해야 할 지 모르겠다면 게임을 통해 재미있게 배울 수 있는 사이트가 있다. 바로 Flexbox Froggy이다. 이 게임의 목표는 단 하나 개구리를 수련 위에 올려놓는 것이다. 그리고 우리는 그 방법으로 CSS를 이용하게 된다. 위의 사진 스테이지를 예시로 들어보자 개구리는 display: flex 상태이고, 오른쪽 끝으로 가야 수련 위에 올라간다. 따라서 justify-content: flex-end로 오른쪽 끝으로 보내서 문제를 해결하면 된다. 약간 더 심화된 스테이지를..
구글 애드센스(AdSense)와 카카오 애드핏(AdFit) 비교하기
구글 애드센스(AdSense)와 카카오 애드핏(AdFit) 비교하기
2018.12.22구글 애드센스(AdSense)와 다음 애드핏(AdFit) 비교하기 / 애드핏 수익 인터넷 광고 매체를 찾으면서 공부하게 된 점과 느낀 점에 대해서 정리해보려 한다. 역시 인터넷 광고의 세계 최강 구글 애드센스와 한국 최강 다음 애드핏이 그 상대가 될 것이다. 애드센스(AdSense) 애드센스는 구글이 운영하는 수익 배분 사업의 일환으로 운영되기 시작하였다. 수익 배분 사업을 쉽게 풀이하자면 광고 게재 사업 정도라고 보면 된다. 광고주들이 구글에게 광고를 의뢰하면 구글은 개인 사이트 및 블로그에 광고를 게시한다. 이로부터 구글이 일정 수익 이상을 받으면 고객에게 광고료를 지급하는 방식이다. 애드핏(AdFit) 매체 운영자(이하 퍼블리셔)가 자신의 매체에 광고를 게재하여 수익을 얻을 수 있는 서비스입니다. ..
프로그래머 기술 면접 단골 질문과 답변 모음
프로그래머 기술 면접 단골 질문과 답변 모음
2018.12.21프로그래머 기술 면접 단골 질문과 답변 모음 유튜버 당산스튜디오님이 올리신 영상인 " 기술면접 단골질문을 알아보자 "라는 영상입니다.해당 영상에 나온 질문들을 정리하고 그에 해당하는 답변을 포스팅하면서 해당 포스트에 링크하는 방식으로 진행하겠습니다. Q. Class, Object, Instance의 차이점이 무엇인가요? A. http://geonlee.tistory.com/11 Q. Overriding와 Overloading의 차이점이 무엇인가요? A. http://geonlee.tistory.com/14 Q. Quick sort/ Bubble sort 알고리즘이 무엇인가요? Q. Pointer가 무엇인가요? Q. 자료구조에서 스택, 트리, 큐, 힙에 대해서 설명해주세요. Q. JAVA의 Garbage ..