소개

이미 한번 다 만들어봤지만 한번 따라쳐보았다고 내 것이 되진 않는다.
익숙해지기 위해 다시 따라쳐보기로 하였고, 그 과정에서 내가 몰랐던 것이나 기억하고 싶은 것들을 적어두려 한다.

page 18 ~ 138

여기서는 아나콘다.
cmder
pycharm
git
을 이용한다.
나는 pycharm 대신 visualcode를 사용했다.

부트스트랩 적용하기

부트스트랩 사이트에 download를 통해 버전별로 다운이 가능하다.
책은 v4.x버전을 하라 했는데 아마 다양한 브라우저를 적용하기 위함인 듯 하다.

css

적절한 폴더에 bootstrap.min.css, bootstrap.min.css.map넣고,
<link rel="stylesheet" href="./bootstrap4/css/bootstrap.min.css" type="text/css">
를 헤더에 넣으면 된다.

js

원하는 html파일 body하단부에 넣는다.

<script src="https://code.jquery.com/jquery-3.5.1.slim.min.js"
        integrity="sha384-DfXdz2htPH0lsSSs5nCTpuj/zy4C+OGpamoFVy38MVBnE+IbbVYUew+OrCXaRkfj"
        crossorigin="anonymous"></script>
<script src="https://cdn.jsdelivr.net/npm/popper.js@1.16.1/dist/umd/popper.min.js"
        integrity="sha384-9/reFTGAW83EW2RDu2S0VKaIzap3H66lZH81PoYlFhbGU+6BZp6G7niu735Sk7lN"
        crossorigin="anonymous"></script>
<script src="https://cdn.jsdelivr.net/npm/bootstrap@4.6.0/dist/js/bootstrap.min.js"
        integrity="sha384-+YQ4JLhjyBLPDQt//I+STsc9iw4uQqACwlvpslubQzn4u2UU2UFM80nGisd026JF"
        crossorigin="anonymous"></script>

특이하게 css는 download했지만, js는 cdn방식을 이용했다.
이유는 bootstrap의 js를 다운로드해서 넣으려면, 앞서 jQuery와 popper도 필요한다고 한다.
front를 해볼일이 별로 없어서 당연한 건지도 모른다.

이전에 bootstrap도 jQeury를 안쓴다고 하였으니 나중엔 코드가 줄어질 것 같다.

원하는 요소 넣기

주로 홈페이지에 doc에서 component에서 골라 넣는다. 역시 공홈이 좋다.

class="container"

class="container"를 적용하면 뭔가 깔끔하게 들어간다.
정리하긴 어려울 것 같고 여러번 넣어봐야할 듯 하다.

class="row"

하위 태그들을 가로로 놓겠다.

class="col-3"

부트스트랩은 12분할로 화면을 나눈다.
특정한 값이 없으면 12로 알아서 나눈다.
col-3은 가로로 3개 만큼의 크기를 갖겠다는 이야기다.
ex)

class="col-lg-9 col-md-8 col-sm-5"

lg = large
md = middle
sm = small
화면의 크기가 클때 중간일 때 작을 때 화면의 크기를 차지하는 비율이다.

class="ml-auto"

m은 margin이고
l은 left이다.
ml-auto는 margin-left로 최대값을 준다는 의미이다.
(값은 오른쪽 끝으로 간다.)

장고(venv 설치)

장고를 할 때 항상 venv를 새로 해야하는데 저번에는 어쩌다보니 기존에 있던 venv를 가져와 오류가 많이 났다.
window기준 달 하려면 window cmd를 열고
프로젝트 폴더에서
python -m venv venv
를 하면된다.
venv라는 이름의 폴더로 venv를 새로 만든다는 소리다.'
같은 명령어라도, visualcode의 git bash나 cmder로 안되니 유의하자

항상 pip list를 쳐서 정말 새로 만든 venv가 맞는지 확인하자

pip ...
setuptools ...

만 있는게 정상.

venv 실행

1. cmd로 할려면 직접 Script폴더안에 들어간뒤 activate를 친다.

2. cmder로 한다면 vevn\Scripts\activate.bat로 가능하다.

venv 끄기

• deactivate 를 치면 끝