2일차: Development 기초

컴퓨터란, 입력받은 데이터를 정해진 규칙대로 처리해서 처리 결과를 저장하고 출력하는 전자장치이다.
- 소프트웨어: 하드웨어가 어떻게 동작할지 규정해놓은 명령어의 집합
⤑ 시스템 소프트웨어: 응용 소프트웨어를 실행하기 위한 플랫폼 역할. 하드웨어와 직접적으로 소통
⤑ 응용 소프트웨어: 시스템 소프트웨어를 제외한 모든 소프트웨어
- 하드웨어: 컴퓨터를 구성하는 기계적 장치의 집합
⤑ 중앙처리장치(CPU): 프로그램 실행과 처리를 담당하는 핵심 장치(제어장치, 연산장치, 레지스터로 구성)
⤑ 기억장치: CPU 동작에 필요한 데이터를 단기/장기적으로 보관
⤑ 그 외: 입력장치, 출력장치, 시스템버스
프로그래밍이란, 프로그램을 만드는 과정으로 특정 목적을 위해 설계된 알고리즘을 프로그래밍 언어를 사용해 코드로 작성하는것을 말한다.
- 프로그램 언어: 컴퓨터(기계어)와 사람을 연결해주는 언어
- 컴파일: 프로그래밍 언어로 작성된 소스코드를 컴퓨터가 이해할 수 있는 기계어로 번역하는 과정
- 빌드: 작성한 소스코드를 실행할 수 있는 산출물(실행파일)로 만드는 과정
- 통합 개발 환경(Integrated Development Environment: IDE): 코드를 작성할 때 사용하는 프로그램

HyperText Markup Language의 약자로, 웹페이지를 구성하는 마크업 언어*
* 태그를 사용하여 문서나 데이터의 구조를 표기하는 언어의 한 종류
<>, </>를 사용해 태그로 되어있는 HTML 요소를 구분한다. (일부 self-closing Tag는 </> 없이 작동함)
자주 사용하는 HTML 요소
<div></div> 한 줄을 차지하는 자료 (문단이 바뀜)
<span></span> 내용 크기만큼 공간을 차지하는 자료 (문단이 바뀌지 않음)
<img src=""> 셀프클로징 태그로 ""안의 링크에 맞는 이미지가 입력됨
<a href="" target="_blank"></a> 하이퍼링크 연결. ""안의 링크로 연결되며 target="_blank"를 넣을경우 새창으로 띄워짐
<ul><li></li></ul>, <ol><li></li></ol> 리스트를 작성할때 사용. ul은 넘버링이 없을때, ol은 넘버링이 있을때 사용
<input> 입력 폼. type을 설정하여 입력 형태를 정할 수 있음 (예시: text, radio, checkbox 등)
<textarea> 줄바꿈이 가능한 텍스트 입력 태그

Cascading Style Sheets 의 약자로 HTML로 작성된 웹 구조에 디자인을 적용하는데 사용함
긍정적인 사용자 경험(UX: User Experience)를 제공하기 위해 적절한 사용자 인터페이스(UI: User Interface)를 제공해야함
CSS를 적용하는 방법은 같은 줄에서 스타일을 적용하는 [인라인 스타일], Style 태그 내에서 작성하는 [내부 스타일 시트], 별도의 CSS파일을 만들어 적용하는 [외부 스타일 시트]가 있음
특정 요소에 셀렉터(Selector)를 붙여서 스타일링 할 경우 id나 class를 활용하여 디자인을 적용할 수 있음
- id: 하나의 문서에서 한 요소에만 사용가능 #(id이름) {(스타일내용)} 형태로 스타일 지정
- class: 여러 요소에 동일하게 적용가능 .(class이름) {(스타일내용)} 형태로 스타일 지정
CSS box: 밖에서부터 margin(외부여백) - border(테두리) - padding(내부여백) - content(내용)로 구성

오늘은 웹개발에 대한 전반적인 내용과 프론트엔드 관련 내용을 학습했다.

다른 강의를 통해 한번 접해봤던 내용이라 비교적 쉽게 이해할 수 있었다.

하지만 관련 내용도 깊게 들어가면 배워야할것들이 정말 무궁무진할것같다..

웹개발은 프론트엔드와 백엔드이 함께해야하는 일인 만큼 나중에는 두 분야를 모두 이해할 수 있으면 좋을것같다!

(물론 지금 단계에서는 백엔드 관련 내용부터 집중해서 화이팅..!!)

1일차: OT, 부트캠프 및 코드스테이츠 선택 이유 (0)	2023.02.14

관련글