Keep JSP Project

1. 프로젝트 개요

-JSP memo, todolist project
-Google Keep 메모 서비스를 본따 만들었으며
-추가적으로 Todo list 서비스를 제공합니다

2. 개발환경

• Springs Tools 4 for Eclipse
• Oracle 18c
• Tomcat 8.5
  
  

3. 사용기술

• OAuth2.0(카카오 로그인)
• Password 해쉬화(SHA-256)
• AJAX
• Bootstrap
  
  

테이블

CREATE TABLE person(
	id number primary key,  
    email varchar2(100) not null,
    personName varchar2(100) not null unique,
    password varchar2(100) not null,
    userProfile varchar2(200),
    createDate timestamp
) ;

CREATE TABLE reminder(
	id number primary key,
    personId number,
    title varchar2(100),
    content clob not null, 
    priority number default 0,
    createDate timestamp,
    foreign key (personId) references person (id)
);

CREATE TABLE memo(
	id number primary key,
    personId number,
    title varchar2(100),
    content clob not null, 
    priority number default 0,
    createDate timestamp,
    foreign key (personId) references person (id)
);

로그인 화면

-자바스크립트 이메일 양식확인
-쿠키로 이메일 기억하기 기능
-카카오 로그인 OAuth 2.0 기술

회원가입 화면

-패스워드가 일치하지 않으면 경고창이 뜨는 Bootstrap validation 추가
-이메일 중복확인
-회원가입시 password는 해쉬화(SHA-256)되서 데이터에 저장

회원수정 화면

-Email은 변경하지 못함(read only)

메인 화면 -Memo

-검색 기능
-hover 사용: 마우스 올리면 삭제아이콘, 수정버튼뜸
-AJAX 기술 사용 : 1.메모추가, 2.메모삭제, 3.메모 수정, 4.메모 우선순위
-체크 아이콘을 클릭하면 체크 아이콘이 빨간색으로 되면서 우선순위로 상단에 올라간다.

Todolist 화면

-검색 기능
-AJAX 기술 : 1.Todolist 추가, 2.Todolist 삭제, 3.Todolist 완료
-박스를 누르면 체크가 되면서 누르면 줄그인다

프로필 사진 업로드 화면

-이미지 파일 업로드해서 프로필에 저장(cos 라이브러리 사용)

시연 동영상 : ➡️ 링크