자바스크립트5 스크롤시 투명한 배경에서 배경색 넣기(feat. 화살표 클릭 시 맨 위로 이동하기) 스크롤시 투명한 배경에서 배경색 넣기bg에 이미지를 넣어놔서 처음 헤더를 transparent로 설정해줬다.메인 화면의 내용이 많아질수록 스크롤이 생길텐데 스크롤 하면 헤더에 배경색을 설정해줘서 내용이 겹쳐지는 현상을 방지해야 했다.✨ 스크롤시 투명한 배경 → 색 넣기const scrollStyle = { base: 'bg-transparent text-black', scroll: 'bg-black text-white',}export default function Header() { const [scrollPosition, setScrollPosition] = useState(0) useEffect(() => { const handleScroll = () => { setScrollP.. 2024. 7. 27. [모던 리액트 Deep Dive] 1장. 리액트 개발을 위해 꼭 알아야 할 자바스크립트 https://github.com/Study-FE-Techbook/Modern-React-Deep-Dive GitHub - Study-FE-Techbook/Modern-React-Deep-Dive: 모던 리액트 딥다이브 스터디모던 리액트 딥다이브 스터디. Contribute to Study-FE-Techbook/Modern-React-Deep-Dive development by creating an account on GitHub.github.com 리액트 책 속으로 들어가며…🥹리액트 왜 씀?왜 리액트가 지난 몇 년간 많은 개발자들이 선호하는 라이브러리가 됐을까?단방향 바인딩만약 양방향으로 바인딩되면 뷰의 변화가 컴포넌트에 영향을 미칠 수도, 반대로 컴포넌트의 상태가 변경되면 뷰의 상태도 변할 수 있다.. 2024. 6. 27. 타입스크립트 왜 씀? 자바스크립트에 익숙해질 쯤... 갑자기 타입스크립트가 내 인생에 들어왔다..타스 강의 들으면서 느낀점) 엥 이거 왜 쓰지.. 너무 불편하다 자스가 더 편한데 왜 타스 쓰지? 라는 생각밖에 안 들었다. 도대체 왜!!!! 개발자들이 타입스크립트는 쓰는가...에 의문을 품고 끄적여본다.. 👊🏻❓타입스크립트가 뭔데타입스크립트는 마이크로소프트에서 개발한 자바스크립트의 상위 확장자(Superset) 프로그래밍 언어타입스크립트는 자바스크립트에 정적 타입 시스템을 추가하여 개발자의 생산성과 코드 품질을 높이는 것을 목표로 한다.실행 전 검사를 통해 타입 안정성 확보한다.자동으로 변수의 타입을 추론한다.👊🏻자바스크립트 VS 타입스크립트1. 타입 시스템자바스크립트: 동적 타입 언어로, 변수의 타입을 명시적으로 정의.. 2024. 5. 23. 비동기 처리 방법 3가지 !비교! ❓비동기 처리(asynchronous processing)프로그램이 작업을 시작한 후에 완료되기를 기다리지 않고 다른 작업을 계속 수행할 수 있게 해주는 프로그래밍 기법✨비동기 처리 방법 3가지1. 콜백가장 기본적인 비동기 처리방식 비동기 작업을 완료한 후 호출되는 함수 여러 개의 중첩된 콜백을 사용하면 가독성이 떨어짐setTimeout(), 이벤트 처리 함수 등…function fetchData(callback) { setTimeout(() => { callback("data received"); }, 1000);}fetchData((data) => { console.log(data); // "data received"});2. Promise콜백 지옥과 같은 문제를 해결하기.. 2024. 5. 20. 이벤트 루프와 태스크 큐 ❓자바스크립트를 멀티 스레드처럼 사용하는 방법이 뭔가요? 이벤트 루프에 대해서 설명해주세요.위의 면접 질문을 받고 새하얗게 기억잃은 나... 뭣도 모르고 자바스크립트 면접 내용 달달 외워서 갔던 나...를 반성하며 이벤트 루프를 조지겠다는 생각으로 쥰내 파봤다.✨이벤트 루프와 브라우저 환경자바스크립는 싱글 스레드로 동작한다. 싱글 스레드: 한 번에 하나의 태스크만 처리한다는 뜻 비동기 로직은 이벤트 루프를 통해 처리된다.힙객체가 저장되는 메모리 공간콜 스택함수 호출 시 실행 컨텍스트가 생성된다.함수를 호출하면 실행 컨텍스트가 순차적으로 콜 스택에 푸시되어 순차적으로 실행된다. 단 하나의 콜 스택을 사용하기 때문에 최상위 실행 컨텍스트가 종료되어 콜 스택에서 제거되기 전까지는 다른 어떤 태스크도 실행하지 .. 2024. 5. 18. 이전 1 다음 반응형
