/archisketch

과제테스트 레파지토리입니다.

Primary LanguageTypeScript

아키드로우 과제 테스트

👉 구현 목록

  • 이미지 hover 시 checkbox 와 menu 표시와 함께 mask 로 어둡게 표시
  • 반응형 레이아웃
  • 이미지 클릭시 해당 이미지의 DetailView 로 이동
  • 메인 갤러리의 좌측 상단 렌더샷 갯수 표시
  • 메인 갤러리에서 체크박스 선택시 좌측 상단에 체크한 이미지 갯수 표시
  • Detail뷰에서 다운로드 버튼을 누르면 이미지가 다운로드 되도록 구현
  • Detail뷰에서 화살표를 누르면 좌우로 이미지가 이동되도록 구현
  • Detail뷰에서 삭제 버튼을 누르면 Modal 표시
  • 삭제 Modal 에서 삭제를 누르면 해당이미지 삭제후 모달 제거
  • Detail뷰에서 닫기 버튼을 누르면 다시 메인 갤러리로 돌아오도록 구현

👉 기술

  • React
  • TypeScript
  • json-server
  • emotion
  • redux
  • axios
  • heroku

👉 프로젝트 설치 및 실행 ✨

  1. Git Clone
git clone https://github.com/som-syom/archisketch
  1. 프로젝트 패키지 설치
npm install
  1. 프로젝트 실행
npm run dev