12/23 회고록(TIL)

1. HTML ,CSS , JS

HTML,CSS,JS로 홈페이지를 만드는 것은 익숙하지 않아 당황스러웠다.
간단하게 정리해보자면

HTML : 웹사이트의 틀을 잡는데 사용한다.
CSS : HTML로 틀을 잡았다면 디자인을 하는데 사용한다.
JS : 기능 구현을 하는데 사용한다.

• HTML의 요소들

  • head
    • HTML문서의 헤더 부분
    • head의 내용은 페이지에 표시되지 않음
    • 메타데이터 및 문서 전체 타이틀을 표현하기 위한 이 들어간다.
  • body
    • HTML 문서의 본체
    • 사용자가 직접 보는 컨텐츠가 들어간다.
    • 텍스트,이미지,동영상,버튼,링크 등 포함가능
  • div
    - 콘텐츠를 묶어 그룹화 한다.
    
    
  • 간단한 HTML 문서
    
    

  해당 HTML은 head와 body로만 구성된 아주 간단한 문서이다.

  html 태그로 문서의 시작과 끝을 알려주고

  head에 메타데이터와 스타일을 추가한다.

  style은 HTML 내에서 CSS를 정의하는 것으로 .mytitle클래스에 스타일을 지정할 수 있다.

  body에서는 div로 구역을 나누고 ID,PW를 입력할 수 있는 입력창과

  로그인하기 버튼이 추가되어 있다.

  여기서 사용된 대부분의 코드는 외워서 사용하는 것이 아니라 필요할때마다

  서칭해서 사용하는 것이다.

2. Git과 GitHub

Git이란?

코드 변경점 기록

버전(형상) 관리 도구

소프트웨어의 변경사항을 체계적으로 추적하고 통제하는 것

GitHub?

온라인 백업 , 공유 , 협업을 하는 온라인 코드 저장소

Git 필수 명령어

1. git init : 새로운 Git 저장소 초기화

   • 프로젝트 시작 전 딱 한번만 입력하면 됨
   • 여러번 입력해도 문제가 되진 않음
   • 정확한 프로젝트 폴더(경로)에서 입력해야 함
   • 입력하면 .git이라는 폴더가 생김 이때부터 코드 변경을 git에서 추적
     
     

2. git add , git commit

   • git add index.gtml
   • git commit -m “첫 번째 코드 작성”
   • 저장 명령어가 2개인 이유
     • add는 저장할 파일을 지정 (Staging area에 들어감)
     • commit 실제로 저장 (실제로 repository에 들어감)
     • gid add. : 모든 변경 파일 추가
   
   

3. git status : 저장 여부 확인하는 명령어

   • 붉은 색 : 변경은 있지만 커밋을 안함

4. git log : 저장 내역을 확인하는 명령어

5. git push : 추가로 수정된 코드 github에 반영

   • git push origin 브랜치명

6. git clone : 분기를 만든다. 코드를 통째로 가져오기

   • Code를 눌러서 주소 전달
   • 코드를 작성할 폴더를 만들고
   • git clone github주소 . 명령어 → . 붙여야됨

7. git pull : 충돌 방지 git pull 로 먼저 당겨오고 push해야됨(변경사항을 미리 가져오기)