ETC -

스티커 메모 앱(Sticky Notes App)

  • -

👉🏻스티커 메모 앱(Sticky Notes App)

안녕하세요 TriplexLab 입니다.
이번에는 브라우저에서 스티커 메모장을 만들어 보겠습니다.
이번 포스트는 dcode라는 외국 유튜버를 보고 참고 했습니다.

👉🏻로직의 차이점

위에 외국인 dcode 유튜브의 코드와 저의 코드에는 약간의 차이점이 있습니다.
main.js에서 그 차이점을 볼수 있습니다.
1. javascript의 class 문법을 사용해서 구조화 시킴.(외국인 유튜브는 함수형으로 만듬)
2. Template literals를 사용 (외국인 유튜브는 document.createElement를 사용)
3. UI 측면으로 삭제 휴지통 버튼을 제공(외국인 유튜브는 더블클릭을 해야지 삭제 가능)

👉🏻소스코드 공유

👉🏻파일 공유

작업한것 파일 공유합니다.
다운로드 받으셔서 한번 테스트 해보세요~

stickyNotesApp.zip
0.01MB

👉🏻최종 완성 본

다음은 최종 완성 본 입니다.
한번 들어오셔서 각자 간단한 메모를 기록해 보세요~

 

나만의 스티커 메모장

+ 버튼을 클릭하면 스티커 메모장이 생성됩니다. 자유롭게 추가, 수정, 삭제가 가능합니다.

younhoso.github.io

 

Contents

포스팅 주소를 복사했습니다

이 글이 도움이 되었다면 공감 부탁드립니다.