웹개발/프로젝트 - 66Days (7) 썸네일형 리스트형 <프로젝트 1> habit tracker 웹페이지 만들기 - 7. 완성 총 정리 - 스파르타코딩클럽 후기 1. 프로젝트 설명 마음은 있지만 행동하기 어려운 당신을 위한 나만의 Habit Tracker! 당신에게 맞춤으로 습관을 정하고 하루하루 이뤄나가는 나를 확인해보세요! 아주 작고 구체적인 습관부터 시작한다면 나중에는 더 큰 습관도 이뤄나갈 수 있을 거예요 ;);) - 개인의 습관을 내가 스스로 이룰 기간의 단위와 제목을 정해 등록할 수 있게 만드는 habit tracker 2 . 동영상 & 사이트 이동 http://3.34.99.30/ 3. 구현 기능 login 페이지 - 회원가입 기능 : 아이디와 비밀번호를 db에 저장 - 로그인 기능 : 아이디와 비밀번호 세트를 db에서 존재 여부 확인 후 아이디를 세션에 저장 후 사이트의 메인으로 입장 main 페이지 - 각 페이지들로 이동하게 해주는 연결페이지 -.. <프로젝트 1> habbit tracker 웹페이지 만들기 - 6. 마무리 네 번째 기간: ~ 2020.07.01 드디어 계획했던 기능들을 다 구현해냈다. 저번에 해결하지 못했던 날짜를 자기 멋대로 지정해버리는 오류는 내가 momnet.js 라이브러리를 완벽하게 이해하지 못하고 얄팍하게 사용 중이라 이거에 대해 문제를 해결하기보다는 원래의 자바스크립트의 기본 제공 함수로 돌아가서 식을 다시 쓰는 것이 훨씬 빠르게 풀릴 것 같아 그렇게 했다. 이미 한번 써본 식이기도 하고 새로 쓴 함수들도 정리를 꽤나 깔끔하게 하려고 노력한 덕분인지 변수나 함수를 가져와서 쓰는 것도 한결 편해졌다. 역시 기본이 더 중요한 거 같다. 마무리 단계는 기능을 작게 세부로 쪼개는 과정이었다. 일 단위 습관 실행 날짜를 표현하는 부분에서도 원래 일주일의 첫째날에 도전이 실행되었다면 1 아니면 0 두 번째.. <프로젝트 1> habbit tracker 웹페이지 만들기 - 5. 거의 완성단계 까지 세 번째 기간 : ~2020.06.24 저번에 해결 못한 부분을 수업 때 질문으로 조금의 감이 잡혔다. 너무 날것의 데이터로 정보들을 만드는 것이 아니라 데이터들을 가지고 내가 원하는 형식의 새로운 리스트를 짜서 그 정보로 다시 불러오고 가공하는 것이다. 아;;; 역시 데이터를 다루는게 이번 프로젝트에서 나의 약점인 것 같다. 내가 지금 어떤 결과를 얻기 위해 함수 식을 짜는가를 정확히 알아야 하는데 그것이 애매하니까 함수 식까지 갈팡질팡하게 깔끔하게 못 나오는 것 같다. 튜터님께 조언을 받아 다시 원하는 데이터로 만들고 도전 달력 페이지의 본문을 작성하기 시작했다. 계속해서 반복문과 조건문을 이용해서 식을 짜다보니 정말 하나의 함수가 너어어어어어어어어무 길어졌다;;; 변수도 엄청 많아지고 변수에 변수들.. <프로젝트 1> habbit tracker 웹페이지 만들기 - 4. 본격적인 코딩 시작 두 번째 기간 : ~2020.06.17 api에 대한 계획을 짰으니 이제 본격적으로 코딩을 하기 시작했다. 수업 전까지는 전체적으로 데이터의 관련된 것이라기보다는버튼을 누르면 다른 페이지로 이동을 한다던지 아니면 도전을 입력하는 항목을 페이지에서 추가하거나 추가한 항목을 취소하는 등 데이터를 입출력하거나 가공하는 부분을 제외하고 그 전 단계의 기능들을 정비하는 시간이었다. 또한 수업 때 내가 궁금해 했던 이메일로 로그인하는 부분을 따로 배웠다. 서버에서 플라스크의 세션으로 유저가 처음 로그인 화면에서 입력한 이메일을 다른 페이지에서 유저가 입력한 정보와 함께 저장을 한다거나 아니면 또 다른 페이지에서 이메일로 그 이메일에 해당하는 자료만을 불러올 수 있게 된다. 확실히 내가 아는 어렴풋한 로그인의 개념과.. <프로젝트 1> habbit tracker 웹페이지 만들기 - 3. html, css 완성 및 api 설계 첫 번째 기간 : 2020.06.11 ~ 06.15 첫 주의 첫 번째 기간에는 html, css 를 완성시켰다. 아무래도 스파르타 코딩 클럽 수업에서는 프론트 보다는 백엔드 중심이기 때문이고 심지어 디자인적인 부분은 프론트엔드 개발자 의 일이기보단 웹 디자이너와 퍼블리셔의 영역으로 들어가서 거의 개념만 알고 자세히는 모르는 상태로 시작하기 때문에 보통 부트스트랩을 이용하기를 권장한다. 나도 처음에는 부트스트랩을 이용해서 만들어 봤으나 전공이 전공이니만큼 심미적 영역에서 쉽게 넘어가질 못했고 (ㅜㅜ ㅋㅋㅋㅋ) 그래서 결국 내가 직접 모든 걸 디자인하기 시작했다. 지금 하는 프로젝트의 본질이 디자인, html, css 로 시작되고 아니라 시간 투자를 길게 하고 싶진 않았기 때문에 아직도 마음에 안 드는 부분.. <프로젝트 1> habbit tracker 웹페이지 만들기 - 2. Todo List 기획을 제외한 3주간의 기간이 정해져 있는 프로젝트인 만큼 매 주의 계획을 구체적으로 짜는 것이 중요하다. 스파르타 코딩클럽 수업을 화요일, 목요일을 수강하기 때문에 매 수업마다의 구체적인 개발 내용을 적고 최소한 그 내용만큼은 지키고 더 나아가 추가로 진행해서 계획한 내용보다 계획 할 때 포기했던 내용도 이번 프로젝트에 함께 진행해보고 싶다. Todo List 0주차 ~2020.06.15 : 기획안 완성 & html, css 디자인, 기능 완성 1주차 ~2020.06.17 : 로그인 페이지 api 완성 & 프론트 연결 ~2020.06.22 : 새 도전 시작 페이지 에 도전을 추가하는 api 완성 & 프론트 연결 2주차 ~2020.06.24 : 데일리 체크리스트 3개 api 완성 & 프론트 연결 ~202.. <프로젝트 1> habit tracker 웹페이지 만들기 - 1. 기획 프로젝트 주제 정하기 이번 프로젝트에서 나의 목표는 '실용성'이 있는 웹페이지를 개발하는 것이다. 한번 만들고 끝이 아닌 이 이후에도 계속 쓸 수 있는 나에게 제일 도움이 되는 페이지를 제작하고 싶다. 그래서 고안해낸게 habbit tracker 페이지를 만드는 것이다. 매번 하고자 마음만 먹고 실행에 옮기지 않는 나라도 이런 페이지를 통해 매일 체크하고 기록을 남겨서 내가 얼마나 성취해 왔는지 결과를 보여주는 페이지가 있다면 조금이라도 더 실천에 옮기지 않을까? 하는 생각에 이 주제로 선정하게 되었다. 이번 프로젝트에서 나에게만이 아닌 타인에게도 보급해서 사용이 가능한 페이지를 만들고자 했기 때문에 처음 개발 외적인 디자인 부분에도 신경을 쓰고자 하는것이 이번 또 다른 소 주제이다. 프로젝트 기획안 원.. 이전 1 다음
