1. Class component : 더 많은 기능 사용 가능하나, 코드가 길어지고 복잡해지며 조금 느려진다. - 1) functional component에서 사용 할 수 없던 것들 - 2) 하지만 react 16.8 이후에는 대부분이 functional component를 통해서 Hook을 이용해서 사용 가능해짐. 2. Functional component : 제공하는 기능은 적으나, 코드가 짧아지고, 빨라진다.

1. 선택자란? - 특정 항목(HTML)을 선택하여, 해당 항목의 속성을 변경. 1) tag 선택자 : 특정 태그(HTML)를 선택하여, 해당 태그의 속성을 변경. 선택자(특정 태그 명) + { 설정 } 제목입니다 본문입니다 제목입니다 본문입니다 또 하나의 DIV 입니다 2) 다중 태그 선택 : 여러 태그를 선택하여, 해당 태그의 속성을 변경 선택자,선택자,선택자 + { 설정 } cf) 특정 태그에 다중 설정시 가장 마지막으로 설정된 값으로 홈페이지 반영됨. MY HOMEPAGE HTML5 CSS3 JAVASCRIPT JQUERY What is HTML5? HTML5 is goooooooooooooooooooooooooooooooooooooooooooooooooooooooood! xxx주식회사 서울시 0..

1. 홈페이지의 전체적인 레이아웃을 잡는 태그 1) div(division) 태그 : 웹사이트의 전테적인 틀(레이아웃)을 만들 때 주로 사용. - 웹표준 테그(테이블 태그에서 표준화로 변화) - 웹페이지에서 논리적 구분을 정의하는 태그. - 블럭형식 태그(개행하지 않아도, div 태그가 끝나면 개행) cf) 라인형식 태그(개행하지 않으면 개항이 되지 않음) block_01 block_02 block_03 block_04 block_05 (1) div 태그의 속성 ① style : div 태그의 여타 속성을 지정 해주기 위한 속성 ② width, hight : 높이와 너비 설정 ③ border : 테두리 굵기 설정 ④ background-color : 배경색 설정 ⑤ float : 정렬기준 설정 ⑥ mar..

1. 폼을 통해 정보를 입력받는 태그 웹사이트에서 회원가입 등 여러 정보를 입력받아 웹 서버로 전달할 때 사용하는 폼을 만들어주는 태그 1) form 태그 - 폼 안에 있는 모든 데이터를 백엔드 서버에 전달한다. - 전체 양식 설정(화면에 보이지 않지만 양식을 지정해줌) 1-1) form 태그 필수속성 (1) action 속성 ① form data를 서버로 보낼 때 해당 데이터가 도착 할 URL을 명시 (2) method 속성 ① get : 디폴트 값. 도메인에 입력값이 문서헤더에 그대로 보임 - 보안에 취약 ② post : 파일 헤더에 정보값이 암호화되어 저장되어, 도메인에는 변화가 없음 - 보안이 필요한 부분에 사용. 로그인 값 등에 사용 2) input 태그 - 실질적으로 데이터를 입력받을 양식을 ..

1. 동영상을 출력하는 태그 1) video 태그 - 종료태그 있음 2) video 태그 필수 속성 (1) src(source) 속성 : 비디오 소스(경로/URL) 제공 (2) type 속성 : video/확장자명 cf: 필수 속성과 기타 속성은 아래처럼 별도로 작성 할 수 있음 3) video 태그 기타 속성 (1) controls 속성 : 컨트롤러 제공(소리조절, 동영상 탐색, 일시정지, 재시작) (2) autoplay 속성 : 자동 재생

1. 이미지를 나타내는 태그 웹사이트에서 이미지를 출력해주는 태그 1) img(image) 태그 : 이미지 출력을 위한 태그 - 별도의 종료 태그 없음 2) src(source) : 이미지 파일의 경로 표시 / img 태그 필수속성 - 사이트 파일 내에 위치한 이미지 파일의 경로 - 원격지에 위치한 파일 3) img 태그 기타 속성 (1) alt(alternate) 속성 : 이미지 파일이 없을 시 교체(대신)하여 출력할 문구 (2) width 속성 : 너비(가로 길이) (3) highth 속성 : 높이(세로 길이) (4) border 속성 : 경계선 설정(사각형 모양) 및 굵기 (5) alt 속성 : 그림 설명(그림 위에 포인터 위치시 풍선 도움말) (6) (2)~(5) + align, hspace, v..

1. 소리를 출력하는 태그 - 과거 : html에서 지원하지 않음. 외부 플러그인 스크립트를 html문서에 삽입하여 소리 출력 - 현재 : html5부터 오디오 태그 지원. 1) audio 태그 - 종료 태그 있음 2) audio 태그 필수 속성 (1) src(source) 태그 : audio파일 위치 경로/URL 3) audio 태그 기타 속성 (1) controls : 컨트롤러 표시 유무 설정 - 설정 값 = 속성명 동일 (2) autoplay : 자동 실행 설정 - 설정 값 = 속성명 동일 (3) loop : 무한 반복 설정 - 설정 값 = 속성명 동일

1.table : 표 형식의 레이아웃을 만드는 태그 과거 여러 사이트의 레이아웃을 만드는 데에 많이 사용되었으나, 유지보수의 어려움(정보 변경 시 번거로움)으로 현재에는 잘 사용하지 않음. 회원가입과 로그인 테이블을 만드는 데에 주로 쓰임. 1) tr : 행을 나타내는 태그 2) td :각 행에 이어진 열을 나타내는 태그 (tr 안의 td 태그 / 행 안의 열 태그) 1행 1열 1행 2열 1행 3열 1행 4열 2행 1열 2행 2열 2행 3열 2행 4열 3행 1열 3행 2열 3행 3열 3행 4열 4행 1열 4행 2열 4행 3열 4행 4열 3) 표 태그의 속성 (1) colspan(colum열 span확장) : 열 병합 1행 1열 2행 1열 2행 2열 2행 3열 2행 4열 3행 1열 3행 2열 3행 3열 3..

1. 리스트 태그란? 여러 정보의 목록을 만드는 태그 1) ul : 순서가 없는 리스트(unordered list) 순서가 없는 리스트 menu1 menu2 menu3 menu4 menu5 2) ol : 순서가 있는 리스트(ordered list) 순서가 있는 리스트 서울 경기 충청 전라 경상 강원 - start : 의 시작 값 설정 순서가 있는 리스트 5 서울 경기 충청 전라 경상 강원 - type : 의 인덱스 값 설정. 1 / a / A / i / I (기본값 = 1) 순서가 있는 리스트 i menu1 menu2 menu3 menu4 menu5 순서가 있는 리스트 a 가지 나비 다리 라면 마늘 3) dl, dt, dd : 정의 목록 태그 - (definition list) : 정의 목록 - (def..

0-1) DOCTYPE 태그 : 문서 타입 지정 0-2) html 시작 태그 : html로 문서가 작성될 것 1. 헤드(head)란? 문서의 정보, 타이틀, 설정값, 스타일시트(CSS)의 내용 혹은 JAVA Script의 내용 등 환경 설정에 관한 정보 수록. 1) 보이는 모습 2. 바디(Body)태그란? 페이지를 통해 전달하고자 하는 모든 정보가 담기는 곳. - 그림, 정보 외. 화면에 보이는 모든 정보. 3. 기본 태그 1) br 태그( ) : 개행. 닫는 태그가 없이 열림 태그와 닫힘 태그가 일체형으로 되어있다. 안녕하세요. 야나 입니다. Helloworld!! 2) h1,2,3,4,5,6 태그(h#태그) : 문서 제목 태그. h1 태그 입니다. h2 태그 입니다. h3 태그 입니다. h4 태그 입..

1. 태그란? - HTML을 구성하고있는 요소. - : 열린 태그 (시작) - : 닫힌 태그 (종료)

(참조 : https://www.inflearn.com/course/html-css-%EA%B0%95%EC%A2%8C/lecture/514) 실전 HTML & CSS 강좌 - 인프런 | 학습 페이지 지식을 나누면 반드시 나에게 돌아옵니다. 인프런을 통해 나의 지식에 가치를 부여하세요.... www.inflearn.com 1. WEB 이란? web이란, 사전적 의미로 거미줄이란 뜻으로 IT에서 WWW(World Wide Web)라는 말의 줄임말로 사용된다. 그 주목적은, 전 세계의 컴퓨터들을 네트워크로 연결하여 정보공유를 하는데 있다. 그리고 컴퓨터들이 연결되어있는 상태를 네트워크에 연결되어 있다고 표현한다. 네트워크, 즉 인터넷으로 컴퓨터들을 네트워크에 연결하는 여러 서비스들 중 하나가 웹(Web, WW..