SpringBoot와 Vue, uniapp을 활용한 음식 공유 플랫폼의 설계 및 구현

기술 스택

백엔드 프레임워크: Spring Boot

Spring Boot는 내장된 Tomcat, Jetty, Undertow 서버를 포함하고 있어 별도 설치 없이 사용 가능합니다. 자동 설정 기능은 프로젝트의 의존성에 따라 애플리케이션을 자동으로 구성하여 설정 과정을 간소화합니다. 또한 Spring Data, Spring Security, Spring Cloud 등의 기능과 플러그인을 제공해 개발 속도를 높이고 다른 기술과의 통합을 용이하게 합니다.

프론트엔드 프레임워크: Vue.js

Vue.js는 가상 DOM 기술을 핵심으로 하며, 반응형 데이터 바인딩, 컴포넌트화 등을 통해 효율적인 UI 업데이트를 지원합니다. 이를 통해 개발자는 데이터 처리에 집중할 수 있으며, 코드 유지보수가 용이합니다.

영속성 프레임워크: MyBatis-Plus

MyBatis-Plus는 MyBatis의 확장 도구로, 다양한 데이터베이스를 지원하며 ORM 작업을 단순화합니다. 코드 생성기를 통해 엔티티 클래스, Mapper 인터페이스, XML 매핑 파일을 자동 생성할 수 있어 개발 효율성이 향상됩니다. 또한 분할 쿼리, 동적 쿼리, 최적화 잠금 등 유용한 기능을 제공합니다.

시스템 테스트

시스템 테스트는 여러 각도에서 시스템의 문제점을 발견하고 수정하는 것을 목표로 합니다. 기능 테스트를 통해 시스템의 결함을 찾아내고 수정하여 요구 사항에 맞게 만듭니다.

로그인 기능 테스트 예제

입력 데이터예상 결과실제 결과결과 분석
사용자명: admin, 비밀번호: 123456, CAPTCHA: 올바른 입력시스템 로그인 성공로그인 성공예상 결과와 일치
사용자명: admin, 비밀번호: 111111, CAPTCHA: 올바른 입력비밀번호 오류비밀번호 오류 메시지 출력예상 결과와 일치

사용자 관리 기능 테스트 예제

입력 데이터예상 결과실제 결과결과 분석
필수 정보 입력사용자 추가 성공사용자가 리스트에 나타남예상 결과와 일치
기존 사용자 이름 입력사용자 중복 오류사용자 중복 오류 메시지 출력예상 결과와 일치

코드 예제

@IgnoreAuth
@PostMapping("/login")
public ResponseEntity<Map> login(@RequestParam String username, @RequestParam String password, @RequestParam String captcha) {
    User user = userService.findByUsername(username);
    if (user == null || !user.getPassword().equals(password)) {
        return ResponseEntity.status(HttpStatus.UNAUTHORIZED).body(Collections.singletonMap("error", "Invalid credentials"));
    }
    String token = tokenService.createToken(user.getId(), username, "users", user.getRole());
    return ResponseEntity.ok(Collections.singletonMap("token", token));
}

public class TokenService {
    public String createToken(Long userId, String username, String tableName, String role) {
        Token token = tokenRepository.findByUserIdAndRole(userId, role);
        String newToken = RandomStringUtils.randomAlphanumeric(32);
        Calendar cal = Calendar.getInstance();
        cal.setTime(new Date());
        cal.add(Calendar.HOUR_OF_DAY, 1);
        if (token != null) {
            token.setToken(newToken);
            token.setExpirationTime(cal.getTime());
            tokenRepository.save(token);
        } else {
            tokenRepository.save(new Token(userId, username, tableName, role, newToken, cal.getTime()));
        }
        return newToken;
    }
}

데이터베이스 예제

CREATE TABLE token (
    id BIGINT AUTO_INCREMENT PRIMARY KEY COMMENT 'Primary Key',
    user_id BIGINT NOT NULL COMMENT 'User ID',
    username VARCHAR(100) NOT NULL COMMENT 'Username',
    table_name VARCHAR(100) DEFAULT NULL COMMENT 'Table Name',
    role VARCHAR(100) DEFAULT NULL COMMENT 'Role',
    token VARCHAR(200) NOT NULL COMMENT 'Token',
    created_at TIMESTAMP DEFAULT CURRENT_TIMESTAMP COMMENT 'Creation Time',
    expired_at TIMESTAMP DEFAULT '0000-00-00 00:00:00' COMMENT 'Expiration Time'
);

INSERT INTO token (user_id, username, table_name, role, token, created_at, expired_at) VALUES 
(1, 'admin', 'users', 'admin', 'random_token_1', NOW(), DATE_ADD(NOW(), INTERVAL 1 HOUR)),
(2, 'user1', 'users', 'user', 'random_token_2', NOW(), DATE_ADD(NOW(), INTERVAL 1 HOUR));

태그: SpringBoot Vue.js MyBatis-Plus java WebDevelopment

6월 18일 00:43에 게시됨