스파르타 코딩 클럽-내일 배움 캠프 클라우드
1일차
웹 프로그래밍 A-Z 기초
-
웹 동작 개념
웹페이지는 모두 서버에서 미리 준비해두었던 것을 "받아서" "그려주는" 것이다.
즉, 브라우저가 하는 일은 요청을 보내고,받은 HTML 파일을 그려주는 일을 한다. -
html, css, javascript
1) html : 뼈대
a. 태그들<div></div>: 구역 나눔 <p></p> : 문단 나눔 <ul> <li>list item1</li> <li>list item2</li> </ul> : 리스트 <h1></h1>: 제목 태그 <h2></h2>: 소제목 <hr>: 선 <span style="color:red"></span>: 특정 글자를 꾸밈 <a href="http://naver.com/"></a>: 하이퍼링크 <img src="이미지 링크" />: 이미지 태그 <input type="text" />: input box 태그 <button></button> <textarea></textarea>: 큰 input box 태그2) css: 이쁘게 꾸미기
a. 사용<head> ~ </head> 안에 <style> ~ </style> 로 공간을 만들어 작성 mytitle라는 클래스를 가리킬 때, .mytitle { ... } 라고 써줘야함 style 태그를 개별 파일로 분리가능3) javascript : 브라우저가 알아들을 수 있는 언어, 웹 페이지를 동적으로 만듦
a. 문법//선언 let customer = [ {'name': '홍길동' 'phone': 010-1234-1234}, {'name': '손오공' 'phone': 010-1111-2222} ] //함수 function 함수이름(필요한 변수들) { 내릴 명령들을 순차적으로 작성 } 함수이름(필요한 변수들); //조건 function is_adult(age, sex){ if (age > 65 || age < 10) { alert('탑승하실 수 없습니다') } else if(age > 20 && sex == '여'){ alert('성인 여성') } else if (age > 20 && sex == '남') { alert('성인 남성') } else { alert('청소년이에요') } } //반복 let people = ['철수','영희','민수','형준','기남','동희'] for (let i = 0 ; i < people.length ; i++) { console.log(people[i]) } //+특정 문자로 나누기 let email = 'sparta@gmail.com' myemail.split('@')[1].split('.')[0] //gmail
Hello World!!