본문 바로가기

전체 글110

쇼핑몰 구현 3 - db설계 -- 사용자 테이블 CREATE TABLE members ( member_id INT AUTO_INCREMENT PRIMARY KEY, email VARCHAR(255) NOT NULL, password VARCHAR(255) NOT NULL, name VARCHAR(100), membership VARCHAR(50), --사용자인지 관리자인지 확인하기 위해 PRIMARY KEY (member_id) ); -- 상품 테이블 CREATE TABLE items ( item_id INT AUTO_INCREMENT PRIMARY KEY, name VARCHAR(255) NOT NULL, description TEXT, size VARCHAR(100), tip VARCHAR(100), delivery_price .. 2024. 1. 31.
쇼핑몰 구현 1 - 주요기능 1. 제품 목록 등록한 순으로 모든 베이커리 제품 표시 특정 카테고리 누르면 해당 카테고리에 해당하는 제품들만 표시 2. 제품 상세정보 제품 설명, 크기, 가격, 배송비 정보 포함 상품 상세페이지에서 장바구니, 위시리스트에 추가하거나 바로 구매 가능 리뷰 버튼 클릭하면 해당 제품에 관한 리뷰 리스트 표시, 글쓰기 버튼 누르면 해당 제품에 대한 리뷰 작성 가능 q&a 버튼 클릭하면 해당 제품에 관한 q&a 리스트 표시, 글쓰기 버튼 누르면 해당 제품에 대한 q&a 작성 가능, 해당 글은 마이페이지에 문의하기 리스트에서도 볼 수 있음 3. 위시리스트 찜하기 누른 상품들 모두 표시 상품 상세페이지에서 찜하기 버튼 한번 누르면 위시리스트에 담기고 한번 더 누르면 위시리스트에서 삭제 4. 장바구니 장바구니에 담은.. 2024. 1. 31.
쇼핑몰 구현 2 - UI설계 1. 메인 페이지 2. 상품 상세 페이지 3. 회원가입 페이지 4. 로그인 페이지 4. 주문 페이지 5. 마이페이지 - 주문 내역 6. 마이페이지 - 찜한 상품 7. 마이페이지 - 장바구니 8. 마이페이지 - 내정보 9. 마이페이지 - 배송지변경 10. 마이페이지 - 문의하기 11. 마이페이지 - 글쓰기 2024. 1. 31.
AJAX AJAX 란? 자바스크립트를 이용하여 비동기식으로 서버와 통신 event 발생 시 전체 페이지를 새로 고치지 않고도 페이지 일부만을 업데이트 할 수 있음 서버와 통신하기 위해 XMLHttpRequest 객체 사용 작동 방식 웹 페이지 이벤트 발생 ( 페이지 로딩, 버튼 클릭 등) XMLHttpRequest 객체가 javaScript에 의해 생성 XMLHttpRequest 객체가 웹 서버에 request 전송 서버가 해당 request를 진행한 후 웹페이지에 response 보냄 response를 javascript가 읽음 javascript가 응답에 상응하는 action을 동작 시킴 AJAX 사용법 $(document).ready(function(){ $.ajax({ type: //데이터 전송 타입, u.. 2024. 1. 29.
XMLHttpRequest XMLHttpRequest: 서버와 상호작용하기 위한 객체로 웹페이지가 전부 로딩된 후에도 서버에 데이터를 요청하거나 서버로부터 데이터를 전송받을 수 있다. 사용방법 1. XMLHttpRequest객체 생성 const XHR = new XMLHttpRequest(); 2. open() 메서드로 요청에 필요한 정보 설정 XHR.open(method, url, [async, user, password]); method - HTTP 요청 메서드 url - 요청을 보낼 URL async - true인 경우 비동기식으로 동작 - false인 경우 동기식으로 동작하며 send메서드로 요청을 보냈을 때 응답을 받을 때까지 반환 결과 없음 user & password - 기본 HTTP 인증을 위한 로그인 및 비밀번호 .. 2024. 1. 29.
content-type HTTP 통신에서 전송되는 데이터 타입을 나타내는 header 정보 중 하나이며 content-type에 따라 데이터를 받는 측에서 데이터를 어떻게 처리해야 할지 판단한다. 특징 content-type 없이 보낼 경우 data를 받는 쪽에서는 단순텍스트 데이터로 받는다. content-type은 데이터를 보낼 때 해당 데이터의 타입을 나타내기 위해 쓰이므로 POST, PUT 처럼 Body에 data를 보낼 때 사용된다. HTTP 통신에서 Content-Type은 MIME 표준에 정의된 타입을 사용한다. 주로 사용되는 content-type 사용법 설명 text/plain 텍스트 파일의 기본 타입 text/javascript 자바스크립트 코드 application/json JSON 데이터 image/png.. 2024. 1. 29.