본문 바로가기

프로젝트_ 커피주문 서비스

레이아웃, Member 변경

  • 기존의 Member -> User 변경
  • User 컬럼 값 변경 (네이버 API로 받은 정보 저장을 위함)

  • 레이아웃 패키지 구조

패키지 구조

  • footer
<div class="nb-5 container-fluid">
    <hr>
    여기는 푸터
</div>

 

  • header
<!doctype html>
<html lang="en">
<head>
    <!-- Required meta tags -->
    <meta charset="utf-8">
    <meta name="viewport" content="width=device-width, initial-scale=1">

    <!-- Bootstrap CSS -->
    <link href="https://cdn.jsdelivr.net/npm/bootstrap@5.1.3/dist/css/bootstrap.min.css" rel="stylesheet" integrity="sha384-1BmE4kWBq78iYhFldvKuhfTAU6auU8tT94WrHftjDbrCEXSU1oBoqyl2QvZ6jIW3" crossorigin="anonymous">

    <title>Coffee SHOP</title>
</head>
<body>

<!-- navigation -->
<nav class="navbar navbar-expand-lg navbar-light bg-light">
    <div class="container-fluid">
        <a class="navbar-brand" href="/">Main</a>
        <button class="navbar-toggler" type="button" data-bs-toggle="collapse" data-bs-target="#navbarSupportedContent" aria-controls="navbarSupportedContent" aria-expanded="false" aria-label="Toggle navigation">
            <span class="navbar-toggler-icon"></span>
        </button>
        <div class="collapse navbar-collapse" id="navbarSupportedContent">
            <ul class="navbar-nav me-auto mb-2 mb-lg-0">
                <li class="nav-item">
                    <a class="nav-link" href="/best">BEST</a>
                </li>
                <li class="nav-item">
                    <a class="nav-link" href="/product">Product</a>
                </li>
                <li class="nav-item">
                    <a class="nav-link" href="/store">Store</a>
                </li>
            </ul>
            <!-- 로그인, 회원가입 -->
            <div align="right">
                {{#userName}} <!-- userName이 있을 경우 -->
                   {{userName}}님, 안녕하세요
                    <a href="/logout" class="btn btn-light active" style="color: white; text-decoration-line: none; color: gray">로그아웃</a>
                    <button class="btn btn-light"><a href="/myPage" style="color: white; text-decoration-line: none; color: gray">마이페이지</a></button>
                {{/userName}}
                {{^userName}} <!-- userName이 없을 경우 -->
                    <button class="btn btn-light"><a href="/signIn" style="color: white; text-decoration-line: none; color: gray">로그인</a></button>
                {{/userName}}

            </div>
        </div>
    </div>
</nav>

 

  • main, etc
--------------------main
{{>layouts/header}}
<h1>
    {{#userName}}
        {{userName}}님, 안녕하세요! 여기는 메인 페이지

    {{/userName}}


</h1>
{{>layouts/footer}}


--------------------best
{{>layouts/header}}
여기는 베스트 상품 페이지


--------------------product
{{>layouts/header}}

여기는 전체 상품 페이지


--------------------store
{{>layouts/header}}
여기는 지점 정보 페이지

 

  • login_ codepen.io
{{>layouts/header}}


<link rel="stylesheet" href="css/login.css">

<div class="wrapper">


    <form class="form-signin" method="post" action="/login">
        <h2 class="form-signin-heading">로그인</h2>
        <img src="images/coffee.png" width="510" height="287" style="margin-bottom: 20px" >
<!--        <input type="text" class="form-box" name="username" placeholder="아이디" required="" autofocus="" /> <br>-->
<!--        <input type="password" class="form-box" name="password" placeholder="비밀번호" required=""/> <br>-->

<!--        <button class="btn btn-lg btn-outline-secondary btn-block" type="submit" >로그인</button>-->
<!--        <button class="btn btn-lg btn-outline-secondary btn-block"><a href="/oauth2/authorization/google" style="color: gray; text-decoration-line: none;">Google Login</a></button>-->
        <button class="btn btn-lg btn-success btn-block"><a href="/oauth2/authorization/naver" style="color: white; text-decoration-line: none;">Naver Login</a></button>
    </form>


</div>

<!--
Copyright (c) 2022 by Ace Subido (https://codepen.io/ace-subido/pen/nLgWyj)

Permission is hereby granted, free of charge, to any person obtaining a copy of this software and associated documentation files (the "Software"), to deal in the Software without restriction, including without limitation the rights to use, copy, modify, merge, publish, distribute, sublicense, and/or sell copies of the Software, and to permit persons to whom the Software is furnished to do so, subject to the following conditions:

The above copyright notice and this permission notice shall be included in all copies or substantial portions of the Software.

THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY, FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM, OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE SOFTWARE.

-->

 

  • login.css_ codepen.io
body {
    background: #eee !important;
}

.wrapper {
    margin-top: 80px;
    margin-bottom: 80px;
    text-align: center;

}

.form-signin {
    width: 580px;
    padding: 15px 35px 45px;
    margin: 0 auto;
    background-color: #fff;
    border: 1px solid rgba(0, 0, 0, 0.1);
}

.form-signin-heading,
.checkbox {
    margin-bottom: 30px;
}

.checkbox {
    font-weight: normal;
}

.form-control {
    position: relative;
    font-size: 16px;
    height: auto;
    padding: 10px;
}
.form-box{
    position: relative;
    font-size: 16px;
    height: auto;
    margin-top: 10px;
    padding: 10px;
    width: 500px;
    border-color: gray;
    border-radius: 10px;
    border-width: 2px;
}
focus {
     z-index: 2;
 }


input[type="text"] {
    margin-bottom: -1px;
}

input[type="password"] {
    margin-bottom: 20px;
}

/*
<!--
Copyright (c) 2022 by Ace Subido (https://codepen.io/ace-subido/pen/nLgWyj)

Permission is hereby granted, free of charge, to any person obtaining a copy of this software and associated documentation files (the "Software"), to deal in the Software without restriction, including without limitation the rights to use, copy, modify, merge, publish, distribute, sublicense, and/or sell copies of the Software, and to permit persons to whom the Software is furnished to do so, subject to the following conditions:

The above copyright notice and this permission notice shall be included in all copies or substantial portions of the Software.

THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY, FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM, OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE SOFTWARE.

-->
 */

 

 

 

  • Member -> User Entity
package com.example.CoffeeShop.Entity;

import com.example.CoffeeShop.Entity.UserManage.Role;
import lombok.*;


import javax.persistence.*;

@AllArgsConstructor
@NoArgsConstructor
@Getter
@ToString
@Builder
@Entity
public class User {

    @Id
    @GeneratedValue(strategy = GenerationType.IDENTITY)
    private Long id;

    @Column
    private String token;        //네이버 토큰 값 ID

    @Column
    private String name;

    @Column
    private String birth;

    @Column
    private String phoneNum;

    //역할 추가
    @Enumerated(EnumType.STRING)
    @Column
    private Role role;

    public void patch(User user) {
        if (user.token != null) {
            this.token = user.token;
        }
        if (user.name != null) {
            this.name = user.name;
        }
        if (user.birth != null) {
            this.birth = user.birth;
        }
        if (user.phoneNum != null) {
            this.phoneNum = user.phoneNum;
        }

    }

    public String getRoleKey() {
        return this.role.getKey();
    }

    public Object update(String name) {
        this.name = name;

        return this;
    }

}

 

 

  • UserDto
package com.example.CoffeeShop.DTO;

import com.example.CoffeeShop.Entity.UserManage.Role;
import com.example.CoffeeShop.Entity.User;
import lombok.AllArgsConstructor;
import lombok.NoArgsConstructor;
import lombok.Setter;
import lombok.ToString;


@AllArgsConstructor
@NoArgsConstructor
@ToString
@Setter
public class UserDto {
    private Long id;
    private String token;
    private String name;
    private String birth;
    private String phoneNum;
    private Role role;

    public User toEntity() {
        return new User(id, token, name, birth, phoneNum, role);
    }
}

 

 

  • UserRepository
package com.example.CoffeeShop.Repository;

import com.example.CoffeeShop.Entity.User;
import org.springframework.data.jpa.repository.JpaRepository;
import org.springframework.data.jpa.repository.config.EnableJpaRepositories;

import java.util.Optional;

@EnableJpaRepositories
public interface UserRepository extends JpaRepository<User, Long> {

    //이미 있는 사용자인지 확인
    Optional<User> findByToken(String token);
}

 

 

  • Entity/UserManage/Role
package com.example.CoffeeShop.Entity.MemberManage;

import lombok.Getter;
import lombok.RequiredArgsConstructor;

@Getter
@RequiredArgsConstructor
public enum Role {

    GUEST("ROLE_GUEST", "손님"),
    USER("ROLE_USER", "일반 사용자");

    private final String key;
    private final String title;

}

 

 

  • data.sql
--product 더미데이터
INSERT INTO product(id, name, price, category) VALUES (1, '에스프레소', 4000, '커피');
INSERT INTO product(id, name, price, category) VALUES (2, '아메리카노', 4500, '커피');
INSERT INTO product(id, name, price, category) VALUES (3, '라떼', 4800, '커피');
INSERT INTO product(id, name, price, category) VALUES (4, '아이스티', 3800, 'Non 커피');
INSERT INTO product(id, name, price, category) VALUES (5, '우유', 2000, 'Non 커피');

--user 더미데이터
INSERT INTO user(id, token, name, birth, phone_num) VALUES (1,'aaa', '김일번', '1982', '010-1234-5678');
INSERT INTO user(id, token, name, birth, phone_num) VALUES (2, 'bbb', '문이번', '1994', '010-4321-8765');
INSERT INTO user(id, token, name, birth, phone_num) VALUES (3, 'ccc', '박삼번', '1990', '010-5678-1234');

--Store 더미데이터
INSERT INTO store(id, name, location) VALUES (1, '기흥점', '용인');
INSERT INTO store(id, name, location) VALUES (2, '둔전점', '용인');
INSERT INTO store(id, name, location) VALUES (3, '강남점', '서울');

--order 더미데이터
INSERT INTO orders(id, user_id, store_id, order_date) VALUES (1, 1, 1, current_timestamp);
INSERT INTO orders(id, user_id, store_id, order_date) VALUES (2, 2, 2, current_timestamp);
INSERT INTO orders(id, user_id, store_id, order_date) VALUES (3, 3, 3, current_timestamp);

--orderProduct 더미데이터
INSERT INTO order_product(id, order_id, product_id, total) VALUES (1, 1, 1, 4000);
INSERT INTO order_product(id, order_id, product_id, total) VALUES (2, 2, 3, 4800);
INSERT INTO order_product(id, order_id, product_id, total) VALUES (3, 3, 5, 2000);

 

  • Controller/MainController
package com.example.CoffeeShop.Controller;

import com.example.CoffeeShop.config.auth.DTO.SessionUser;
import com.example.CoffeeShop.config.auth.LoginUser;
import lombok.RequiredArgsConstructor;
import lombok.extern.slf4j.Slf4j;
import org.springframework.stereotype.Controller;
import org.springframework.ui.Model;
import org.springframework.web.bind.annotation.GetMapping;

import javax.servlet.http.HttpSession;

@Controller
@RequiredArgsConstructor
@Slf4j
public class MainController {


    //메인 페이지
    @GetMapping("/")
    public String main(Model model, @LoginUser SessionUser user) {
        if (user != null) {
            model.addAttribute("userName", user.getName());
        }
        if (user != null) {
            model.addAttribute("userToken", user.getToken());
        }

        return "coffeeShop/main";
    }

    //로그인 페이지
    @GetMapping("/signIn")
    public String login() {

        return "coffeeShop/login";
    }

    //베스트 상품 페이지
    @GetMapping("/best")
    public String best() {
        return "coffeeShop/best";
    }

    //모든 상품 페이지
    @GetMapping("/product")
    public String product() {
        return "coffeeShop/product";
    }

    //지점 정보
    @GetMapping("/store")
    public String store() {
        return "coffeeShop/store";
    }

}

 

 

 

GitHub - Pearlmoon997/CoffeeShop: CoffeeShop

CoffeeShop. Contribute to Pearlmoon997/CoffeeShop development by creating an account on GitHub.

github.com

 

 

  • 프로젝트 구조 변경으로 인해 바뀐 프로젝트 구조는 다음 화에!

'프로젝트_ 커피주문 서비스' 카테고리의 다른 글

주문하기 구현  (0) 2022.08.28
네이버 로그인 API (+구글 로그인 API)  (0) 2022.08.11
Store - Order 연결  (0) 2022.08.09
Store CRUD  (0) 2022.08.08
Order 삭제  (0) 2022.08.07