8월 9일 TIL

🔥목차🔥

1. HTML 문서 독서
2. 프로그래밍 구조에 대한 독서 후 정리

📖오늘의 TIL 시작!📖

1. HTML 요소

• !DOCTYPE html> 선언은 이 문서가 HTML 문서임을 나타냄
• html>요소는 HTML 페이지의 루트 요소임
• head> 요소에는 HTML 페이지에 대한 메타 정보가 포함됨
• title>HTML 페이지의 제목을 지정합니다(브라우저의 제목 표시줄 또는 페이지의 탭에 표시됨)
• body> 본문을 정의하며 표제, 단락, 이미지, 하이퍼링크, 표, 목록 등과 같이 보이는 모든 내용을 담는 컨테이너임
• h1>요소는 큰 제목을 의미함
• p>요소는 단락을 의미

2. HTML의 구조

3. Docktype

• !DOCTYPE>선언은 문서 유형을 나타내며 브라우저가 웹 페이지를 올바르게 표시하는 데 도움이 됨
• 페이지 상단(HTML 태그 앞)에 한 번만 나타나야함
• 선언은 <!DOCTYPE>대소문자를 구분하지 않음

4. HTML 문서의 제목

• HTML 제목은 h1> ~ h6>태그로 나타냄
• 숫자가 늘어날수록 덜 중요한 제목

5. HTML 문서의 한문단

• HTML 문서의 한 문단은 p>태그로 정의됩니다.

6. HTML 하이퍼 링크

• HTML 링크는 a> 태그로 사용가능
  • a hafe="링크주소"> 이렇게 사용하면됨

7. HTML 이미지

• 이미지 태그는 img>임
  • 소스 파일( src), 대체 텍스트( alt), width및 height로 크기 조정 가능
  • 대체 텍스트는 이미지가 노출되지 않을때 나오는 텍스트를 말함

8. HTML 요소에 관해서

• HTML 요소는 중첩될 수 있음
  • 요소에 다른 요소가 포함될 수 있음
• 빈 HTML 요소
  • 내용이 없는 HTML 요소를 빈 요소라고 함
  • 태그 는 br>줄 바꿈을 정의하며 닫는 태그가 없는 빈 요소임
• HTML은 대소문자를 구분하지 않음
  • HTML 표준은 소문자 태그를 요구하지 않지만 W3C 는 HTML에서 소문자를 권장 하고있음
    • XHTML과 같은 더 엄격한 문서 유형에 대해 소문자를 요구 한다고함

9. HTML 속성에 관해서

• 모든 HTML 요소는 속성을 가질 수 있음
• 속성은 요소에 대한 추가정보를 제공함
• 속성은 항상 시작 태그에 지정함
• 속성은 일반적으로 name="value" 와 같은 이름/값 쌍으로 제공됨

10. 속성의 몇가지 종류

• href 속성
  • a>태그는 하이퍼링크를 나타내는 태그임
  • href속성은 링크가 이동하는 페이지의 URL을 지정함
• src 속성
  • img>태그는 HTML 페이지에 이미지를 삽입하는 데 사용됨
    • src속성은 표시할 이미지의 경로를 지정합니다 .
• 넓이와 높이 속성
  • img>태그에는 이미지의 넓이와 높이(픽셀 단위)를 지정하는 및 속성도 포함 되어야함
  • width , height가 있음 ( padding이나 border도 있긴하지만 이건 css니까..)
• 스타일 속성
  • style속성은 색상, 글꼴, 크기 등과 같은 요소에 스타일을 추가하는 데 사용됨
• 언어 속성
  • 웹 페이지의 언어를 선언하려면 항상 태그 lang내부에 속성을 포함해야함
  • 개발시 해당 lang을 kr로 바꾸면 크롬에 한글 번역할껀지 여부가 표시되지않음

📖 더많은 내용이 있지만 우선 오늘은 여기까지 📖

2. 프로그래밍 구조에 대한 독서 후 정리

• 우선 읽고있는 책의 이름은 그림으로 배우는 프로그래밍 구조라는 책임
• 이 책은 특정 언어나 프로그래밍을 어떻게 하는지에 관한것보다는 말 그대로 구조와 CS지식도 어느정도 들어있는듯 하다
• 근무형태나 직종의 차이 개발의 공정과 흐름 그리고 팀으로 개발하는 방법등 " 프로그래밍 "을 하면서 겪는 일들이나 필요한것들에 대한 정보가 들어있다고 생각하면 편할꺼같다

2-1. 프로그래밍의 기초

• 컴퓨터를 구성하는 요소로는 하드웨어,소프트웨어,애플리케이션이 필요하다고 한다
• 하드웨어
  • 5대장치로 구성됨
    • 입력장치,제어장치,연산장치,기억장치,출력장치
• 애플리케이션
  • Window나 Android,iOS등의 OS에 더해서 웹브라우저, 음악재생, 카메라기능, 계산기나 메모, 문서작성이나 표등의 애플리케이션도 필요하다고함
• 소프트웨어
  • 컴퓨터에게 동작 방법을 지시하는 명령어 집합의 모임이다
  • 자세한건 조금더 스터디가 필요함
• 하드웨어는 완성후에 문제가 발견되었을 경우에 변경이 곤란
  • 하지만 소프트웨어상의 오류라면 수정한 프로그램을 재배포해서 변경할수 있는경우가 있음

2-2. 프로그래밍이 동작하는 환경

• PC가 있어야 사용할수 있는 앱
  • 데스크톱 앱이라고 불림
  • 네트워크에 접속되어 있지 않아도 사용할 수 있다는 특징이 있음
• 인터넷에 접속하면 어디서든 사용할 수 있는 앱
  • 인터넷 접속이 전제되는 앱을 웹앱이라고함
  • 웹앱 사용을 원하면 웹브러우저등의 소프트웨어가 필요함
• 스마트폰 성능을 최대한으로 발휘할 수 있는 앱
  • 스마트폰 앱이라고함
  • 스마트폰에 장착되어있는 GPS,카메라,네트워크,센서등의 하드웨어를 활용해서 게임이나 지도앱등 많은앱이 제공되고있음

2-3. 소프트웨어 개발공정

• 요구 분석과 요건 정의

  • 요구분석
    • 소프트웨어로 실현하고자 하는 내용을 정리해서 고객의 요구사항이나 현재 문제로 느끼는점을 정리하는 일
  • 요건정의
    • 실현가능성을 포함해서 판단하고 비용측면 등도 고류한 후 소프트웨어로 구현할 범위를 조정하여 결정하는것
      • 요건정의에서 구현할 품질이나 범위를 정해두지 않으면 요구사항이 나중에 자꾸 추가되어 개발이 끝나지 않게됨
  • 정리하자면 요구분석은 고객측의 요구사항을 정리하는것
  • 요건정의는 개발측에서 구현할것을 문서로 작성하는 단계라고 할수있음

• 설계

  • 기본설계(외부설계)
    • 이용자의 시점이나 화면구성,각종 서류, 취급하는 데이터, 다른 시스템과의 통신 방법등을 결정함
  • 상세설계(내부설계)
    • 개발자의 시점에서 내부동작이나 데이터 구조, 모듈 분할 방법등을 생각함
  • 기본설계에서 What을, 상세설계에서는 HOW를 생각한다고 보면됨

• 개발과 테스트

  • 설계 후에는 프로그래밍 언어를 사용해서 소스코드 작성하고 실행 환경을 정비함 이것을 개발이라고 함
  • 구현후에는 개발한 소프트웨어 동작을 확인하는 테스트가 이루어짐

• 대규모 프로젝트에서 많이 사용이 되는 흐름

  • 워터폴

    • 폭포가 흐르듯 개발이 진행된다고 해서 붙여진 이름
    • 금융기관 등의 대규모 프로젝트에서 사용됨
    • 재작업할 일이 생기지 않도록 상류 공정에서 확인하고 문서등을 정비후에 개발이 진행됨

  • 애자일

    • 워터폴보다 유연한 대처가 가능함
    • 요건 정의에서 릴리스까지의 사이클을 작은 단위로 반복하여 개발
    • 사양 변경이나 문제발생이 된 경우에도 신속한 대처가 가능

  • 워터폴과 애자일 비교

    • 애자일은 워터폴과 비교하면 처음 견적과는 비용이나 일정이 큰 폭으로 달라질 우려가 있음
    • 변경이 반복되므로 개발자의 동기저하, 프로제긑의 지연등의 리스크도 있음

  • 스파이럴이라고 하는 개발기법도 있음

    • 설계와 프로토 타입을 반복해서 개발하는 기법
    • 시제품을 만들어 의뢰자도 완성된 이미지를 확인 가능함
    • 다만 의뢰자의 요구가 많아지면 시제품만 만들다가 완성이 되지않을 가능성도 있다고함

📖오늘 배운것에 대한 오늘의 정리 및 마무리📖

• 앞 5일간은 휴가를 다녀오느라 Velog업로드가 되지않았음
• 꾸준히 공부 열심히해서 TIL을 꼭 ..꾸준히써야겠다
• 양이많은게 중요한게아니라 꾸준히가 중요하다고 했다..!
• 남은 공부도 꾸준히 해야겠다 화이팅!_!