2번 미니프로젝트 완성!

[hoheesu]

📌 Grocery Bud 만들어보기

JS의 기초부터 심화까지 키우기위한 미니프로젝트 - 2

1조 미니프로젝트 뿌수기🦾

데모주소

데모를 여기서 보실수 있습니다.

기간

• 2022/11/24~2022/11/25

사용기술 스택

• Programming

요구사항

• 기본적인 CRUD가 가능해야합니다
• 모두 삭제 기능을 넣어보세요
• 드래그 앤드롭으로 순서를 바꿀수 있게 만들어보세요(그렇다면 3차과제가 쉬워질거같아요)
• 세션스토리지, 쿠키버젼도 만들수있으면 좋겠습니다(필수x)
• 알아서 멋지게 완성시켜보세요!

주의사항

• 유튜브 튜토리얼은 보지 않는걸 추천합니다. 결과물만 보고 동작을 유추해봅시다
• README.md를 꼭 작성해봅시다
• Git Flow 전략을 적용해봅시다
• Commit message는 최우영 강사님의 것을 따릅니다
• 별도의 폴더를 만들어서 pull request를 보냅니다
• 서로의 것을 열심히 코드리뷰하고 칭찬합시다!

배운점 🤔

• 로컬스토리지를 처음 다루기 때문에 객체로 넘어오는 데이터를 순서대로 정렬하는 방법!
• sortage.js를 이용해서 Drag & Drop 구현을 하는 방법!
• 생각을 구현하는 방식에서 많은 것을 배웠습니다!

어려웠던 점 😱

• 로컬스토리지에서 데이터를 불러올때 순서대로 정렬해서 렌딩하는 것.
• 개별list를 삭제하면서 로컬스토리지에서 불러올때 값이 생각처럼 넘어오지 않았던 점.
• sortageJs를 이용해서 Drag & Drop 구현을 했을때 바뀌는 index를 localStorage에 set & get하는 과정에서 생각처럼 구현이 되지 않아서 힘들었습니다
• netlify를 통해 배포하는 과정에서 Publish directory: dist/를 붙여야지 parcel build가 이루어진 점

[ghgt1]

오류수정해서 올리세요