Code Monkey home page Code Monkey logo

trello-springmvc's Introduction

🌻 SpringMVC를 활용한 Trello 만들기

Spring Boot, Spring Data JPA, h2 database, Thymeleaf, Mustache

실행화면

  • 소셜 로그인 페이지
  • 메인 화면(로그인 완료 시)
  • 보드 추가 모달 창
  • 보드가 추가된 메인화면
  • 보드 상세보기 화면
    • 포켓과 카드가 추가된 화면
    • 포켓 추가 모달 창
    • 포켓 타이틀 변경
    • 카드 추가 모달 창
    • 카드 상세보기 모달 창
  • 드래그 앤 드롭

소셜 로그인 페이지

보드화면

  • OAuth2 인증을 이용해서 Google, Naver, Kakao 소셜 로그인 기능을 구현했습니다.

메인 화면(로그인 완료 시)

보드화면

  • 로그인을 완료 시, 해당 유저의 board를 보여줍니다.

보드 추가 모달 창

  • 보드의 타이틀과 배경 색상을 지정할 수 있습니다. 보드 추가 모달 창

보드가 추가된 메인화면

  • 수정 버튼을 클릭하여 보드의 타이틀, 색상을 변경할 수 있고, 삭제 버튼으로 삭제할 수 있습니다. 보드 추가된 메인화면

보드 상세보기 화면

보드 상세보기 화면

포켓과 카드가 추가된 화면

포켓 추가된 화면

포켓 추가 모달 창

포켓 추가 모달 창

포켓 타이틀 변경

포켓 타이틀 변경

카드 추가 모달 창

카드 추가 모달 창

카드 상세보기 모달 창

카드 상세보기 모달 창

드래그 앤 드롭 기능

  • 포켓과 카드를 드래그 앤 드롭하여 위치를 옮길 수 있습니다. 드래그 앤 드롭

trello-springmvc's People

Contributors

iseunghan avatar

Watchers

avatar avatar

Recommend Projects

  • React photo React

    A declarative, efficient, and flexible JavaScript library for building user interfaces.

  • Vue.js photo Vue.js

    🖖 Vue.js is a progressive, incrementally-adoptable JavaScript framework for building UI on the web.

  • Typescript photo Typescript

    TypeScript is a superset of JavaScript that compiles to clean JavaScript output.

  • TensorFlow photo TensorFlow

    An Open Source Machine Learning Framework for Everyone

  • Django photo Django

    The Web framework for perfectionists with deadlines.

  • D3 photo D3

    Bring data to life with SVG, Canvas and HTML. 📊📈🎉

Recommend Topics

  • javascript

    JavaScript (JS) is a lightweight interpreted programming language with first-class functions.

  • web

    Some thing interesting about web. New door for the world.

  • server

    A server is a program made to process requests and deliver data to clients.

  • Machine learning

    Machine learning is a way of modeling and interpreting data that allows a piece of software to respond intelligently.

  • Game

    Some thing interesting about game, make everyone happy.

Recommend Org

  • Facebook photo Facebook

    We are working to build community through open source technology. NB: members must have two-factor auth.

  • Microsoft photo Microsoft

    Open source projects and samples from Microsoft.

  • Google photo Google

    Google ❤️ Open Source for everyone.

  • D3 photo D3

    Data-Driven Documents codes.