ESLint ESLint는 ECMAscript/javascript 코드에서 발견되는 패턴을 식별하고 보고하기 위한 도구로, 코드의 일관성과 버그 방지를 목표로 합니다Setupnpx expo lintEnvironment configurationExpo 앱의 경우, javascript 소스 코드가 여러 다른 환경에서 실행되기 때문에, ESLint 구성이 복잡해질 수 있습니다.이를 위해 ESLint에게 각 파일이 어떤 환경에서 동작하는지 알려줄 필요가 있습니다예를 들어, Node.js 환경에서 동작한다면 :/* eslint-env node */Run lint 규칙 위반 사항이 출력됩니다 npm run lintPrettier Prettier는 코드 스타일을 자동으로 일관되게 유지해주는 코드 포맷터입니다setup..

자바스크립트 이벤트(event)는 웹페이지에서 사용자가 어떤 행동을 할 때 발생하는 신호라고 생각하면 됩니다. 예를들어, 버튼을 클릭하거나 키보드 키를 누르거나, 화면을 스크롤 하는 등의 이벤트가 발생할 수 있습니다.이때 자바스크립트는 이러한 이벤트를 감지 할 수 있습니다이벤트를 등록하는 3가지 방법인라인 (Inline) HTML 속성에 직접 등록하기 onclick, onmouseover 와 같은 속성클릭이 방법은 간단하지만, HTML과 자바스크립트 코드가 섞여 복잡성이 증가할 수 있어 권장되지 않습니다Property Listener 자바스크립트 코드로 등록하기 element.onclick   const button = document.getElementById("myButton");button.oncl..

시작하기 앞서.HTML5에서 도입된 데이터 속성(data-)은 HTML 요소에 추가적인 정보를 저장할 수 있게 해주는 속성입니다이 속성은 렌더링 과정에서 무시되지만, JavaScript를 통해 동적으로 데이터를 처리하는 데 매우 유용합니다데이터 속성의 특징.렌더링에 영향을 미치지 않는다:data-로 시작하는 속성은 HTML 문서가 렌더링될 때 화면에 표시되지 않습니다. 즉, 이 속성 자체는 웹 페이지의 UI에 영향을 주지 않지만, JavaScript에서 이를 참조하여 다양한 기능을 구현할 수 있습니다.HTML 요소에 추가적인 정보를 저장:data-* 속성은 개발자가 특정 HTML 요소에 임의로 데이터를 저장하고, JavaScript를 통해 그 데이터를 사용할 수 있게 해줍니다.구현할 내용.호랑이사자펭귄#..

.textContent & .innerHTMLh2.textContent = "Feedback"h2.innerHTML = "Feedback"textContent : Feedback 요소가 화면에 노출이 됩니다innerHTML : 태그안에 텍스트만 반환되게 됩니다.setAttribute & .removeAttributeh2.setAttribute('class', "red");h2.removeAttribute("class"); removeAttribute("class") : ("삭제할 속성")setAttribute('class', 'item') : ("부여해줄 속성", "속성 이름")HTML 요소 스타일링h2.style.color = "red"h2.classList.add('red');// css.red { ..