nr0617/deploy-wanted-pre-onboarding-frontend

프로젝트의 실행 방법

로그인하는 방법

1. 아이디가 있는 경우

• 배포 링크로 들어가서 email 형식의 아이디와 8글자 이상의 비밀번호를 입력하고 로그인 버튼을 누르다.

2. 아이디가 없는 경우

• 배포 링크로 들어가서 로그인 버튼 하단에 있는 회원가입페이지로 이동하는 링크를 누른다.
• email 형식의 아이디와 8글자 이상의 비밀번호를 입력하고 회원가입버튼을 누른다.

스케줄을 입력하는 방법

1. 페이지 상단에 있는 입력창에 스케줄을 입력한다.
2. 입력창 오른쪽의 추가하기 버튼을 눌러서 리스트에 스케줄을 추가한다.
3. 체크박스를 누르면 완료된 스케줄로 바뀐다.
4. 수정 버튼을 누르면 스케줄을 수정할 수 있다.
5. 삭제 버튼을 누르면 스케줄을 삭제할 수 있다.

로그아웃 하는 방법

1. 페이지 왼쪽 상단의 로그아웃 버튼을 누른다.

해당 프로젝트에서 사용한 라이브러리

1. create-react-app

• 웹팩, 바벨 등과 같은 개발에 필요한 환경설정을 자동으로 해준다.
• 뷰만 담당하는 react를 프레임워크처럼 사용할 수 있게 도와준다.

2. react-router

• 페이지 이동을 도와준다.
• SPA를 제작할 때 브라우저에서 사용자에게 보이는 부분을 변화시켜준다.

3. axios

• 외부에서 데이터를 가져올 때 사용하였다.
• http 요청을 할 때 인스턴스를 생성하여 함수 제작할 때 코드가 줄어드는 효과가 있다.
• fetchApi를 사용할 때는 데이터를 json으로 파싱해야하는 하지만 그 역할을 axios가 대신해준다.
• fetchApi에서는 response의 status에 따라 에러를 발생시키는 코드를 추가했었는데 axios는 추가하지 않아도 try-catch문에서 에러로 catch되었다. 에러핸들링이 fetchApi보다 수월했다.

배포 링크

• https://deploy-wanted-pre-onboarding-frontend.vercel.app/