장고 웹페이지 만들면서 알게 된 작은 정보들

김모씨·2022년 11월 15일
0

장고로 웹페이지 만드는 중!
입력하는 부분 페이지를 만들고 있다.

완성본

스타일 태그로 넣어 주었다.

http://www.tcpschool.com/examples/tryit/tryhtml.php?filename=css_advanced_forms_06

  • border-radius를 조정하면 끝부분이 더 동글동글해진다.
  • padding을 조정하면 텍스트 입력 시작 부분이 textarea 경계로부터 공간적인
    여유가 생긴다.
<style>
		textarea {
			width: 100%;
			height: 200px;
			padding: 50px;
			box-sizing: border-box;
			border: solid 2px #1E90FF;
			border-radius: 50px;
			font-size: 16px;
			resize: both;
		}
	</style>

        <div class="container text-center">

  <div class="row">
    <div class="col">
      <h2> 단어 1 </h2>
{{ key_form.content1 }}

    </div>
    <div class="col">
      <h2> 단어 2 </h2>
        {{ key_form.content2 }}
    </div>
    <div class="col">
      <h2> 단어 3 </h2>
        {{ key_form.content3 }}
    </div>
  </div>
</div>

pagenation

  • 글 목록 페이지에서 한 페이지당 글을 다섯개씩이라던지.. 열개 씩 보여주고 더 많은 글을 보려면 다음 next >>를 눌러야 하는 것 구현.

참고한 영상
https://youtu.be/5DvVvWBBqQw
장고 공식 문서
https://docs.djangoproject.com/en/4.1/topics/pagination/#example

https://www.geeksforgeeks.org/how-to-add-pagination-in-django-project/

해당페이지.html에 추가할 부분

         <ul class="pagination">
              {% if memory.has_previous %}
              <li class="page-item">
                  <a href="?page=1" class="page-link"> << First </a>
              </li>
              <li class="page-item">
                  <a href="{{memory.previous_page_link}}" class="page-link"> < previous </a>
              </li>
              {% endif %}

              {% if memory.has_next %}
              <li class="page-item">
                  <a href="?page={{memory.next_page_number}}" class="page-link"> Next </a>
              </li>
              <li class="page-item">
                  <a href="?page={memory.paginator.num_pages}}" class="page-link"> Last </a>
              </li>
              {% endif %}

모델에서 정의한 field값이 HTMl의 form태그 안에 있는 button과 input 태그안에 name을 맞춰주기

화풍,일기내용 뿐만 아니라..
라디오 버튼으로 만들어준 날씨와 감정을 어떻게 데이터를 넘기냐면!
참고
https://noodle-dev.tistory.com/61

  • 웹페이지는 이렇게 생김.

model

class Memory(models.Model):
    head_image = models.ImageField(upload_to='blog/images/%Y/%m/%d/', blank=True)
    title = models.CharField(max_length=30)
    content = models.TextField(max_length=1000)
    created_at = models.DateTimeField(auto_now_add=True)
    updated_at = models.DateTimeField(auto_now=True)

    weather_choices = {('Sunny', '맑아요'),
                       ('Cloudy', '흐려요'),
                       ('Rainy', '비가 와요'),
                       ('Snowy', '눈이 와요')}

    drawing_choices = {('Digital Art', '디지털 아트'),
                       ('Oil and Canvas', '유화'),
                       ('Sketched', '스케치'),
                       ('Impressionism', '인상주의'),
                       # ('','')
                       }
    emotion_choices = {('Cheerful', '쾌활함'),
                       ('Happy', '기쁨'),
                       ('Neutral', '평범'),
                       ('Depressed', '우울함'),
                       ('Angry', '화남')
                       }

    Weather = models.CharField(max_length=20, choices=weather_choices, null=True)
    Drawing = models.CharField(max_length=20, choices=drawing_choices, null=True)
    Emotion = models.CharField(max_length=20, choices=weather_choices, null=True)
    def __str__(self):
        return f'[{self.pk}]{self.content}'

    # def __str__(self):
    #     return f'[{self.user_name}]{self.created_at}'

    def get_absolute_url(self):
        return f"/diary/{self.pk}/"

--> Weather, Drawing, Emotion 부분을 html에서도 태그안에 name으로 똑같이 지정을 해줘야 합니다.

https://github.com/cyjeong2/Project-3/commit/9dae90664d469008b43da0c614f387e9e1433915

input태그에 name옆에 있는 id는 css에 적용되는 id일뿐이다..

왜 안되는 지 log보기

views.py에 아래의 코드를 붙여 놓고

import logging
logger = logging.getLogger()
# 로그의 출력 기준 설정
logger.setLevel(logging.INFO)

# log 출력 형식
formatter = logging.Formatter('%(asctime)s - %(name)s - %(levelname)s - %(message)s')

# log 출력
stream_handler = logging.StreamHandler()
stream_handler.setFormatter(formatter)
logger.addHandler(stream_handler)

# log를 파일에 출력
file_handler = logging.FileHandler('my.log')
file_handler.setFormatter(formatter)
logger.addHandler(file_handler)

보고 싶은 부분을 노란색 형광펜으로 보이는 부분에 입력한다.

profile
하루하루 성장하는 코딩 실력!! 내 맘대로 기록하는 코딩 블로그

0개의 댓글