15일 메이킹 프로젝트

[15일 메이킹 프로젝트] 데려갈꼬냥? - #최종 후기

목차 1. 페이지 스크린샷 2. 작업 내용 3. 첫 프로젝트 회고 1. 페이지 스크린샷 2. 작업 내용 1. 고양이 테스트 기능 구현 5가지의 문항으로 자신과 맞는 고양이 알아보기 기능 (like mbti test) 자바스크립트 이용, 문항별 점수 합연산으로 점수에 따라 결과 페이지로 이동할 수 있도록 구현 자바스크립트 이용 버튼을 넣어 페이지 이동 없이 문항을 선택할 수 있도록 함. 자바스크립트 이용, 문항을 선택하지 않으면 문항이 선택되지 않았다는 alert이 나오도록 함. 결과 페이지에서 버튼을 클릭 시, 데려갈꼬냥? 메인페이지로 이동 가능 → 테스트 공유로 페이지 유입, 홍보 효과 up 2. 시도별 유기묘 모아보기 광역시, 도별 유기묘 고양이 정보 모아보기 가능. 각 지역별 버튼을 클릭시 페이지로..

[15일 메이킹 프로젝트] #15일차 개발일지

목차 1. 시작의 한마디 2. 오늘의 목표 3. 회의 내용 4. 업무 이슈/고민 & 해결 5. Next up 1. 시작의 한마디 해냈다! 2. 오늘의 목표 1. ajax로 cat cards 로드 2. ajax로 모달창 동적으로 뜨도록. 3. 메뉴바를 누르면 cat cards가 로드되도록 3. 회의 / 작업 내용 1. cat cards 로드, ajax로 모달창 동적으로 뜨도록. - 시, 도별 구분 페이지에서 각 시,도를 선택 -> 서버로 시도 데이터 전송 서울특별시 //ajax function loadCadCard(sido){ // 시도 이름 전달 $.ajax({ type : "GET", url: "/cat_card_sido", //json 경로 // dataType: "json", data : {sido..

[15일 메이킹 프로젝트] #13일차 개발일지

서울 # api data 함수 def api_data(sido): global all_cat_id global all_sido global all_notice_day global all_notice_num global all_cat_img global all_cat_feature global all_cat_color global all_cat_weigth global all_cat_gender global all_care_name global all_care_tel global all_care_addr all_cat_id = [] # '유기번호' all_sido = [] # '지역' all_notice_day = [] # 공고일 all_notice_num = [] # 공고 번호 all_cat_img = ..

[15일 메이킹 프로젝트] #11일차 개발일지

목차 1. 시작의 한마디 2. 오늘의 목표 3. 회의 내용 4. 업무 이슈/고민 & 해결 5. Next up 1. 시작의 한마디 11일차.. 최종 목표까지 D-4일, 실질적인 시간을 따지면 1~2일내에 마무리짓고 서버 배포를 해야함. 2. 오늘의 목표 1. 로그인, 로그아웃 Ajax 2. Open API 데이터 Ajax 연결 3. vs code 파이썬 연동 서버연결 4. 자바스크립트 기본 문법 복습 3. 회의 / 작업 내용 1. 로그인, 로그아웃 Ajax - 결과적으로 아직 미완성이다. 로그인 기능은 대준님께서 작업해주셔서 서버와 연동되어 구동은 되어있는 상태. 문제는 기존 작업이 jinja2 문법을 사용해 작업된 백 위주의 작업이라, Ajax로 변환해서 작업해야할 필요가 있었음. Ajax와 자바스크립트..

[15일 메이킹 프로젝트] #10일차 개발일지

목차 1. 시작의 한마디 2. 오늘의 목표 3. 회의 내용 4. 업무 이슈/고민 & 해결 5. Next up 1. 시작의 한마디 벌써 10일차. 한 가지를 해결하면 또 다른 문제가 기다리고 있다 ㅜㅜ 2. 오늘의 목표 1. 모달창 구현 2. 로그인 기능 구현 3. 지역별 고양이 페이지 화면 사이즈 조정 3. 회의 / 작업 내용 1. 모달창 구현 - 모달창 css / html * 모달창 */ .modal { display: flex; height: 100%; width: 100%; position: fixed; justify-content: center; align-items: center; top: 0; } /* 모달창 배경 */ .modal__overlay { background-color: rgba(..

[15일 메이킹 프로젝트] #9일차 개발일지

목차 1. 시작의 한마디 2. 오늘의 목표 3. 회의 내용 4. 업무 이슈/고민 & 해결 5. Next up 1. 시작의 한마디 9일차~! 2. 오늘의 목표 1. 모달창 공부하기 2. 서버 연결하기, ver.01 만들기 3. CSS 단위 공부 3. 회의 / 작업 내용 1. 모달창 공부하기 - Vanila Js로 만드는 내용 공부 -> 내일 구현 2. 서버 연결하기, ver.01 만들기 - 백 서버 연결 - 지금까지 작업한 내용 Ver.01로 정리 3. CSS 단위 공부 - % : 너비의 몇 %인가? -> 기준(패딩값이 제외된 너비)가 있고, 기준의 몇%인지. - em : 상위 요소 폰트사이즈의 몇 배인가? (ex : 20em - 상위 폰트사이즈 x 20 = 240, 1em이 24인셈.) -rem : r:..

[15일 메이킹 프로젝트] #8일차 개발일지

목차 1. 시작의 한마디 2. 오늘의 목표 3. 회의 내용 4. 업무 이슈/고민 & 해결 5. Next up 1. 시작의 한마디 8일차~! 2. 오늘의 목표 1. 지역 세부페이지 - 자바스크립트 click 기능 , 고양이 카드 다듬기 2. API 데이터 연결 질문 3. LOGIN 기능에 대한 전반적인 내용 4. 깃헙 repository 새로 생성 3. 회의 / 작업 내용 1. 지역 세부페이지 - 자바스크립트 click 기능 , 고양이 카드 다듬기 - 자바스크립트 .click function을 이용해 세로 메뉴바 제작 - 고양이 카드가 붙을 수 있도록 html, css 작업 2. API 데이터 연결 질문 - https://www.data.go.kr/data/15001096/openapi.do < 이 API..

[15일 메이킹 프로젝트] #7일차 개발일지

목차 1. 시작의 한마디 2. 오늘의 목표 3. 회의 내용 4. 업무 이슈/고민 & 해결 5. Next up 1. 시작의 한마디 7일차. 컨디션 조절하며 진행하니 머리가 잘 돌아갔다. 충분한 수면을 취하고 고기를 먹을 것.. 2. 오늘의 목표 1.지역 세부페이지 html 뼈대작업 3. 회의 / 작업 내용 1. 지역 세부페이지 html 뼈대작업 - 내일 추가 수정할 요량으로 메뉴바와 카드를 만들었다. 사이즈를 %로 맞춰 놓았더니 화면을 줄이면 내용물이 두둥실 떠다닌다. 확대축소를 간과했음 > (수정할 것) 메뉴바 가로! 사이즈 변경, 고양이카드 디자인 예쁘게 변경 > (공부할 것) 자바스크립트로 click function. 도 이름을 클릭하면 시 이름이 사라지고, 다시 클릭하면 나타나게끔.. 2. 로그인 ..

[15일 메이킹 프로젝트] #6일차 개발일지

목차 1. 시작의 한마디 2. 오늘의 목표 3. 회의 내용 4. 업무 이슈/고민 & 해결 5. Next up 1. 시작의 한마디 벌써 6일차. 2. 오늘의 목표 1. 지역구분 페이지 배경 2. 지역 세부 페이지 레이아웃 작성 3. 나와 맞는 고양이 < 추가 4. 튜터링 3. 회의 / 작업 내용 1. 지역구분 페이지 배경 - 그라디언트 컬러를 민트색으로 설정. - 스크롤바 없앰. - 추후 hover 효과를 주어서 나타날 수 있게 하는 것도 좋을 듯. 2. 지역 세부 페이지 레이아웃 작성 - 좌측 세로 메뉴바 생성. - api 데이터가 붙을 수 있는 list html 작성 3. 나와 맞는 고양이 < 추가 - mbti 테스트처럼, 고양이 테스트 페이지를 추가. - 결과가 나오면 본 페이지로 진입할 수 있도록 ..

[15일 메이킹 프로젝트] #5일차 개발일지

목차 1. 시작의 한마디 2. 오늘의 목표 3. 회의 내용 4. 업무 이슈/고민 & 해결 5. Next up 1. 시작의 한마디 건강한 신체에 건강한 정신이 깃든다... 잠을 잘 자야 더 효율적으로 일할 수 있다(?) 2. 오늘의 목표 1. Nav-bar 별도로 분리 및 대문페이지 오류 해결 2. 정리된 폴더 공유 3. 지역구분 페이지 레이아웃 작업 4. 챗봇 구상 3. 회의 / 작업 내용 1. Nav-bar 별도로 분리 및 대문페이지 오류 해결 - 페이지별 공통 작업을 위해 네비게이션 바를 분리했다. 분리하는 과정에서 다른 분 컴에 있던 파일을 가지고 왔는데, 경로 오류가 났는지 잘 나오던 gif 이미지가 안보여서 애를 먹었다. 다른분들이 많이 도와주셔서 해결할 수 있었다. // live server로..