1. HTML이란? 태그 구조 > - 태그 구조는 위와 같이 Opening tag, content, Closing tag로 이루어져 있으며 이를 Element라 함 2. HTML이 중요한 이유 빠르게 변화하는 현대사회에서 검색엔진에 노출되지 않는다는 것은, 존재하지
<h1>~<h6>: 제목 및 중요도에 따라 사용( h7은 없음, 숫자가 클수록 소제목 )<p>: 해당 주제에 관련된 내용을 서술할 때 사용<strong>: 강조(bold), 실제로 의미를 강조하는 내용 (웹 접근성 측면에서 적절한 사용)<b
1. Form Tags form: 사용자로부터 특정한 정보나 데이터를 받고자 할 때 사용(이때 사용자는 client, 데이터를 받는 쪽은 server를 뜻함. 결론적으로 서버에게 데이터를 전송하기 위해 사용) 사용자들에게 단순히 정보를 제공하는 이전 태그와들과는 다른
1. Semantic elements 이란? Semantic Elements는 의미론적 요소로서, 정확한 의미를 가진 태그를 전달 및 마크업을 하기 위해 도입 즉 개발자와 브라우저에게 정확한 의미를 전달함으로써, 개발자에겐 개발 및 유지보수를 용이하게 만들고 브라우저
1. CSS란? Cascading Style Sheet, html 문서 내 정보 컨텐츠의 스타일, 글꼴 등 시각적인 요소들을 분리하여 관리하기 위해 도입된 언어이다. 2. CSS 사용 방법 1. link 태그를 통한 삽입 > 아래와 같이 ` 태그 안의 ` 태그를
개발자 도구를 통해 해당 페이지 확인 결과, html의 모든 요소들은 모두 box로 렌더링되어 표현되는 것을 알 수 있다.일정한 형태의 model로 구성되어 있기 때문에 이를 box model이라고 한다.아래와 같이 box model은 margin,border,padd
✔ 웹페이지의 CSS 속성중 요소의 Box Type을 결정 짓는, 매우 중요한display 속성에 대해 알아보자. ✔ 대표적으로 Inline,Block,Inline-block, 이 3가지의 속성값이 존재한다. 1. Block > block의 특징은 한 줄에 하나
1. Flex-box Flex-box는 box 정렬의 끝판왕이다!! 기존에 요소들의 수직 정렬은 크게 문제가 되지 않았지만, 수평 정렬의 경우 float 와 clearFix, display: inline-block의 도움을 받아왔다. 하지만 이러한 방법들은 다양한
✔ 사전스터디 JavaScript 내용은 유튜버 드림코딩 엘리님의 강의를 참고하였다.자바스크립트란 객체 기반의 프로그래밍 언어이다.웹 브라우저에서 유일!!하게 구동되는 프로그래밍 언어이다.웹의 기본 3구성 중 정적인 HTML, CSS와 달리 동적인 언어이다.(움직이거나
JavaScript의 변수에 대해 알아보기에 앞서, use strict에 대해 간단히 알아보자. 1. use strict in Vanilla JS > use strict를 사용하지 않은 첫 번째 사진에서는 선언되지 않은 변수 a에 6을 재할당 했는데도 불구하고 참조
자바스크립트의 데이터 타입은 primitive type, object type, function 이 있다.더이상 작은 단위로 나뉘지 않는 가장 작은 데이터의 형태이다.숫자형 데이터숫자형 데이터가 아닌 값이 계산될 경우 NaN 값이 출력된다.문자형 데이터''나 "" 를
1. String concatenation (문자열 연결) > +를 사용해서 string끼리 합해 사용할 수 있다. 따옴표가 아닌, 백틱()을 사용하면. + 없이 문자열을 합할 수 있다. (템플릿 리터럴) 두 번째 예제처럼, 백틱() 안의 ${}를 통해 문자열과 변
함수란 프로그램을 구성하는 기본적인 building block이다.subprogram이라고도 불리우며 여러번 재사용이 가능하다.특정 업무를 수행하거나 값을 계산한다.함수를 선언해준다. (함수 선언식, 함수 표현식)함수를 호출한다.(함수명())명사형을 쓰는 변수의 이름
Object?? object(객체) 는 JavaScript의 데이터 타입의 일종이다. 하나의 변수에 하나의 값만 저장할 수 있는 primitive type data와 달리, object는 관련 있는 값들을 묶어서 할당할 수 있다. (하나의 집합같은 느낌) primit
배열은 순서가 있는 요소값들을 가진 객체와 같다. 객체의 일종이지만 순서가 있는 자료를 저장하고 관리하는 용도에 최적화된 자료구조를 뜻한다.두가지 문법을 통해 배열을 생성 및 선언할 수 있다.배열 안에는 같은 타입의 데이터를 넣는 것이 좋다. 배열의 요소에는 각각 in
배열은 객체와 마찬가지로 단순히 변수에 복사하고자 하는 객체를 할당할 경우, 참조값만 늘어나게 된다. (배열은 근본적으로 객체의 한 종류이기 때문이다.)이를 위해 원본 배열은 변경하지 않으며 메소드의 반환값으로 새로운 배열을 리턴하는, 간단히 말해 배열 복제(?)의 기
ES6에 추가되었으며 배열, 문자, 객체 등 반복 가능한 객체를 개별 요소로 분리하는 기능을 가진 문법이다. (반복 가능한 객체는 찾아봐도 잘 이해가 ..., 예제를 통해 이해하는게 더 빠른거 같다 ..)사용법은 원하는 값 앞에 ... 를 붙여 사용하며 위 예제처럼
Class란?? class는, 일종의 객체를 찍어내는 틀이다. 즉 생성자 함수 및 new 키워드를 통해 유사한 형태의 객체를 여러개 생성했던 것처럼, class문법을 사용하여 객체 및 해당 객체에 소속된 메소드를 생성할 수 있다. 이때 생성된 객체를 인스턴스라고 한
이번에는 Array 메소드 중 자주, 흔히 쓰이는 친구들에 대해서 살펴보도록 하겠다. forEach() 메소드는 각 요소들을 인자로 받아와 콜백 함수 내부에서 주어진 함수를 배열 각각의 요소에 적용한다.배열 각각의 요소에 적용할 때 for loop, for..of등을
콜백함수? 콜백 함수란 다른 코드(함수,메소드)에 인자로 넘겨주는 함수로서, 콜백 함수를 넘겨받은 코드는 이 콜백 함수를 필요에 따라 적절한 시점에 실행한다. JavaScript는 동기적 언어이다. 콜백 함수는 필요에 따라 synchronous(동기적), Asyn
Promise?? promise란, 비동기 처리를 효율적으로 처리하기 위해 도입된 클래스의 종류이다. 나쁜 가독성, 복잡도 증가 및 에러 처리 곤란 등 전통적인 콜백 함수 패턴의 단점들을 보완하며 비동기 처리 시점을 명확하게 표현할 수 있다. 특정 기능이 실행되어
프론트, 백을 막론하고 웹의 통신 과정은 매우 중요하다. 때문에 오늘 학습한 clent, server에 대해 정리해보도록 하겠다. client: 일반적으로 웹 브라우저(Internet Explorer, chrome, Firefox 등) 프로그램이 설치된 컴퓨터를 Cli
Hyper Text Transfer Protocol의 약자로, 웹 브라우저와 웹 서버간의 원활하기 위해 필요한 통신 규약이다. HTML, CSS, JS 등의 컨텐츠 및 정보를 주고받기 위해 서로가 알아 들을 수 있는 공통의 약속인 message 를 뜻한다. mess