1주차 개발일지

HTML - 구역과 텍스트를 나타내는 코드, 크게 head와 body로 구성

           - head: 페이지의 속성 정보

           - body: 페이지의 내용

 

CSS - 구역을 꾸며줌

      - 배경 관련

             background-color

             background-image

             background-size

      - 사이즈

             width

             height

      - 폰트

             font-size

             font-weight

             font-family

             color

      - 간격

             margin(바깥 여백)

             padding(안쪽 여백)

      - 자주 쓰는 CSS

             h1, h5, background-image, backgound-size, background-position, color, width, height, border-radius, margin, padding

 

구글 웹폰트

1. https://fonts.google.com/?subset=korean

2. 마음에 드는 폰트 클릭 후 [+ Select this style ] 클릭

3. 우측 상단 모음 아이콘 클릭

4. link 태그 복사 후 <style>~</style> 사이에 추가

 

Bootstrap(부트스트랩) - CSS를 모아둔 것

https://getbootstrap.com/docs/4.0/components/alerts/

 

Javascript(자바스크립트) - 프로그래밍 언어 중 하나, 브라우저가 알아들을 수 있는 언어(Java와 관련 x)

 

자바스크립트 함수

- head 안에 script 공간을 만들어 작성

  function f1(){

     alert('hello');

  }

- 버튼에 함수 연결

  <button onclick="f1()">

- 브라우저에서 작성

  f12 -> console 탭에 작성

  console.log(변수): 콘솔 창에 값을 출력

  let 변수: 변수 선언

  let a_list = []: 리스트 선언

  let a_dict = {}: 딕셔너리(key, value) 선언

  let a_list = [{'name':'seon', 'age':20}]: 리스트와 딕셔너리 조합

  a.toUpperCase(): 알파벳 대문자로 변경

  문자열 나누기

    let email = 'abc@gmail.com'
    let result = email.split('@')
    result[0] //abc
    result[1] //gmail.com
    let result2 = result[1].split('.')
    result2[0] //gmail
    result2[1] //com
    -> email.split('@'[1].split('.')[0]  //gmail

  let result = email.join('@'): 문자열 합치기