[도쿄의 사계] #2021/1/16개발일지

What I did

<사전준비>

・데이터 베이스에 넣을 관광 명소의 콜렉션 테이블의 구조에 관광명소 이름, 관광 명소 이미지 이름, 관광 공식 사이트 URL, 디스크립션의 글귀 작성,관광 명소 아이디를 부여해서 입력 완료 했다.
다 수작업으로 하는거라 은근히 시간 많이 걸림....매칭 후에 나오는 디스크립션 글귀도 다 다르게 작성해 보았다. 후아..

・튜터님께 확인 받고 다음 스텝 확인하기.
저 아이들을 파이썬 코드로 데이터베이스에 삽입해야 하는데 엑셀이랑 친하지 않아서 자신이 없다.

<메인페이지>

・ footer의 굵기? 를 좀 더 얇게 만들고, 이 블로그로 이동할 수 있는 링크 글씨 [블로그 보기] 가 같은 위치에 오도록 조절해 보았다. 별 거 아닌 것 처럼 보이는데 은근 복잡했...

🎈 HTML 코드

    footer {
        width: 100%;
        text-align: center;
        padding: 1px 0;
        color: white;
        background-color: darkslateblue;
        position: relative;
    }
          .velog {
        color: white;
        position: absolute;
        top: 0;
        right: 5px;
    }
    
  • position: absolute 라는 방법을 쓰면 footer 기준으로 그냥 위치를 고정 가능!(footer가 꼭 Position: relatvie여야 함!!)
  • position: absolute와 position: relative는 같이 쓰이는데, postion: absolute -> 이 친구를 절대적인 위치에 박아 넣을거야!라는 뜻 임.
  • position: relative // position: absolute에서 계산할 위치의 기준이며 반드시 함께 사용되야 함!
    (블로그 링크는 absolute 즉 절대적인 위칭에 놓이게 되는데, position: relative인 footer의 top: 0px right: 5px에 놓이게 된다)

・ 어느 페이지에서도 메인,스타트,시즌 페이지 자유롭게 이동할 수 있게 했다!

Doing...

<파이썬 코드로 데이터베이스에 정보 삽입하기>

  1. openpyxl 이라는 녀석으로 파이썬 언어로 엑셀 파일 내용을 읽고,
  2. pymongo 이용해서 데이터를 db 에 밀어넣기

🎈 openpyxl 사용법
https://wikidocs.net/91661
https://tariat.tistory.com/781
https://hogni.tistory.com/92

일단 읽어는 봤는데 엑셀이랑 전혀 친하지 않은 나이기에 생소하고 뭐가 뭔지 잘 모르겠다... 폭풍 질문이 필요함...

・ 스타트 페이지 어느 정도 만들어 보기

🎈 이 코드들을 사용해서 각각의 카드에 부여한 아이디만 순서대로 보이게 할 예정인데 답변에 따라 질문이 바뀌기 때문에 쉽지 않다. 생각을 많이 해야 한다.

        $('.card-body').hide();
        $('.q1').show();
        

What to do

・ MBTI와 비슷한 구조의 형식이기 때문에 매칭 결과의 관광 명소에만 아이디를 부여 하는게 아니라 질문에도 아이디를 먹이는게 좋을 것 같다..
(어떤 대답을 햇냐에 따라 나올 질문들도 바뀌기 때문에, ID로 바로 보여주도록 질문과 대답을 전부 ID화 시켜서 찾기)
・ 시즌 페이지에 내리는 효과 찾아보기
・ 시즌 페이지 봄 여름 가을 겨울 글귀 생각하기
・ 메인 이외의 페이지에도 훗다 적용하기
・ 스타트 페이지의 질문 답변 구조 코드 알아보기

Comment & Thought

-거친 파도와 산을 넘고 나니 더 큰 산이 등장했다...하 넘을 수 있을까..
-벌써부터 My trip box 페이지 작성의 압박감이 밀려온다.
-이번 주말에는 욕심 내지 말고 파이썬 코드로 관광 명소 정보 삽입하기까지만 완료하자.

좋은 웹페이지 즐겨찾기