부트스트랩 2

[Django] 장고 부트스트랩 Grid - 인스타 클론코딩

📍 부트스트랩 Grid현재 나의 index페이지는 1줄에 card 1개씩 페이지가 꽉차게 나오는 상황이다.(여백없이 사진만 덩그러니 페이지를 꽉 채우니 부담스럽다..) 부트스트랩의 그리드를 적용해 1줄에 card가 2개씩 나오도록 설정해보려 한다.(실제 인스타는 1개씩 나오지만 사이드를 채울만한 기능을 추가할 계획이 없기 때문에 나는 2개씩 채우려 한다.) https://getbootstrap.kr/docs/5.0/layout/grid/ 그리드 시스템강력한 모바일 우선 flexbox 그리드를 사용하여 12개의 열 시스템, 6개의 기본 반응형 계층, Sass 변수 및 믹스인, 수십 개의 사전 정의된 클래스 덕분에 모든 모양과 크기의 레이아웃을 빌드할 수 있getbootstrap.kr 부트스트랩 공식홈페이..

Django/INSTA 2024.01.19

[Django] 장고 부트스트랩 Navbar 추가 - 인스타 클론코딩

📍 Navbar 추가Navbar가 있으면 여러모로 편리하기 때문에 페이지 상단에 Navbar를 추가해주려한다. bootstrap을 이용할 것이기 때문에 base.html에 CDN방식을 적용하여 앞으로 생성할 html들에 쉽게 bootstrap을 적용시켜보자.base.html을 생성하기 전 base.html을 저장할 project 최상단에 'templates' 폴더를 생성하고 settings.py를 설정해주었다.DIRS를 설정해주어야 엔진이 base templates를 찾을 수 있다.TEMPLATES = [ { "DIRS": [BASE_DIR / 'templates'], },] templates 폴더에는 기본 템플릿인 base.html, _nav.html를 추가해주고base.htm..

Django/INSTA 2024.01.19