728x90

분류 전체보기 673

템플릿 리터럴

템플릿 리터럴 문자열 안에 데이터 표현식을 삽입할 수 있는 표현법이다. 백틱(`)을 이용한 표헌 백틱은 물결 키(~)를 shift 누르지 않고 누르면 입력 가능하다. 변수나 메소드 모두 템플릿 리터럴에 삽입될 수 있다. 기존문자열과 차이점 기존 문자열 템플릿 리터럴 차이점 문자열 안에 표현식을 삽입할 수 있다 = 문자열의 내용에 데이터 삽입 가능 달러 사인($)과 플레이스 홀더({})를 기입 문자열 안에 달러 사인($)과 플레이스 홀더({})를 기입하고 그 안에 데이터를 기입하면 된다. 그 데이트는 문자열의 일부가 된다. 예시 입력 내용 아래 코드표: 변수이므로 값의 변경이 가능하다. let lit = "따옴표" console.log(lit); str = `백틱 백틱` console.log(lit); 콘..

코딩/웹 개발 2021.12.19

자바스크립트 상수

1. 상수 상수는 변하지 않는 값이다. constant의 약자이다. constant: 변함없는, contancy: 불변성 변수와 상수의 차이점과 공통점 차이점과 공통점 변수 상수 차이 변하는 값 변하지 않는 값 값은 변할 수 있다. 단 하나의 값(데이터)을 위한 것 값(데이터)의 변경 불가 선언과 초기화를 ①따로 해도 되고 ②동시에 해도 된다. 선언과 초기화를 ②동시에 해야 한다. (하나의 구문으로 1번에 처리) const x = 데이터; 공통점 지정된 데이터 대신 사용 가능 이름 짓기 규칙 let 이름 = 데이터; 이름 짓기 규칙 let 이름 = 데이터; 선언과 초기화를 동시에 해야 한다. 선언과 초기화를 따로 하면 아래 그림처럼 오류가 난다. const aa; aa=10; console.log(aa)..

코딩/웹 개발 2021.12.19

자바스크립트 변수, 변수란, 변수 사용 이유

변수란 변수란 변할 수 있는 값이다. 세상에서 가장 자주 바뀌는 것은 여자의 마음이다. 여자의 마음을 담아 두거나, 흑은 미움 같은 것, 사랑 같은 것 담아 둔다. 변수란 그런 것들을 담아두는 저장소이다. 변수란 변할 수 있는 값을 보관하는 저장소이다. (변수=변할 수 있는 값을 저장하는 데이터 저장소) 변수를 사용하는 목적 마음이 바뀌거나, 상황이 바뀌면 빨리 대처하기 위함 예시 1 입력된 데이터 let he; he = 'hate'; console.log(he) console.log(he) console.log(he) console.log(he) console.log(he) console.log(he) console.log(he) console.log(he) console.log(he) console...

코딩/웹 개발 2021.12.19

디버깅 콘솔

1. 디버깅 콘솔 콘솔이란 무엇인가? 콘솔은 제어판 또는 계기판이다. 음악에 있어 믹싱 작업을 할 때, 콘솔로 조정을 한다. (미스트 트롯 할 때 뒤에서 믹싱하는 팀들을 보면 콘솔을 열심히 만지며 보컬의 목소리와 음향과 효과를 조절한다) 눈에 보이는 계기판(제어판)이 있어야 조정하기가 쉽기 때문이다 웹에서도 마찬가지다. 디버깅이란, 코딩 작업을 하는 중, 혹은 끝낸 후, 버그를 잡아내는 작업을 말하는데, 눈으로 봐야 잡아낼 수 있다. 벌레를 잡아내기 위한 코드 계기판이 콘솔인 것이다. 왜 벌레를 잡아내는가? 왜 프로그램에 문제아를 벌레(버그)라고 부르는가? 옛날에 컴퓨터 속 작은 부속판 틈 사이에 벌레가 많이 생겼고, 벌레가 많이 나왔기 때문이다. 그러므로 디버깅이란 벌레(코딩 오류) 잡는 과정이고 디버..

코딩/웹 개발 2021.12.18

올바른 카메라 잡는 자세: 안정적인 촬영을 위한 기본 가이드

카메라를 올바르게 잡는 자세는 흔들림 없는 사진 촬영의 기본입니다. 안정적인 자세와 카메라 그립법은 사진의 선명도를 높이고, 장시간 촬영 시 피로를 줄이는 데 중요한 역할을 합니다.1. 왜 올바른 자세가 중요한가?올바른 카메라 잡는 자세는 사진의 흔들림을 줄이고, 선명한 결과물을 얻기 위해 필수적입니다. 특히, 장시간 촬영이나 망원렌즈 사용 시 잘못된 자세는 피로와 함께 사진의 품질 저하를 가져올 수 있습니다. 올바른 자세는 카메라와 사용자 간의 균형을 유지해 안정감을 제공합니다.2. 올바른 카메라 잡는 자세1) 스탠딩 자세다리 자세:두 다리는 어깨 너비로 벌리고, 체중을 균등하게 분산합니다.한쪽 다리를 약간 앞으로 내밀어 균형을 잡습니다.팔 자세:오른손은 카메라의 그립 부분을 단단히 잡습니다.왼손은 렌..

자바스크립트 객체

자바스크립트 객체 자바스크립트에서 객체란 '값 또는 기능을 가지고 있는 데이터'를 말한다. 웹에서 최초의 객체는 웹브라우저이다. 자바스크립트는 웹브라우저에게 의사 전달을 하는 언어이다. 웹브라우저에게 의사 전달(명령)을 하기 위해 자바스크립트는 다양한 객체들을 제공한다. 그것의 대표적인 것은 window라는 객체이다. 자바스크립트에서 window는 웹브라우저에 접근할 수 있게 해 준다. '값이나 기능을 보유하고 있는 데이터'가 객체이며 값이나 기능을 사용하기 위해서는 객체 뒤에 점을 찍어서 사용한다. 객체.데이터 객체가 보유하고 있는 데이터를 사용 가능(숫자 ,문자 등 다양한 데이터) 객체.기능() 객체의 기능을 사용할 수 있다(괄호가 있어야 한다) 객체의 기능 alert: (괄호) 안에 따옴표를 쓰고 ..

코딩/웹 개발 2021.12.11

초경량비행장치 비행승인

초경량 비행장치 비행 승인 1. 비행제한 공역에서의 비행 승인 비행 승인을 받아야 하는 초경량 비행장치와 비행 승인 제외 대상 초경량비행장치는 다음과 같다. 근거 법률: 항공안전법 제127조(초경량 비행장치 비행 승인), 시행규칙 제308조(초경량 비행장치의 비행 승인) 1) 비행승인을 받아야 하는 초경량 비행장치 동력비행장치 회전 익비행 장치 동력 패러글라이더 무인비행기(최대 이륙중량 25kg 초과 자체중량 150kg 이하) 무인 헬리콥터(최대 이륙중량 25kg 초과 자체중량 150kg 이하) 무인 멀티콥터(최대 이륙중량 25kg 초과 자체중량 150kg 이하) 무인비행선(길이 7m 초과 20m 이하, 자 체중량 12kg 초과 180kg 이하) 행글라이더(사업용에 한함) 패러글라이더(사업용에 한함) 낙..

CSS 플렉스박스 (2)

flexbox 요소들의 배치 방법에 관한 속성 플렉스 박스 속성들을 사용하여 주축과 교차축을 기준으로 요소들을 어떻게 배치할지 선택할 수 있다. 지난 글에 플렉스 박스(1) 이은 글 2021.12.09 - CSS 플렉스 박스 (1) 속성 내용 justify-content 주축 배치 방법 align-items 교차축을 기준으로 요소 배치 방법 align-self 교차축을 기준으로 개별요소 하나하나의 배치 방법 flex-wrap 줄 바꿈 여부 flex-wrap 은 요소의 내용이 너무 많아서 flex 컨테이너 축의 길이를 넘을 때 자동 줄 바꿈을 할 것인지에 대한 결정 속성이다. (참고: justify의 뜻: 행의 끝을 나란히 맞추다.) 1-1. justify-content:center; 적용 전 적용 전 결..

코딩/CSS 2021.12.10

CSS 플렉스박스, flexbox (1)

CSS 플렉스박스, flexbox 1. flex 박스란 박스 속 각 요소들의 공간 배분과 정렬 기능을 제공하는 1차원 레이아웃 모델이다. flex 컨테이너라고도 부른다. 즉 그 속에 요소들을 포함하고 그 요소들 간의 레이아웃을 결정하는 역할을 한다. flexbox를 1차원 모델이라 부르는 이유: 레이아웃을 한 번에 하나의 차원만을 다루기 때문이다. 즉 행 또는 열 만을 다룬다. flex 박스가 행을 다룰 때는 요소를 가로 방향으로 진행 시키고 열을 다룰 때는 요소를 새로 방향으로 진행 시킨다 2. 구문 flex 컨테이너를 만들기 위해서는 컨테이너에 디스플레이 속성에 속성값 flex를 적용한다. display: flex; 3. flex 박스 적용방법 1) 적용전 컨테이너 div(네모 상자 4개를 포함하고 ..

코딩/CSS 2021.12.09

css 상속, inherit, initial, unset

1. 상속 inherit, initial, unset 상속(inherit)은 하위 요소가 상위 요소의 스타일 속성 값을 물려받는 것이다. html 문서는 태그가 태그를 포함하는 방식이므로 그 결과 요소가 요소를 포함하는 구조로 웹 콘텐츠가 브라우저 화면에 표시된다. 예를 들어 ul 요소(순서 없는 목록)는 ul 요소 안에 li 요소(리스트 item)를 다수 포함하는 형식으로 만들어지고 표시된다. 이때 ul은 li의 상위 요소이고 li는 ul의 하위 요소이며, 이때 부모 요소와 자식 요소 간에 상속이 발생한다. 2. 상속(inherit)되는 속성과 상속되지 않는 속성 1) 상속(inherit)되는 속성 이름 속성값 초기값(Initial value) 'border-spacing' | inherit 0 'co..

코딩/CSS 2021.12.09
728x90