본문 바로가기
반응형

Project/final

[9.16(토) 북스탁 프로젝트] 2차 멘토링 대대성공!! 칭찬일색 ~ 피드백 100% 수용했다!
Project/final 2023. 9. 19. [9.16(토) 북스탁 프로젝트] 2차 멘토링 대대성공!! 칭찬일색 ~ 피드백 100% 수용했다! 하.... 저저번주 1차 멘토링때 부족한 점을 너무너무 많이들어서 ㅠㅠㅠ 이번 2차 멘토링이 걱정되었는데 결과는 대성공!!ㅎㅎ 너무너무 기쁜마음에 당장 티스토리를 열어서 기록중이다> 도서 판매사이트와 차이점이 매우 많이 필요함 판매자들이 붙었을때 어떻게 해결할 것인가. 사진을 보고? 물건이 어디가 찍힌게 있다 이런정보가 필요함 2. WBS 빠르게 6일 이내로 해결해야함 타이트하게 상세하게 정리해야함 url정의서, 테이블 정의서, 화면 정의서 3. API를 어떻게 할 지 쓸지도 알아서 써놓고 빠르게 정리 해둘 것 4. 목업 페이지 보여주는점은 좋았음. 그려가면서 팀원간에 같은 목표를 가지고 진행 할 수 있도록 함 5. 역경매 시스템에 대한 고민이 너무 얕다 판매자가 책을 올려야 한다 -> 입력하는 정보가 ..
[9.15(금) 북스탁 프로젝트] 카카오 소셜로그인 구현 | 카카오 간편로그인API연결하기(node.js)
Project/final 2023. 9. 16. [9.15(금) 북스탁 프로젝트] 카카오 소셜로그인 구현 | 카카오 간편로그인API연결하기(node.js) 짜잔 부트스트랩을 한땀한땀 수정해서 만든 회원가입페이지이다. 드디어 조금 웹사이트같아졌다ㅎㅎ 요렇게 마우스를 올리면 노랑이로 바뀐다. 네이버 간편로그인도 연결해야하는데 카카오부터 ...하하 Node.js(백엔드 부분) const express = require('express'); const axios = require('axios'); 1. Express와 axios 모듈을 import한다. const app = express(); const port = 3000; 2. Express 애플리케이션을 생성하고 포트 번호를 설정한다. const KAKAO_OAUTH_TOKEN_API_URL = "https://kauth.kakao.com/oauth/token"; const KAKAO_USER_PROFILE..
[9.14(목) 북스탁 프로젝트] 도서 검색결과 페이지를 만들어보자 ~!
Project/final 2023. 9. 14. [9.14(목) 북스탁 프로젝트] 도서 검색결과 페이지를 만들어보자 ~! 일단 주요기능을 보여주기위해 간단하게 CSS를 만들었다. 백단까지 연결되면 예쁘게 만들어볼 예정이다~! 헤더의 검색창에서 도서명을 검색하면 현재 북스탁에 등록되어있는 경매건들이 검색되어진다. 지금의 데이터베이스에는 경매건이 등록되어있지않기 때문에 일단은 const [books, setBooks] = useState([ { id: 1, title: '어린왕자', coverImage: 'http://placeholder.com/50x70', startPrice: '11,000', updatePrice: '9,000', userId: '닉네임', startDate: '2023-09-12', endDate: '2023-09-27', views: 10, interest: 0 } ]); useState로 임의로 초..
[9.13(수) 북스탁 프로젝트] 로그인 상태관리 | useAuth, AuthContext, AuthProvider,
Project/final 2023. 9. 13. [9.13(수) 북스탁 프로젝트] 로그인 상태관리 | useAuth, AuthContext, AuthProvider, 헤더의 오른쪽 부분이다. 메인페이지에서 로그인을 안한 비회원일때는 SIGN UP버튼이 표시되고 로그인을 한 회원일 경우 MYPAGE버튼이 표시될 수 있도록 하는 기능을 구현하고자 한다. header const Header = function () { // 로그인 상태 저장 state // eslint-disable-next-line const [isLoggedIn, setIsLoggedIn] = useState(false); . . . { isLoggedIn ? ( MYPAGE ) : ( SIGN UP ) } isLoggedIn이 처음에는 false로 기본값 지정이 되어있어 signup버튼이 나오게 되고 로그인이 확인된 경우 true로 변경, mypage버튼이 나오게된다. signin const Sign..
[9.6(수) 북스탁 프로젝트 일지] 팀원의 하차, 메인페이지 목업제작, '역경매'에 포커스, 핵심을 잊지말자!!
Project/final 2023. 9. 6. [9.6(수) 북스탁 프로젝트 일지] 팀원의 하차, 메인페이지 목업제작, '역경매'에 포커스, 핵심을 잊지말자!! 좌 상단 헤더에 로고가 들어가고 가운데에 검색창 오른쪽에 순서대로 카테고리, 홈페이지, 마이페이지, 로그인/회원가입 아이콘을 삽입했다. 먼저 현재 진행중인 이벤트나 HOT경매, 컬렉션, 콜라보 등 회원들에게 다양한 정보를 제공할 슬라이드 배너부분을 부트스트랩을 사용해 구현했다. 그리고 아래에 현재 입찰수가 많이 이루어지고 있는 도서들을 보여줌으로써 북스탁에 대한 관심을 끌어모은다. 본문에 알고리즘을 활용한 추천 도서/ 실시간으로 업로드된(최신순) 경매 건을 보여준다거나 많은 의견이 있었지만 일단은 목업이고 중요 경매기능에 먼저 집중하기위해 최대한 단순화했다. 좋은 선택인 것 같다 ! 구매자,판매자가 제공해야할 정보를 적기 위해 API 조사 매너온도 시스템 → 책 페이지로 이미지화 네비게이션에 뭘 넣을까 ..
[9.5(화) 파이널 프로젝트의 시작] 북스탁, 도서 역경매 사이트 제작을 시작하다! 생각보다 어려운 기획단계,,
Project/final 2023. 9. 4. [9.5(화) 파이널 프로젝트의 시작] 북스탁, 도서 역경매 사이트 제작을 시작하다! 생각보다 어려운 기획단계,, 처음에는 희귀 절판도서 역경매 사이트로 구상했으나 수요자가 너무 적을 것으로 예상하여 중고 도서 거래 + 도서 역경매 사이트로 변경하였다. 내가 만든 우리 프로젝트의 로고이다! 깔끔한 폰트와 신뢰감을 주는 청록색 컬러. 도서 수집의 시작. 이라는 슬로건을 임의로 작성해 넣었는데 팀원들도 만족해주었다ㅎㅎ ++ 로고를 수정했다 ! 이것도 내가 만든 로고 후보들 ! 왼쪽도 상당히 맘에 들었는데 색상이 네이버가 떠오른다며 패스ㅠㅠ 오른쪽은 비트코인같다고ㅋㅋㅋㅋㅋㅋㅋ Stock 이 쌓다는 의미 라서 로고에 표현하고싶었다. 그래서 쌓아져있는 책을 넣었다. 개인적으로 맘에 들었는데 좀 직관적이지 않아서 패스했다ㅠㅠ 오른쪽은 은근 팀원들이 좋아했는데 휴,, 저 희귀.. 골드.. 를 표방한 색이 마음에 들지 않았다ㅎㅎ ..
반응형

티스토리툴바