2021 01 08 금 TIL - 9

Today I Learned

• Javascript
• Node.js
• React

🚩Where they are..

• apple-clone : gitHub
  apple-clone in gitHub
• node : gitHub
  node in gitHub
• react-movie : gitHub
  react-movie in gitHub

Today Review

• apple-clone 에서 애니메이션을 사용할 때 유용하게 사용할것 같은 감속의 원리를 배웠다.

let acc = 0.1;
let delayedYOffset = 0;
let rafId;
let rafState; // loop가 스크롤 될 때만 적용

window.addEventListner('scroll', () => {
	if(!rafState) {
    	rafId = requestAnimationFrame(loop);
        rafState = true;
    }
})

function loop() {
	delayedYOffset = delayedYOffset + (pageYOffset - delayedYOffset) * acc;
    rafId = requestAnimationFrame(loop);
    rafState = true;
    if (Math.abc(pageYOffset - delayedYOffset < 1)) {
    	cancelAnimationFrame(rafId);
        rafState = false;
    }
}
loop();

• node.js 고유 아이디 부여하는 방법과 삭제 메소드 추가를 진행했다. 고유 아이디는 mongodb에 collection 하나를 따로 만들어서 관리했고 삭제 메소드는 jQuery의 $.ajax({}) 를 사용해서 진행했다. front - server - db 의 흐름에 대해서 생각해 보는 프로젝트인것 같다.
• react-movie 프로젝트에서는 axios를 사용하고 있다. 좀 더 체득화 시키려고 노력중이다.