CASSIE'S BLOG

자바스크립트 코드는 "소스(Source)" 또는 "스크립트(Scripts)" 탭에서 확인할 수 있습니다. 이 탭에서는 웹 페이지에서 사용된 모든 스크립트 파일 및 인라인 스크립트의 내용을 확인할 수 있습니다. 일반적으로 주요 자바스크립트 파일은 "index.js" 또는 비슷한 이름을 가진 파일일 가능성이 높습니다. 따라서 "소스" 탭에서 "index.js" 파일을 찾아 해당 파일을 클릭하면 해당 파일의 코드를 볼 수 있습니다. 그러나 주의해야 할 점은 코드가 난독화되어 있거나 번들링된 경우에는 원래의 소스 코드보다 이해하기 어려울 수 있습니다. 몇몇 사이트에서는 보안상의 이유로 코드를 난독화하거나 번들링하여 사용할 수 있습니다. 번들링: 번들링은 여러 개의 파일을 하나로 묶거나 결합하는 프로세스를 의미합..

개발자도구>Source 탭을 들어가면 자바스크립트 코드를 볼 수 있다.

다크모드인지, 라이트모드인지 LocalStorage에 저장하기 LocalStorage는 브라우저에 값을 저장해주는 저장소입니다. 출처: https://swimfm.tistory.com/entry/JAVASCRIPT-%EC%9B%B9%EC%82%AC%EC%9D%B4%ED%8A%B8%EC%97%90-%ED%86%A0%EA%B8%80%EB%A1%9C-%EB%8B%A4%ED%81%AC%EB%AA%A8%EB%93%9C%EB%A5%BC-%EC%A0%81%EC%9A%A9%ED%95%98%EB%8A%94-%EB%B0%A9%EB%B2%95%EA%B3%BC-%EC%98%88%EC%A0%9C [JAVASCRIPT] 웹사이트에 토글로 다크모드를 적용하는 방법과 예제 여러 메이저 웹사이트에서 다크모드를 도입하고 있습니다. 이제..

"모바일에서 마우스를 호버할 수 있을까요? 터치 스크린과 전통적인 컴퓨터 간의 주요 차이 중 하나는 '호버' 상태의 부재입니다. 웹 사이트의 요소 위로 마우스를 가져가면 일반적으로 색상이나 스타일이 변경되어 클릭 가능함을 나타냅니다. 그러나 터치 스크린에서는 이러한 호버 상태를 복제할 방법이 없습니다."

https://www.figma.com/ Figma: The Collaborative Interface Design Tool Figma is the leading collaborative design tool for building meaningful products. Seamlessly design, prototype, develop, and collect feedback in a single platform. www.figma.com 프론트엔드 개발자라면, figma로 디자이너 서폿가능할 정도는 되야한다고 생각함

React-redux Store, Reducer 만들기 Provider로 감싸기 useSelector 컴포넌트에서 Action을 Dispatch하기 데이터를 관리하는 store store에 변화를 주는 Reducer 이제는 React-redux라는 상태관리라이브러리를 같이 사용한데 다른 개념이 아니라 그냥 리액트에서 리덕스 쓸 수 있게 만든 개념 ✅practice/5-5 checkout Summary ✅npm install redux react-redux 설치 ✅ npm start ✅ App.js 먼저 들어가면 Counter 컴포넌트 하나만 있어서 Counter 컴포넌트 들어가기 (껍데기만 있는 UI) import classes from './Counter.module.css'; const Counter..