유데미 프로젝트 캠프/과제

[유데미x스나이퍼팩토리] 10주 완성 프로젝트 캠프(프론트엔드) 7회차 과제 - Vanilla JS를 이용한 서비스 만들기(1)

yunieyunie 2023. 6. 22. 20:30

출처 : [유데미x스나이퍼팩토리] 10주 완성 프로젝트 캠프

🎯 제 요구사항

1. vanilla js로 배경이미지 랜덤 변경
2. vanilla js로 인사 만들기
3. vanilla js로 시계 만들기

 

 

 

🔥 결과

https://github.com/udemy-team18/practice/tree/yueun/0620

 

GitHub - udemy-team18/practice: 유데미 x 스나이퍼 팩토리 10주 완성 프로젝트 부트캠프 18팀 실습 저장소

유데미 x 스나이퍼 팩토리 10주 완성 프로젝트 부트캠프 18팀 실습 저장소. Contribute to udemy-team18/practice development by creating an account on GitHub.

github.com

 

 

 

🔎 느낀 점

랜덤 배경과 실시간 시계는 코드도 짧은 편이라 쉽게 구현했다.

이름을 입력받아 시간대별로 인사하는 부분이 생각보다 오래걸렸다.

local storage를 사용해서 새로고침을 해도 이름이 리셋되지 않도록 했다.

setItem으로 값을 입력받으면 getItem으로 값을 받아올 수 있으며 새로고침을 해도 이 값은 local storage에 저장되어 계속 다시 불러올 수 있다.

Todo List를 만들 때도 사용해야하니 잘 기억하자.

localStorage.setItem('name', 'yunie') //undefined

  localStorage.getItem('name') //yunie

 

https://developer.mozilla.org/en-US/docs/Web/API/Window/localStorage

 

Window: localStorage property - Web APIs | MDN

The localStorage read-only property of the window interface allows you to access a Storage object for the Document's origin; the stored data is saved across browser sessions.

developer.mozilla.org

 

 

 

 

 

 

 

—————————————————————————————————————————
본 후기는 유데미-스나이퍼팩토리 10주 완성 프로젝트캠프 학습 일지 후기로 작성 되었습니다.
—————————————————————————————————————————