yisu-kim / pre-onboarding-paywork

서버와 통신하는 투두 리스트 앱

프리온보딩 코스 Paywork 기업 과제

View Web Demo

📋 과제 요구사항 보기

서버

• 서버 URL이 있다는 가정으로 진행해주세요

• Base URL (해당 서버 주소는 작동하지 않는 서버입니다)

  http://dummy-server.io/

유의 사항

• ts+react 웹 사이트 혹은 react-native 앱 개발 (react-native도 ts 가능)
• function 단위로 주석 설명
• 디자인 등 따로 설명이 없는 부분은 본인의 재량에 맡깁니다
• redux + redux-saga 사용
  • react-native, redux 모두 처음 시도하여 어려움이 있는 경우, Async storage를 사용 가능하나 감점 있음

요구사항

1. POST 생성

   • URL

     ../todo

   • request

     {
       "content": "string"
     }

   • response (200)

     {
       "msg": "string"
     }

2. GET 리스트 불러오기

   • URL

     ../todo

   • request

     {}

   • response (200)

     {
       "count": 2, //integer
       "todoList": [
         {
           "id": "string",
           "content": "string",
           "isCheck": true, //boolean
           "createdAt": "2021-05-26T11:51:05.097Z"
         },
         {
           "id": "string",
           "content": "string",
           "isCheck": false, //boolean
           "createdAt": "2021-05-26T16:15:25.729Z"
         }
       ]
     }

3. POST 수정

   • URL

     ../todo/:id

   • request

     {
       "content": "string"
     }

   • response (200)

     {
       "msg": "string",
       "content": "string"
     }

4. POST 체크

   • URL

     ../todo/:id

   • request

     {
       "isCheck": true //boolean
     }

   • response (200)

     {
       "msg": "string"
     }

5. POST 삭제

   • URL

     ../todo/:id

   • request

     {}

   • response (200)

     {
       "msg": "string"
     }

About The Project

Todo 목록 조회

Todo 생성

Todo 수정 완료/취소

Todo 체크

Todo 삭제

Built With

• React Native (expo)
• TypeScript
• Redux
• Redux-Saga
• axios

Getting Started

Prerequisites

• expo 설치

  npm install -g expo-cli

• Android Studio 설치

• Android Debug Bridge(adb) 설치 확인

• Android Emulator 생성

Installation

To install packages:

yarn install

To serve the app:

yarn run android

Features

• My JSON Server로 mock 서버 구성
• Todo REST API 구현
  • Todo 생성

    POST /todo
    

  • Todo 목록 조회

    GET /todo
    

  • Todo 수정(체크)

    PATCH /todo/:id
    

  • Todo 삭제

    DELETE /todo/:id
    

• redux로 전역 상태 관리
• redux saga 미들웨어로 mock 서버와 비동기 작업 처리

Additional Features

• 데모 확인을 쉽게 하기 위해 웹 배포