본문 바로가기

분류 전체보기

(13)
[HTML] Input 태그의 required 속성 🌈 정의 및 특징 - 태그의 required 속성은 폼 데이터가 서버로 제출되기 전 반드시 채워져야 하는 입력 필드를 명시 - required 속성은 불리언(boolean) 속성이다. - 속성을 명시하지 않으면 속성값이 자동으로 false 값을 가지게 되며, 명시하면 자동으로 true값을 가지게 된다. 🌈 input 태그 requred 속성 적용방법 🌈 적용 결과 아이디: - 다음과 같이 input 태그안에 required를 추가해주면 input을 입력하지 않고 제출을 누를 시 경고창이 뜨게 된다!
[JavaScript] 자바스크립트 연산, 반복문 🌈 String concatenation //String concatenation console.log('my' + 'cat'); // my cat console.log('1' + 2); // 12 console.log(`string literals: 1 + 2 = ${ 1 + 2 }`); // string literals: 1 + 2 = 3 (백틱기호를 사용 ``) // string literals의 좋은점은 줄바꿈을 하거나 특수기호를 이용해도 그대로 출력된다 console.log(`string literals: 1 + 2 = '''' ${ 1 + 2 }`); // string literals: 1 + 2 = (줄바꿈) '''' (줄바꿈) 3 console.log('bom\'s house'); //중간..
[JavaScript] let , var , const / 데이터 타입 🌈 let ES6에 추가된 언어이다. 변수를 선언하지 않고 값을 할당할 시에는 에러가 난다. let은 블록 범위로 변수를 선언할 수 있다. Block scope : 괄호를 이용해서 코드를 블럭안에 작성하게 되면, 블럭 밖에서는 블럭안에 있는 내용들을 볼수 없다. ⇨ 콘솔로그를 이용해서 블럭 밖에서 접근하게 되면 아무값도 나오지 않는다. 반대로 블럭을 쓰지 않고 파일 안에다가 바로 정해서 쓰는 변수들 ⇨ global scope 라고 부른다. ✔ 이 글로벌한 아이들은 어느곳에서나 접근이 가능하다. ✔ 글로벌한 변수들은 어플리케이션이 실행되는 순간부터 끝날때까지 항상 메모리에 탑재되어 있기 때문에 최소한으로 쓰는 것이 좋다. ✔ 가능하면 class , if , function 등 필요한 부분에만 이렇게 정리해..
[JavaScript] 콘솔 출력 / use strict 🌈 자바스크립트 이용해서 Hello 출력하기! console.log('hello'); 🌈 [엄격모드] use strict 자바스크립트는 유연한 언어이므로, 굉장히 위험하다. 그렇기 때문에 개발자가 실수하기 쉬운 잘못된 문법들을 미리 알려준다고 생각하면 된다. strict mode는 ECMAScript5부터 적용되었다. strict 모드로 설정하는 방법은 코드 앞쪽에 'use strict'를 추가하는 것이다. 'use strict'; a = 6; 위의 코드를 실행하게 되면 콘솔창에 아래와 같은 오류가 찍히게 된다. 에러를 없애기 위해서는 아래 코드를 수행한다. 'use strict'; let = a; a = 6;
[JavaScript] script async와 defer의 차이점 🌈 로드 순서 : HTML 파싱 ⇨ 로드 순서 : 태그 끝까지 HTML 파싱 ⇨ 발견 ⇨ JS 다운 ⇨ JS 실행 장점: HTML 컨텐츠를 빠르게 본다. 단점: 의미있는 컨텐츠가 JS파일에 의존적이면 사용자가 기다려야 한다. 🌈 로드 순서 : HTML 파싱 ⇨ 발견 ⇨ 병렬로 JS 다운 명령 ⇨ 다시 HTML 파싱 ⇨ JS 다운 완료 ⇨ HTML 파싱 중단 ⇨ JS 실행 ⇨ 남은 HTML 파싱 장점: 다운이 병렬적으로 일어나기 때문에 다운받는 시간을 절약할 수 있다. 단점: JS가 HTML이 파싱이 되기도 전에 실행이 되기 때문에 JS와 관련된 HTML의 요소가 파싱되지 않아 정의되지 않았을 경우 페이지 로드의 위험이 있다. 여전히 사용자가 페이지를 보는데 시간이 오래 걸린다. 🌈 [가장 좋은 방법] 로..
[CSS] 레이아웃 🌈 CSS 기초이론 ✔ padding은 안쪽 여백 / border는 테두리 / margin은 바깥 쪽 여백이다. padding ✔ padding: (top, bottom),(right, left) 순으로 적는다. ✔ padding: 20px 0px; 이렇게 하면 (위 아래) 20px (양옆)은 0px 이렇게 된다. border ✔ border-width, border-style 이렇게 타이핑 하기 보다는 ✔ border: 2px solid red; ✔ 반응형 웹사이트를 만들때는 px보다는 flex grid, flex box, %, vw, vh를 쓰는 것이 좋다 🌈 100% vs 100vh %의 뜻은 그 class에 들어있는 부모의 높이의 100%를 채우겠다는 말이다. 반면, 100vh는 body나 부모와..
[정보처리기사] 실기 약술형 정리 ③ 애자일 개발 방법론 사람중심의 변화에 유연하게 대응 가능한 소프트웨어 개발법이다. 유스 케이스 다이어그램 시스템이 제공하고 있는 기능과 외부 요소를 유스 케이스, 액터, 시스템 등을 활용해 사용자의 관점에서 표현한 다이어그램이다. RIP(Routing Information Protocol) 거리 벡터 알고리즘에 기반한 15홉 제한의 특징이 있는 내부 라우팅 프로토콜이다. 랜섬웨어 파일을 암호화하여 피해자에게 복호화를 위한 돈을 요구하는 악성코드이다. SQL 힌트 SQL 문에 액세스 경로 및 조인 순서 등의 정보를 사전에 주어서 SQL 문 실행에 빠른 결과를 가져오는 효과를 만드는 기법이다. 방화벽(Firewall) 미리 정의된 보안규칙을 기반으로 외부의 불법침입과 내부에 불법정보유출을 막기 의한 보안 시..
[정보처리기사] 실기 약술형 정리 ② 옵티마이저 사용자가 질의한 SQL문을 처리할 수 있는 실행계획을 탐색하고 각 실행계획에 대한 비용을 추정하여 최적의 실행계획을 수립하는 DBMS의 핵심 엔진이다. 보안 운영체제 커널에 보안 기능 및 참조 모니터를 추가하여 운영체제의 보안상 결함으로 인하여 발생 가능한 각종 해킹으로부터 시스템을 보호하기 위한 운영체제이다. SDN(Software Defined Network) 오픈 API 기반으로 네트워크 장비의 트랙픽 경로를 지정하는 컨트롤 플레인과 트래픽 전송을 수행하는 데이터 플레인을 분리하여 네트워크 트래픽을 중앙 집중적으로 관리하는 소프트웨어 기반의 네트워크 기술이다. NFV(Network Function Virtualization) 범용 하드웨어(서버/스토리지/스위치)에 가상화 기술을 적용하여 ..