1. 웹 개발의 기초
- 내일배움캠프의 첫 시작 "웹 개발 기초" 강의를 통해서 웹, 프론트엔드, 백엔드, HTML, CSS, JavaScript 등에 대해서 학습해보았다.
- 웹 페이지의 구성과 어떻게 만들어지는지 그리고 백엔드와 프론트엔드간의 대화에 대한 기초를 학습해보았다.
- 백엔드 개발자가 되기위한 첫 걸음으로 기초가 되는 영역을 알아보았다.
2. 웹 개발의 첫걸음
2-1. 프론트엔드와 백엔드
- 프론트엔드 : 사용자가 직접 보고, 조작하는 모든 영역 (식당의 예시로 "홀" 영역)
- 백엔드 : 사용자 눈에는 보이지 않지만, 핵심 로직과 데이터가 처리되는 영역 (식당의 예시로 "주방" 영역)
- 웹(식당)이 커지면서 홀(프론트엔드)와 주방(백엔드)는 각자 업무가 분할되었으나 서로의 일을 알고 일한다면 효율적으로 일 할수 있다.
- 백엔드 개발자로서 일하기 위해서는 프론트엔드에 대한 기초적인 지식이 있으면 협업이 더욱 수월해진다.
2-2. 웹(Web)
- 웹(Web, WWW - World Wide Web) : 인터넷을 통해 전 세계 컴퓨터들이 데이터를 공유 할 수 있는 공간
- 인터넷(Internet) : 전 세계 컴퓨터들을 연결하는 물리적인 네트워크
- 클라이언트(Client) : 서버에 요청을 하는 모든 프로그램
- 웹 서비스는 클라이언트와 서버간의 HTTP통신을 통해 콘텐츠를 요청하고 응답 받으며 작동한다.
- 클라이언트는 DNS조회 하여 서버에 접속하고 메인 페이지, 추가 리소스 등을 수신하여 렌더링해서 사용자에게 데이터를 보여준다.
2-3. HTML(HyperText Markup Language)
- HTML : 웹 페이지의 구조를 정의하는 언어, 클라이언트가 해석하는 콘텐츠 이자 웹 페이지의 '뼈대'라고 할 수 있다.
- <head>(머리) : 사용자 눈에 보이지 않는 설정 정보들, 브라우저 탭에 표시될 제목이나 CSS, Javascipt를 불러오는 태그들이 있다.
- <body>(몸통) : 사용자 눈에 보이는 모든 콘텐츠, HTML의 핵심 구성요소, 태그(Tag), 속성(Attribute), 요소(Element)로 구성되어 있다.
- <form> : 사용자가 입력한 여러 데이터를 묶음으로 감싸는 태그
- <input> : 사용자로부터 데이터를 입력받는 태그
- <select> / <option> : 규격화된 데이터를 입력 받을때 쓰는 태그
- <textarea> : 여러 줄의 텍스트를 입력 받을때 쓰는 태그
- <button> : 클릭 가능한 버튼
- Json : 데이터를 저장하고 전송하기 위해 사용되는 텍스트 기반 형식 키(key)-값(value) 쌍으로 데이터를 표현한다.
2-4. CSS(Cascading Style Sheets)
- CSS : 웹 페이지의 디자인과 배치를 담당하는 것 외부에서 연결하거나 내부에서 사용한다. 누구(Selector)를 어떻게(Declaration) 꾸밀지 정하는 규칙의 집합
- 박스 모델 : 모든 HTML요소는 박스로 이루어져 있으며 Content, Padding, Border, Margin 4가지 영역으로 구성되어 있다. 이를 통해 내용을 중심으로 상하좌우 여백을 주거나 테두리 굵기, 색상 등을 지정할 수 있다.
2-5. JavaScript
- JavaScript : 클라이언트만 실행되는 프로그래밍 언어 사용자의 활동과 입력 값에 따라 동적으로 동작하는 기능을 담당한다.
- 변수(Variables) : 코드를 작성할 때 필요한 데이터나 HTML요소 등을 저장하기 위한 '이름표가 붙은 상자' 값을 바꿀 수 없는 상수(const)와 바꿀 수 있는 변수(let)이 있다.
- 함수(Functions) : 여러 개의 명령어를 하나로 묶어 '이름표'를 붙인 여러번 재사용 가능한 기능 꾸러미, 함수를 실행시켜 구현된 기능을 실행 시킨다.
- 이벤트 리스너 (Event Listeners) : 사용자의 행동을 감지하고, 특정 이벤트가 발행했을 때 지정된 함수를 실행하도록 연결해준다.
3. 오늘의 느낀점
웹 개발의 기초에 대해서 강의를 듣고 학습해보았다. 전혀 모르던 분야를 새롭게 공부하는 단계여서 그런지 아직 용어가 낯설고 내가 잘하고 있는지 공부하는 방법이 맞는지 아직은 잘 모르겠다.
우선은 오늘 학습한 내용을 다시한번 복습하면서 개발이라는 분야와 친해져야 할 필요가 있다고 느꼈다.
개발공부 처음해보는 사람