본문 바로가기
TIL/내배캠 사전캠프

23.05.10

by J1-H00N 2023. 5. 10.

발생한 문제

1. 메인 페이지에서 카드에 커서를 올렸을 때 글자에 커서를 올리면 hover가 작동하지 않음

2. 각 카드마다 새로운 상세 페이지를 만들기에는 기술적 부족함이 있음

3. 각 영화마다 관람평을 구분해서 등록할 수 없음

 

해결 방법

2 -> 미리 3개 정도의 영화만 상세 페이지를 정적으로 구현하고 이후 추가 등록되는 영화는 상세페이지로 넘어가지 않거나 공통되는 페이지만 나오도록 설정

3 -> 위 3개의 상세 페이지만 따로 관람평을 저장하는 데이터 베이스를 만들기

 

임시 수정 코드

# DB 데이터 -> 가디언즈 오브 갤럭시-Volume 3의 상세 페이지에 출력--------------------------------------------------------------------
@app.route("/movies1", methods=["GET"]) # 메인화면에서 목록을 불러오기 위한 get
def movies1():
    all_movies1 = list(db.movies.find({'title':"가디언즈 오브 갤럭시-Volume 3"},{'_id':False})) 
    # 코멘트, 감독, 등장인물은 메인화면에서 표시하지 않을 것이기 때문에 제외
    # db에서 main 콜렉션에 있는 데이터들을 리스트화 해서 저장
    return jsonify({'result1': all_movies1}) # 저장한 값 반환

# DB 데이터 -> 분노의 질주-라이드 오어 다이의 상세 페이지에 출력--------------------------------------------------------------------
@app.route("/movies2", methods=["GET"]) # 메인화면에서 목록을 불러오기 위한 get
def movies2():
    all_movies2 = list(db.movies.find({'title':"분노의 질주-라이드 오어 다이"},{'_id':False})) 
    # 코멘트, 감독, 등장인물은 메인화면에서 표시하지 않을 것이기 때문에 제외
    # db에서 main 콜렉션에 있는 데이터들을 리스트화 해서 저장
    return jsonify({'result2': all_movies2}) # 저장한 값 반환

# DB 데이터 -> 롱디의 상세 페이지에 출력--------------------------------------------------------------------
@app.route("/movies3", methods=["GET"]) # 메인화면에서 목록을 불러오기 위한 get
def movies3():
    all_movies3 = list(db.movies.find({'title':"롱디"},{'_id':False})) 
    # 코멘트, 감독, 등장인물은 메인화면에서 표시하지 않을 것이기 때문에 제외
    # db에서 main 콜렉션에 있는 데이터들을 리스트화 해서 저장
    return jsonify({'result3': all_movies3}) # 저장한 값 반환

 

 

메인 페이지 코드 수정 사항

<div class="main">
        <div class="mycards">
            <!-- 현재 위치에 스크립트 내용 출력 -->
            <div id="cards" class="row row-cols-1 row-cols-md-4 g-3">
                <div class="col">
                    <div class="card">
                        <a href={{url_for('sub1')}}>
                            <div class="screen">
                                <div class="top">‘가모라’를 잃고 슬픔에 빠져 있던 ‘피터 퀼’이 위기에 처한 은하계와 동료를 지키기 위해 다시 한번 가디언즈 팀과 힘을 모으고,
                                    성공하지 못할 경우 그들의 마지막이 될지도 모르는 미션에 나서는 이야기</div>
                                <img src="https://img.cgv.co.kr/Movie/Thumbnail/Poster/000086/86883/86883_185.jpg"
                                    class="card-img-top" alt="...">
                            </div>
                        </a>
                        <div class="card-body">
                            <h5 class="card-title">가디언즈 오브 갤럭시-Volume 3</h5>
                            <p>⭐⭐⭐⭐⭐</p>
                        </div>
                    </div>
                </div>
                <div class="col">
                    <div class="card">
                        <a href={{url_for('sub2')}}>
                            <div class="screen">
                                <div class="top">아무리 빨리 달려도 과거를 앞지를 순 없다 돔(빈 디젤)과 그의 패밀리 앞에 나타난 운명의 적 단테(제이슨 모모아). 과거의 그림자는 돔의 모든 것을 파괴하기 위해 달려온다. 단테에 의해 산산히 흩어진 패밀리들은 모두 목숨을 걸고 맞서야 하는 함정에 빠지고 마는데.. 달리거나 죽거나, 그들의 마지막 질주가 시작된다!</div>
                                <img src="https://img.cgv.co.kr/Movie/Thumbnail/Poster/000086/86996/86996_185.jpg"
                                    class="card-img-top" alt="...">
                            </div>
                        </a>
                        <div class="card-body">
                            <h5 class="card-title">분노의 질주-라이드 오어 다이</h5>
                            <p>⭐⭐⭐⭐⭐</p>
                        </div>
                    </div>
                </div>
                <div class="col">
                    <div class="card">
                        <a href={{url_for('sub3')}}>
                            <div class="screen">
                                <div class="top">사회초년생 ‘도하’와 인디 뮤지션 ‘태인’이 장거리 연애를 시작하면서 벌이는 언택트 러브 스토리</div>
                                <img src="https://img.cgv.co.kr/Movie/Thumbnail/Poster/000086/86912/86912_185.jpg"
                                    class="card-img-top" alt="...">
                            </div>
                        </a>
                        <div class="card-body">
                            <h5 class="card-title">롱디</h5>
                            <p>⭐⭐⭐⭐⭐</p>
                        </div>
                    </div>
                </div>
                <div class="col">
                    <div class="card">
                        <a href={{url_for('sub4')}}>
                            <div class="screen">
                                <div class="top">'붉은 봉투를 줍는 자, 운명을 거스를 수 없다!' 혈기왕성한 형사 우밍한은 중요한 사건 현장에서 도로에 흩어진 증거물을 수집하던 중 의문의 붉은 봉투를 발견하고 무심코 줍는다. 그때부터 밍한에게 벌어지는 불길한 사건들! 자신에게 다가온 '운명'을 한사코 거부하던 밍한은 거듭되는 생명의 위협에 마지못해 인생 최대의 결심을 하는데... 얼결에 '부부'가 된 귀신과 최악의 빌런을 잡기 위해 인간+귀신 콤비가 벌이는 극강의 공조 수사! 코믹과 액션을 버무리고 감동과 반전까지 가미한, 풀옵션 오감으로 즐기는 블록버스터. 인류애 넘치는 콤비의 격정적인 공조가 마침내 시작된다! 이 콤비도, 두 사람의 공조 수사도 완전히 다 미쳤다!!!</div>
                                <img src="https://img.cgv.co.kr/Movie/Thumbnail/Poster/000087/87003/87003_185.jpg"
                                    class="card-img-top" alt="...">
                            </div>
                        </a>
                        <div class="card-body">
                            <h5 class="card-title">메리 마이 데드 바디</h5>
                            <p>⭐⭐⭐⭐⭐</p>
                        </div>
                    </div>
                </div>
            </div>
        </div>
    </div>

'TIL > 내배캠 사전캠프' 카테고리의 다른 글

23.05.11  (0) 2023.05.11
23.05.11  (0) 2023.05.11
23.05.09  (0) 2023.05.09
23.05.08  (0) 2023.05.08