til.3 프론트 공부시작

TaengEe·2022년 12월 5일
0

클라이언트와 서버의 개념

  • 클라이언트 : 핸드폰, 패드, 컴퓨터 등 웹사이트를 보는 도구
  • 서버 : 클라이언트의 요청을 듣고 데이터와 자원을 보내줌

정적자원

  • HTML, CSS, JS

요청을 받는 방식

  • 정적자원과 데이터를 둘다 받아오는 방식
  • 영화 좌석 페이지처럼 데이터만 변해도 되는 페이지는 데이터만 리프레시함

서버리스

  • 완성이 되어 있는 서버를 빌려다가 씀
  • ex) 파이어베이스

HTML

CSS

  • HTML을 꾸며주는 역할
  • selector : #id, .class
  • 그리드 시스템 : 컨텐츠들의 레이아웃을 잡음
  • flex : DOM 요소들의 크기를 적당하게 지정
  • block : DOM 요소 하나하나 크기를 최대치로 지정
  • 사칙연산 : width: calc(80% - 20px);
    부모 크기의 80%에서 20px를 뺌
      

JS

  • document.getElementId 등으로 DOM 접근 가능
  • console.log 로 접근한 내역 확인 가능
  • creatElement 로 DOM 에 새로운 요소 추가 가능
    ex) document.body.appendChild(new_div);
  • class : 객체 생성을 위한 틀
  • constroctor : class 안에서 초기 값을 할당받음

spread 연산자

  • 기존 배열의 요소를 꺼내와 새로운 배열 생성
    let array = [1,2,3];
    let new_array = [...array];
    console.log(new_array);
    -> new_array = [1,2,3];

조건부 삼항연산자

  • if를 쓸 수 없을 때나 단축할 때 사용
    조건 ? 참 : 거짓;

내장함수

  • map : 조건에 의해 값이 변경되고 새로운 배열 생성
  • filter : 원하는 값을 골라 새로운 배열 생성
  • from : 기존 배열로부터 다른 값( 숫자, 문자 등)으로 변경하거나 일단 배열을 만들 때 사용
  • concat : 두 배열을 합칠 때 사용

공부 후기

이해하기 쉬운 부분도 있지만 다시 보고 또 봐도 이해가 안되는 부분이 더 많았던 것 같다.
복습만이 답인 것 같다.

profile
hi im Taen

0개의 댓글