programming study

#22.0 Photo Grid rooms/models.py def first_photo(self): photo, = self.photos.all()[:1] return photo.file.url def get_next_four_photos(self): photos = self.photos.all()[1:5] return photos templates\rooms\room_detail.html {% for photo in room.get_next_four_photos %} {% endfor %} #22.1 Styling the Room part One templates\rooms\room_detail.html {{room.name}} {{room.city}} {% include "mixins/user_ava..

#21.0 Messages part One Message 전송(메신저가 아닌 유저에게 문자열 전송 의미, notification message, flash message)을 위해 Messages Framework 사용 ⇒ django에는 이미 django.contrib.messages가 설치되어 있음 from django.contrib import messages 한 뒤, debug, info, success, warning, error를 통해 이용 templates\partials\messages.html : context processor을 통해 messages 변수 이용 가능 {% if messages %} {% for message in messages %} {{ message }} {% endf..

#20.0 Sizes in Tailwind 1em = font-size; 2em = 2*font-size em은 가장 가까운 font-size와 같음(font-size에 비례) rem : root em : html의 default font-size(16px) #20.1 Header part One container의 default width : 100% https://tailwindcss.com/docs 여기 검색하면 나오는 내용들... header 관련 class 설정 #20.2 Header part Two #20.3 Done with Header #20.4 Extending Tailwind tailwind의 기능만으로는 표현할 수 없기때문에 extend 필요 tailwind.config.js : sp..

#19.0 Intro to TailwindCSS TailwindCSS : utility 우선 framework #19.1 Setting Up TailwindCSS with Gulp package.json 수정 .gitingore에 node_modules/ 추가 : 모듈 파일 업로드하지 않도록 gulpfile.js const gulp = require("gulp"); const css = () => { const postCSS = require("gulp-postcss"); const sass = require("gulp-sass"); const minify = require("gulp-csso"); sass.compiler = require("node-sass"); return gulp .src("ass..