[Frontend] HTML, CSS, JavaScript (수업 내용)

✴︎ Dynamic & Static

: 서로 반대되는 개념

Dynamic → 프로그램 실행 이후에 결정

Static → 프로그램을 실행하기 전에 모든게 결정

 

✴︎ Java Resources : Backend → Controller

✴︎ Src : Frontend → View

 

✴︎ HTML 태그

<h>

: 1부터 6까지 존재

<span>

: 대표적 인라인 태그

<br>

: 줄 바꿈

<hr>

: 수평선을 하나 그은 후 줄바꿈

태그는 붙여서 쓸수는 없으나 포함하여 쓸수는 있음

<a href="">

: 링크 연결

: href"" → 속성 / a태그의 하이퍼레퍼런스 속성

: target="_blank" → 새 탭에서 창열기

 

✴︎ 필수 속성

<img> 를 사용시 자동으로 alt= 와 src= 가 생성되는데, 자동으로 생성되는 경우 필수 속성

: alt= 의 경우 없어도 실행은 되지만, 소수자 배제로 인해 무조건 넣어줘야함

: 보조 기구를 사용하여 이용하는 경우, alt=문의 내용을 통해 정보를 획득하기 때문

 

✴︎ HTML을 공부할 때 가장 중요한 점

: 보조 기구를 활용해서 화면을 받아들이는 사람 배제를 하면 안됨 → 모두가 사용하기 쉬운 화면을 만드는게 중요!

: 시맨틱 태그 → 의미가 맞는 태그로 화면을 구성

 

✴︎ 속성

: 클래스 속성 → [ . ] 으로 표현하며, 여러개를 사용할 때 사용

: 아이디 속성 → [#]으로 표현하며, 유일한 것에 사용

 

✴︎ HTML과 CSS

HTML : 화면을 구성하는 언어

CSS : 화면 스타일

 

✴︎ 기능

Prompt : 팝업창 같이 뜨고 확인을 누르면 true, 취소를 누르면 false 반환

Alert : 알림창, 출력밖에 안되며, 데이터는 받기 어려움

Confirm : 확인창, 사용자로부터 true, false를 결정 받음

 

✴︎ 제어문

IF, FOR, SWITCH문 등 전부 있지만, 요즘은 SWITCH문은 사용 안함!

 

✴︎ HTML, CSS, JS

HTML : 구조

→ 시맨틱 태그

→ 의미가 있는 태그 구성이 중요

CSS : 스타일

→ 웹 템플릿 잘 "분석"

JS : 동작을 구현

→ 동적 타이핑 언어

→ 스크립트어

→ 이벤트