본문 바로가기

프론트엔드(Front-End)10

[HTML] - 제목과 문단을 담당하는 태그(h, br, hr, &nbsp) 이번 포스팅에선 HTML(HyperText Markup Language) 마크업 언어란 무엇인지, 그리고 제목과 본문에서 사용될 수 있는 대표적인 태그들인 , , 태그, &nbsp에 대해 알아보도록 하겠습니다. 1. HTML(HyperText Markup Language) 1-1. HTML(HyperText Markup Language)의 정의 - HTML이란, 웹 페이지의 제목, 단락, 목록과 같은 본문을 위한 구조적인 표현, 외부 링크, 이미지 삽입 등 웹 페이지의 전반적인 구조 또는 정보를 표현할 수 있는 마크업 언어입니다. 1-2. HTML(HyperText Markup Language)의 특징 - 단순히 웹 페이지의 구조적 표현, 정보를 기술하기 위해 개발된 언어로 프로그래밍 언어가 가지는 코드.. 2022. 12. 22.
[JavaScript] - 명시적 형 변환, 암시적 형 변환 이번 포스팅에서는 JavaScript(자바스크립트)의 형 변환에 대해 정리한 글이며, 코드를 작성하면서 특정 데이터의 형태를 변환해 줘야 하는 상황이 생기는데 이를 형 변환(Type conversion)이라고 하며, 이에 대한 종류는 크게 명시적 형 변환, 암시적 형 변환이 존재합니다. 이에 대해 알아보도록 하겠습니다. 1. 명시적 형 변환(Explicit Type conversion) 2. 암시적 형 변환(Implicit Type conversion) 1. 명시적 형 변환(Explicit Type conversion) 1-1. 명시적 형 변환(Explicit Type conversion)이란? - 명시적 형 변환(Explicit Type conversion)이란, 개발자가 의도적인 목적을 가지고 직접 .. 2022. 12. 21.
[JavaScript] - 조건문, 반복문, prompt(), alert() 함수, Template literal 이번 포스팅에서는 JavaScirpt(자바스크립트)의 프로그램의 수행 로직에 적절한 분기를 두어 흐름을 바꿀 수 있는 조건문(Conditional statement), 특정 로직을 반복 수행하는 등의 반복문(Iteration statement)과 같은 프로그램의 전체적인 수행 흐름에 변화를 줄 수 있는 제어문(Control statement)에 대해 알아보겠습니다. (1) 조건문 (if, else-if, switch) (2) 반복문 (for) 1. 조건문(Conditional Statement) - if 문, else-if 문 1-1. 조건문의 정의 - 프로그램 수행 로직에 일정한 조건식을 두어(분기를 설정) 조건식의 결과에 따라 프로그램의 수행 흐름에 변화를 줄 수 있는 구문을 의미하며, 프로그래밍에서.. 2022. 12. 20.
[JavaScript] - 변수, 자료형, 연산자 - 이번 포스팅에선 JavaScript(자바스크립트)의 변수와 데이터 타입(자료형), 여러 가지 연산자에 대해 알아보도록 하겠습니다. 1. 변수(Variable) 1-1. 변수(Variable)의 정의 - 프로그래밍에서 변수(Variable)란 여러 언어와 마찬가지로, 특정한 데이터를 저장하기 위해 컴퓨터로부터 할당받은 메모리 공간을 의미하며 해당 메모리 공간에 붙은 이름을 변수명(Variable name)이라고 부릅니다. 특정한 데이터를 저장한 메모리 공간의 주소와 대응되는 특징을 가집니다. 1-2. 관례적인 변수명 Naming convention (네이밍 규칙) (1) 숫자로 시작하지 않습니다. - Example) 3userName (X), 1_age (X) ... (2) 특수문자는 "_"(Under.. 2022. 12. 19.
[JavaScript] - About JavaScript, ES5, ES6의 차이 1. What is a JavaScript? - JavaScript, 자바스크립트는 HTML, CSS로 구성된 정적 웹 페이지를 기반으로 다양한 동적인 기능, 보다 복잡한 기능을 수행할 수 있도록 하기 위해 만들어진 스크립트 기반 프로그래밍 언어입니다. - 여기서 말하는 동적인 기능, 보다 복잡한 기능들이라는 의미는 웹 페이지를 통해 특정 데이터가 주기적으로 갱신되거나, 엔드 포인트(End-point)에서 서비스를 경험하고 사용하는 사용자와의 상호작용(Interaction), 2D, 3D 기반의 이미지가 생동적으로 표현될 수 있는 범위들을 포함한 모든 동작, 행위들을 의미하며 사용자들이 유저 친화적인 서비스를 경험하기 위해 빠질 수 없는 이러한 요소들을 구현하는 언어가 JavaScript입니다. 2. J.. 2022. 12. 19.
[jQuery] - 클래스(Class), 부모 - 형제 노드(태그) 제어 jQuery에서 선택된 노드(태그)들에 대한 클래스들을 직접 제어, 선택된 노드의 부모 노드, 자식 노드, 형제 노드들에 대한 각 노드들을 제어할 때 자주 사용되는 메서드를 알아보도록 하겠습니다. 1. 클래스 제어 메서드 : addClass(), removeClass(), toggleClass() 문법) 1. $("선택자").addClass("class01"); // class01 값은 예시입니다. 2. $("선택자").removeClass("class01"); 3. $("선택자").toggleClass("class01"); - addClass() 메서드는 선택된 노드에 매개변수로 입력된 클래스를 추가합니다. - removeClass() 메서드는 선택된 노드에 매개변수로 입력된 클래스를 삭제합니다. - .. 2022. 7. 20.