04-20

부트스트랩 활용 및 JavaScript 입문 공부

<!-- Required meta tags -->
    <meta charset="utf-8">
    <meta name="viewport" content="width=device-width, initial-scale=1, shrink-to-fit=no">

    <!-- Bootstrap CSS -->
    <link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/4.0.0/css/bootstrap.min.css"
          integrity="sha384-Gn5384xqQ1aoWXA+058RXPxPg6fy4IWvTNh0E263XmFcJlSAwiGgFAW/dAiS6JXm" crossorigin="anonymous">

    <!-- Optional JavaScript -->
    <!-- jQuery first, then Popper.js, then Bootstrap JS -->
    <script src="https://ajax.googleapis.com/ajax/libs/jquery/3.5.1/jquery.min.js"></script>
    <script src="https://cdnjs.cloudflare.com/ajax/libs/popper.js/1.12.9/umd/popper.min.js"
            integrity="sha384-ApNbgh9B+Y1QKtv3Rn7W3mgPxhU9K/ScQsAP7hUibX39j7fakFPskvXusvfa0b4Q"
            crossorigin="anonymous"></script>
    <script src="https://maxcdn.bootstrapcdn.com/bootstrap/4.0.0/js/bootstrap.min.js"
            integrity="sha384-JZR6Spejh4U02d8jOt6vLEHfe/JQGiRRSQQxSfFWpi1MquVdAyjUar5+76PVCmYl"
            crossorigin="anonymous"></script>
    <!--    구글폰트-->
    <link rel="preconnect" href="https://fonts.gstatic.com">
    <link href="https://fonts.googleapis.com/css2?family=Gothic+A1:wght@200&display=swap" rel="stylesheet">



.comment{
            color: blue;
            font-weight: bold;
}

부트스트랩 4버전이있지만 최신으로 5버전이 나온거같다. 나는 4버전으로 실습했고
Document에서 components를 활용해서 메모장을 만들고 등등 여러가지 실습을진행하였습니다.

중첩으로 해결하는법 메모
이렇게 해놓으면
만약 card하나하나에 style color이렇게넣으면 나중에수정할떄 힘들어지는대
이렇게 class로만 적용시키면 .comment style만 수정하면되기때문에 편리하다

자바스크립트
let myemail = '[email protected]'
myemail.split('@')

myemail.split('@')[1]

이런식으로
myemail.split('@')[1].split('.')
하면 이제
gmail, com 이렇게나눌수있다. 나중에 활용할수있을거같다.

프로그래밍에서 함수는 정해진 동작을 하는것이다.
이렇게 이해하면편할것이다. 그러나 자바는 메소드라고부르기도 한다 기능을 클래스로
기능 정의하는 느낌으로 하는것이다. 지금은 자바스크립트니까 잠시 자바생각은 접어두자

HTML작성할때 항상 div로 나눠서 하는걸 추천한다. 이것을 습관들이기