220922 TIL

오늘 할 일

• 모달 창 닫기 버튼 만들기
• 메인화면 도장 get 요청으로 가져오기 (동영상 업로드 되면 찍혀서 유지되야한다. 현재는 값이 날아감)
• 로딩 스피너 화면 만들기
  - 어제 못한거 마무리 짓기
• 시간함수 적용하여 날짜가 지나가면 실패 모달창이 뜨게끔 해야함.

---

오늘 한 일 & 더 봐야 할 키워드

• lodash(알아보기) => 콜렉션 쓸 때 사용하면 편함. 알아둘 것.
• Moment -> day.js 로 바꿔쓰면 경량 라이브러리라서 더 좋음?
• Manifest 퍼블릭에서 스탠다드 온니일떄랑 아닐떄랑 다른거 보여주면 대충 된다 그거 웹이랑 모바일 환경일떄랑.
  디스플레이 넓이를 재서 일정 크기 보다 작을 시 모바일 보여주게끔 설정하면 됨.
  js 디바이스 width 검색해보면 화면 사이즈 별로 되는거? 뭐 대충 가능
• 전역관리 리덕스 값 날리는법
  resetstate () => initialstate,
• 로딩페이지 느낌 <suspense> , lazy() SSR,CSR 공부..

const [number, setNumber] = useState(60);
const number_ref = useRef(60);

useEffect(() => {
const loop = setInterval(() => {
number_ref.current -= 1;
setNumber(number_ref.current);
if (number_ref.current === 0) clearInterval(loop);
}, 1000);
}, []);

타이머 함수 코드

 

const today = new Date();
const selectedDay = new Date("2022.09.23");

console.log(today.getTime() - selectedDay.getTime() > 0 ? "지나지 않은 날짜입니다." : "지난 날짜입니다.");

지난날짜 체크함수

 

https://velog.io/@sunky97/useInterval-%EC%82%AC%EC%9A%A9%ED%95%B4%EC%84%9C-%ED%83%80%EC%9D%B4%EB%A8%B8-%EB%A7%8C%EB%93%A4%EA%B8%B0

useInterval 사용해서 타이머 만들기

 

 

https://kyounghwan01.github.io/blog/React/container-presenter-dessign-pattern/#presentational-container-%E1%84%83%E1%85%B5%E1%84%8C%E1%85%A1%E1%84%8B%E1%85%B5%E1%86%AB-%E1%84%91%E1%85%A2%E1%84%90%E1%85%A5%E1%86%AB%E1%84%8B%E1%85%B5%E1%84%85%E1%85%A1%E1%86%AB

React.js - presentational & container 디자인 패턴