전체 글 202

자바스크립트 함수

함수 1,2,3 형식 1형식: 매개변수 X return X 2형식: 매개변수 O return X 3형식: 매개변수 O return O for 반복문 // 1. for문 for (let i = 0; i < array.length; i++) { } // 2. for in 문 (iterator 형식) for (const iterable_element in iterable) { } // iterable_element는 배열일 경우 인덱스(숫자), 객체일 경우 key 값 // ex) const myCar = { color:"red", door:4, price:30000 }; for (const tmp in myCar) { document.write(`${tmp} : ${myCar[tmp]} `); } - for ..

자바스크립트 배열

1) 배열 생성 var arr = []; let arr = [1,2,3]; const arr = ["a", "b", "c"]; 2) 정렬 // 1. 문자 정렬 arr.sort(); // 2. 숫자 정렬 arr.sort(function(a, b) { return a - b; }); //오름차순 정렬, compare 함수로 정렬 기준을 줘야됨 // 3. 객체 정렬 obj.sort(function(a,b) { return a.name b.name ? 1 : 0; }); //똑같이 compare 함수로 기준을 줘야됨 3) 값 추가 - arr[0] = 1; //직접 추가 - push(); //배열의 맨끝에 추가 4) 값 삭제 - shift(); //배열의 첫번째 삭제 ..

Javascript

1) Javascript html: 틀, 골격, 사람자체 css: 디자인, 옷 javascript: 움직임, 동작, 댄스, 축구 등 ex) 회원가입시 숫자란에 문자 입력시 js로 처리 가능 프로그래밍에서 동작(동적웹페이지)을 담당 2) js특징: html 태그에 접근 가능, 하지만 접근할 수 있는 html 태그가 한정된 것이 기본 웹페이지는 window > document > form > img > input 순서로 되어있음 html은 w3c에서 관장 js는 ECMA(Europe Computer Manufactor Association)에서 관장 (ECMAScript) 그래서 자바스크립트는 접근할수 있는 태그가 한정되어 있음 에는 접근 가능 는 접근 불가 - 모든 태그에 접근하는 DOM DOMScript..

Semantic

웹에 자주 사용되는 요소 1. table 2. div>ul>li 3. semantic web = 의미있는 웹(사람이나 기계가 쉽게 이해할 수 있는 웹) div>ul>li를 활용해서 웹 페이지를 만드는 방법 여기는 헤드 부분(로고) 여기는 메뉴가 나오는 부분 여기는 내용이 나오는 부분 여기는 맨 아래 주소등이 나오는 부분 - float로 위치 정하기 - width %로 일정 비율로 고정 Semantic tag 구조 ---------------------------------- header ---------------------------------- nav section aside article article ---------------------------------- footer ------------..

[front-end]/CSS 2021.01.11

CSS 속성

font: bold 20pt serif,sans-serif; 굵기, 크기, 글꼴(첫번쨰 글꼴이 없으면 그 다음 글꼴 사용) 순 text-shadow: 3px 3px 5px #777777; 글씨 그림자 효과 1. x쪽으로 이동 2. y쪽으로 이동 3. 번짐(blur, 숫자가 클수록 더 번짐) 4. 그림자 색 box-shadow: 10px 10px 3px #0000FF; 박스 그림자 효과 위와 동일 border: 3px dotted blue; 경계선두께 경계선디자인 경계선색 경계선디자인은 dotted(점선) dashed(조금긴 점선) double(얇은선 두개) groove(굵은선) inset ridge outset(태극기처럼 대각선으로 나뉨) solid(그냥 선) 등이 있음 table과 table안에 있는 ..

[front-end]/CSS 2021.01.08

정보전송,처리 시스템의 H/W와 S/W

1) 정보전송 시스템의 H/W - 컴퓨터, 통신제어장치, 모뎀, DTE, 교환망, 시분할장치, 망 제어장치 등 2) 정보전송 시스템의 S/W - 송수신제어 프로그램 - 처리 프로그램 - 파일과 데이터베이스 관리 프로그램 3) 정보처리 시스템의 H/W - 입력장치(OMR, OCR, MICR, 키보드, 마우스, 스캐너 등) - 중앙 처리 장치(연산 장치, 제어 장치) - 출력장치(모니터, 프린터, 플로터 등) - 기억 장치 중앙 처리 장치(CPU, Central Procession Unit) - 가장 핵심적인 일을 수행하는 부분 - 통신 제어 장치에서 입력된 데이터를 가공,처리,축적,수정,변경,추가 등의 기능 구성 - 연산장치: 프로그램에 따라 계산을 처리하는 산술연산, 비교 및 판단을 처리하는 논리연산 실..

[CS]/[네트워크] 2021.01.06

CSS

1) css 는 rgb로 색을 표현 - rgb: red green blue 빛 - 표현방법: 1. #ffff00 두개씩 나눔 (00~FF) 2. rgba(255,255,0,0.5) ,로 나눔 3. blue 이렇게 바로 해도 됨 rgba의 a(alpha)는 투명도, 0.0~1.0(투명~불투명) 0.0 fully transparent and 1.0 fully opaque 클래스1 클래스2 아이디1 2) border padding margin border는 테두리 크기 padding은 글씨와 테두리와의 간격 margin은 두 테이블 사이의 간격(둘다 겉의 테두리) padding:20px (상우하좌 4개 모두 20px) padding:20px 30px (상 우) (상하 20 좌우 30) padding:20px ..

[front-end]/CSS 2021.01.05

emmet 플러그인

emmet 플러그인: 이클립스에서 유용한 html, xml(pom.xml) 태그 도우미 설치방법: help - eclipse marketplace - find에 emmet 입력 후 install - 설치 도중 경고뜨면 무시하고 첫번째 install anyway 클릭 marketplace 안되면 help - install new software로 들어가서 http://emmet.io/eclipse/updates 주소를 url로 설정 emmet 사용법 - 테그 내용 입력 후 ctrl + e 혹은 tab 1. h1 2. div>ul>li 하위 코드 생성 방법 form>table>tr>td 3. div>ul*2>li*3 4. input:text 5. input:submit[value="서버로 이동"] 6. di..

[front-end]/HTML 2021.01.05

HTML 테그

HTML은 형식이 비교적 자유로움, 하지만 xml은 형식이 엄격함, 여는 태그가 있으면 반드시 닫아줘야됨, 그래서 환경설정 파일 작성하는데 많이 사용됨 1. 줄바꿈 : 한줄 바꿈 : 두줄 바꿈 2. 기호 띄어 쓰기 &기호: & >: > 비밀번호 전화번호 생년월일(2000년 이상만) 생일은 몇번째 주? 태어난시간? 현재시간? 좋아하는색? 좋아하는 숫자?(0~100, 10단위) 성격? 내성적 검색: 도시 선택

[front-end]/HTML 2021.01.05

HTML

1) html(Hyper Text Markup Language): 웹페이지를 작성하기 위한 언어로 팀 버너스리가 개발 - markup: 태그를 사용한다 2) html 역사: - html버전: 1991년 html 시작으로 html 4.0, 4.01, 2000년 xhtml 1.0, 1.1, 2.0(사장됨) - 2012년 html 4.0에서 확장된 html5 대두, 최종버전 완성됨 - html5: audio, video, 지도, websocket 엄청 편해짐 - 비디오와 오디오 심플하게 지원, css3지원, 위치정보(geolocation), local depository 지원(jQuery mobile 작성시 이것 사용) - 웹은 html + css + javascripte + dom을 중심으로 함(MVC 모델..

[front-end]/HTML 2021.01.05