내일배움캠프 24일차
[오늘한일]
- 알고리즘 문제풀이
- 장고 심화강의 수강
- 기초프로젝트 복기
[오늘 배운점]
우리팀이 제출한 프로젝트를 복기해봤다.
3가지 정도 내가 더 공부해야 할점이 있다.
그중 한가지에 대해 오늘 확실하게 파악해봤다.
이부분은 발표때 튜터님 피드백에서 좋다고 하셨던 코드이기도 하다.
<@property를 이용해서 속성만들기>
class TweetModel(models.Model):
content = models.TextField("내용")
(중략)
# admin 페이지에 적용
@property # 메소드의 return 값을 필드로 정의
def short_content(self):
return self.content[:15] # title 대신 short_content로 간단하게 admin에서 보여주기바로 이부분이다. 팀원분 중 혜민님께서 작성하신 코드다.
우리가 작성한 TweetModel에 있는 메소드중 하나인데,
@property라는 데코레이터를 붙여줬고, [:15]가 붙은 self.content를 반환해준다.
이코드의 역할은 admin페이지에서 알수있다.
class TweetModelAdmin(admin.ModelAdmin):
list_display = ['id', 'user', 'image',
'short_content', 'update_at', 'created_at']
list_display_links = ['id', 'user']
list_filter = ('user', 'update_at', 'created_at')우리가 작성한 admin.py의 모습이다.
short_content가 list_display에 한 요소로 자리잡고 있는것을 볼수 있다.
※ admin페이지를 입맛대로 바꾼 것은 지난주 배운점에 적었다.
(저런식으로 admin페이지에서 모델을 조회할때, 보이는 요소를 조정할수 있고 링크와 필터도 줄수있다.)
즉, short_content의 역할은 본래의 트윗 내용을 대신해서,
15자로 줄여진 '짧은 내용'을 보여주는 것이다.
(내용이 긴 트윗이 있을 경우 그 트윗이 화면을 많이 차지하는 걸 방지했다.)
메소드인 short_content를 속성인것 처럼 (클래스 지역변수 혹은 여기선 필드 명이기도 하다.)
만든게 property 데코레이터이다.
property데코레이터는 클래스 안에서 위치하며,
메소드를 클래스의 속성으로 삼는 기능을 하는 파이썬 내장 데코레이터이다.
메소드를 통해 반환하는 값을 메소드명=반환값으로 속성으로 이용한다.
이렇게 만들어진 속성은 다른 속성과 똑같이 사용가능하다.
admin페이지에 쓸수도 있고,
view함수에서도, 템플릿 내 DTL에서도 사용가능하다.
즉, '짧은 내용'은 필요하다면 어디서든 쓸수 있는 하나의 요소가 된 것이다.
해당 모델로 만든 인스턴스에 이 속성이 부여된다.
그래서 인스턴스.속성명으로 사용가능하다.
(메인 페이지 트윗내용(content)를 short_content 속성으로 대체해도 무관하다. 그럼 짧은 내용이 나온다.)
그렇다고 모델에 진짜 필드 중 하나가 되는 것은 아니다.
즉, DB에 필드가 생기진 않는다.
(어찌보면 당연하게도, model이라는 함수를 안쓰기 때문이다.)
그러니까 달리보면, 모델로써는,
DB에 필드는 아니지만, DB필드를 참조해서 커스텀되는,
클래스 속성을 하나 만드는 방법이 될수 있는 것이다.
그렇다면!
그냥 클래스내 지역변수로, 혹은 초기화 메소드 (__init__)에서의 변수로,
short_content = content[:15]를 선언해주면 되지 않을까??
생각해보면 두 방법은 거의 비슷해보인다.
그리고 실제로 비슷한 역할을 할 수 있다.
하지만 자세히 알아보니 디테일 하게 동작에 차이가 있다.
정말 흥미롭게도 property를 이용해 만든 속성인 경우,
해당 속성을 호출할 때마다 메소드를 실행해 반환값을 갱신한다.
그에 반면 지역변수나 초기화 메소드 내 변수를 이용한 속성의 경우,
인스턴스를 생성할때 값이 부여되고 그 값을 계속 기억하고 있게 된다.
그러니 어떤 가공이 별도로 있지 않아도 계속 기능을 해서 최신 값을 가져오는 것이다.
상황에 따라서는 정말 적합하고 스마트한 해결책이 될수도 있겠다.
좋은 코드라고 해주신 말씀이 알아볼수록 이해가 된다.
결론, @property와 메소드를 이용해서 우리가 원하는 요소를 만들수 있었다.
@property에 대해 많이 배우게 되었다.
완성도를 위해 세세한 부분까지 작성해주신 노력에 감사드려야 겠다.
<html a태그 클릭속성 없애기>
html에서 a태그는 기본적으로 하이퍼링크를 동작하는 태그이다.
필요하다면 기본모습을 조정해줄수 있다.
※ 예전에 a태그에서 밑줄을 없애는 방법을 적었었는데,
이번에도 그방법을 활용한 부분이있다. 트윗 작성자 부분.
또 이번에 프로젝트를 하면서 a태그에 대해 새 노하우를 배우게 됬다.
<a href="javascript:void(0)" class="btn btn-sm btn-outline-secondary" onclick="toggleBtn1()" style='margin: 0px 10px 0px 0px'>수정</a>해당 a태그이다.
기본 클릭 속성을 죽이고 온클릭 함수를 클릭으로 동작시키게끔 만들었다.
하이퍼링크에 저렇게 javascript:void(0)를 부여해서 클릭되는 속성을 없애줬다.
그리고 onclick함수를 부여해서 다른 원하는 동작을 하게 했다.
하이퍼링크를 없애주지 않는다면, onclick이 있더라도 클릭시 하이퍼링크가 동작한다.
다른 태그를 쓰는게 대안이 될수 있겠지만,
(여기선 button태그가 적절한 대안이겠다.)
다른 부분들과의 통일성을 위해 a태그를 사용한채 위처럼 조정해준 모습이다.