📌Event를 알아야 하는 이유 1. input창에 값을 입력하고,엔터를 쳤을 때 지하철역을 리스트에 추가하고 싶다면? 2.삭제 버튼을 눌렀을 때 지하철 역을 삭제하고 싶다면? 3.인터렉티브한 사용자 경험을 만들고 싶다면? 위와 같은 이벤트를 유연하게 처리하게 위해서 우리는 반드시 이벤트를 알아야 한다. 동적인 웹은 사용자와 상호작용이 잘 되어야 한다. 그리고 그 상호작용은 어떤 이벤트에 의해 발생한다. 그래서 프론트엔드에서 많은 인터렉션은 모두 Event를 처리하는 것과 깊은 관련이 있다. 📌이 문서를 통해 얻어갈 것 📧이벤트 종류를 최소 3가지 이상 말할 수 있다. 📧DOM Element에 이벤트를 바인딩할 수 있다. 📧이벤트의 흐름을 제어할 수 있다 📧이벤트 종류를 최소 3가지 이상 말할 수 있다...
📌DOM을 알아야 하는 이유 자바스크립트를 이용해 html에서 데이터를 가져오고 싶다면? 웹페이지에 보여지는 데이터를 변경하고 싶다면? 인터렉티브한 웹어플리케이션을 만들고 싶다면? 단순히 정보를 보여주는 웹페이지가 아니라, 동적인 기능이 있는 웹어플리케이션을 만들고 싶다면, 문서를 조작할 수 있게 해주는 DOM을 알아야 합니다. 📌DOM : Document Object Model 지하철역을 동적으로 추가하는 것과 같이 웹페이지 문서를 조작하기 위해서 필수적으로 알아야 하는 것이 DOM이다. 여기서 document는 html을 뜻하며, 예를들어 파이어폭스,크롬 같은 브라우저들을 공장이라고 치자. 이 때 HTML 문서는 이 공장들에 보내는 주문서라고 할 수 있다. 이 주문서에는 내가 원하는 웹페이지의 요소들..
공식 문서에 따르면 axios의 정의는 다음과 같다. Axios는 브라우저, Node.js를 위한 Promise API를 활용하는 HTTP 비동기 통신 라이브러리입니다 일종의 자바스크립트에 내장되어 있는 fetch api와 유사한 기능을 하지만 차이점이 몇가지 있다. 그렇다면 axios의 장단점을 알아보기 위해 그 차이를 비교해보도록 하자 . 위의 표를 보았을 때 axios는 별도의 설치가 필요하다는 단점이 있지만 그것을 커버할 만한 fetch보다 많은 기능 지원과 문법이 조금이나마 간소화 된다는 장점이 있다는 것을 볼 수 있다. 참고 :https://kyun2da.dev/%EB%9D%BC%EC%9D%B4%EB%B8%8C%EB%9F%AC%EB%A6%AC/axios-%EA%B0%9C%EB%85%90-%EC..
getElementById()는 무엇인가? element = document.getElementById(id); id를 통해 엘리먼트를 반환한다. 만약 document에 구체적인 ID의 엘리먼트가 없다면 null을 반환한다. querySelector()는 무엇인가? element = document.querySelector(selectors); selector의 구체적인 그룹과 일치하는 document안 첫번째 엘리먼트를 반환한다. 일치하는게 없으면 null반환한다. querySelector vs selectElementById 위와 같은 코드가 있다고 가정해보자. 우리는 username 요소를 얻고 싶고 이를 변수에 할당하고 싶다. 첫번째로 getElemenyById를 통해 해보자! var userna..
JavaScript에서 insertAdjacentHTML innerHTML의 차이를 설명하기 전에, 먼저 innerHTML과 insertAdjacentHTML에 대해서 알아보겠습니다. 1) innerHTML innerHTML 속성은 JavaScript를 통해서 html의 content를 가져와서 그 값을 화면상에 보여주거나 직접 변경하여 보여주는 것을 말합니다. 다음의 예시를 보면 좀 더 이해하기 쉬울 겁니다. 1 2 3 4 5 6 7 I am a paragraph. Click the button get the HTML content of the p element. Try it Colored by Color Scripter cs 1 2 3 4 function myFunction() { var x = do..
다 똑같은 js인데 이 셋의 차이점이 뭘까 정확히 알아보기 위해 찾아보았다. 1.Vanilla-js -추가적인 라이브러리나 프레임워크가 없는 플레인한 javascript이다. 무방부제 무설탕과 같이 무라이브러리 무프레임워크라고 생각하며된다. 2.node.js -Javaxcript는 브라우저 안에서 산다. node.js는 javascript를 브라우저 밖으로 꺼낸 것이다. 사용자는 node.js를 사용하여 JS로 파일 시스템에 접근 할 수도 있고 서버도 만들수도 있다.
- Total
- Today
- Yesterday
- 항해플러스후기
- props
- vue3
- react
- React18v
- vue.js3
- 빅오표기법
- 로그인 인증
- 웹훅
- focus와blur
- 항해플러스프론트엔드
- Repository pattern
- store.js
- reactnative
- Vue.js
- 이벤트버스
- eventListner
- 디바운싱
- 알고리즘
- event종류
- 더미데이터
- http
- 이벤트리스너
- JWT토큰
- 항해솔직후기
- Vuex
- Http통신
- 레포지토리패턴
- useState
- loadbalancer
일 | 월 | 화 | 수 | 목 | 금 | 토 |
---|---|---|---|---|---|---|
1 | 2 | 3 | 4 | 5 | 6 | 7 |
8 | 9 | 10 | 11 | 12 | 13 | 14 |
15 | 16 | 17 | 18 | 19 | 20 | 21 |
22 | 23 | 24 | 25 | 26 | 27 | 28 |
29 | 30 |