웹프로그래밍이란?
- 웹사이트를 만들기 위한 프로그래밍입니다.
- 사용자가 보는 화면(프론트엔드)을 구현합니다.
- HTML, CSS, JavaScript를 기본 도구로 사용합니다.
기본 기술 3가지
① HTML (HyperText Markup Language)
- 웹페이지의 구조를 담당합니다.
- 무엇을 보여줄지 정의합니다. (예: 제목, 문단, 이미지)
- 예시: <h1>제목입니다</h1>
② CSS (Cascading Style Sheets)
- 디자인을 담당합니다.
- 색상, 크기, 배치 등을 조정합니다.
- 예시: h1 { color: blue; }
③ JavaScript
- 동작을 담당합니다.
- 버튼 클릭, 페이지 반응 등 인터랙션을 구현합니다.
- 예시: alert('안녕하세요');
간단한 예제
<!DOCTYPE html>
<html lang="ko">
<head>
<meta charset="UTF-8">
<title>내 첫 페이지</title>
<style>
body { font-family: sans-serif; background: #f8f8f8; }
</style>
</head>
<body>
<h1>안녕하세요</h1>
<p>웹프로그래밍을 시작합니다.</p>
<button onclick="alert('환영합니다')">클릭</button>
</body>
</html>
위 코드는 HTML, CSS, JavaScript를 모두 포함한 기본 예제입니다.
기초 학습 순서
- HTML 기본 태그 이해: 제목, 문단, 이미지, 링크
- CSS 스타일 적용: 색상, 크기, 정렬, 배치
- JavaScript 기초: 변수, 함수, 조건문, 이벤트 처리
- 간단한 실습 예제 작성
정리
- 웹프로그래밍은 구조, 스타일, 동작으로 구성됩니다.
- 기초 기술 세 가지를 익히는 것이 시작입니다.
- 다음 글부터 하나씩 실습을 통해 다뤄보겠습니다.
'웹프로그래밍 - 기초' 카테고리의 다른 글
| 4편 | HTML 텍스트 꾸미기 태그 배우기 (0) | 2025.09.13 |
|---|---|
| 3편 | HTML 기본 태그 배우기: 제목, 문단, 줄바꿈 태그 (3) | 2025.07.31 |
| 2편 | HTML 문서 구조 이해하기: 웹페이지의 기본 틀 만들기 (2) | 2025.07.31 |