미소를뿌리는감자의 코딩
[항해99 웹개발종합반] 3주차 HW 본문
이번 HW은 다음과 같이,
날짜에 따른 박스 오피스 순위를 나타내는 것이다.
[접근 방법]
이번 과제가 movie.html에서 만든 것과 유사하다고 생각이 들어 해당 부분을 복사-붙여넣기 해서 기본 골격을 만들었다.
추후에, 기본 골격이 주어졌었다는 것을 알게되었지만, 오히려 이것저것 해볼 수 있던 좋은 기회였다.
먼저, API 를 살펴보며 어떤 구성을 가지고 있는지 확인했다.
이런 골격을 가지고 있음을 확인하게 되었고,
answer_list = rjson["boxOfficeResult"]["weeklyBoxOfficeList"]
이런식으로 접근하면 되겠다 라고 생각하였다.
또한, 받아온 data의 경우 table 태그를 이용해서
골격을 만들어주면 되겠다고 생각하였다.
[적용]
1) Flask file
여기서,
query = request.args.get('query', '20230601')
requests.args.get의 두 번째 인자로 '20230601'을 넣어주었다.
이렇게 두 번째 인자로 넣어주게 되면, 이를 default value로 여기어 준다.
2) answer.html
table의 구성을 위와 같이 하였다.
여기서
<table style="width:100%">
style 을 넣기 전에는 table이 가로로 짧게 끝났었다.
width:100%를 설정해줌으로 window의 양끝까지 table이 길게 늘어질 수 있도록 하였다.
다음으로 style은 다음과 같이 구성하였다.
border-collapse는 겹치는 줄에 대해서 2개의 줄을 나타내지 않고 한 줄로 나타낼 수 있도록 하는 것이다.
이후 줄을 그어주었다.
[결과]
20240101의 값을 입력해 보겠다.
[전체 코드]
1) Flask file
2) answer.html
[후기]
강의 수강과 HW 부분에서 시간을 많이 소요했던 주차였다.
새로운 부분을 많이 배운 것 같아 뿌듯하기도 하다.
더불어서 trouble shooting을 잘 해낸 것 같아 다행이다.
'강의수강 > HW' 카테고리의 다른 글
[항해99 웹개발종합반] 5주차 HW (0) | 2024.01.12 |
---|---|
[항해99 웹개발종합반] 4주차 HW (1) | 2024.01.11 |
[항해99 웹개발종합반] 2주차 HW (0) | 2024.01.09 |
[항해99 웹개발종합반] 1주차 HW (2) | 2024.01.09 |