STUDY35 JS 기초 보호되어 있는 글 입니다. 2023. 1. 7. 06. NPM NPM (Node Package Manager) 애플리케이션 2022년 3월 6일 dayjs.js 모듈 저장소라는 공간 공유를 하는 것 npm install 2022. 10. 14. 05. 동기와 비동기 동기는 기다리는 것 비동기는 기다리지 않는 것 무엇을 ? 답변 누가 좋다 나쁘다가 아니라 그냥 서로 다른 것이다. 수박을 들어서 트럭 앞에 있는 사람에게 던지는 역할을 합니다. 수박 앞에 있는 사람은 트럭에 차곡차곡 쌓는 역할을 한다. 동기 -> 수박을 잘 받았는지 답변을 받아야 일을 한다. 답변을 받기 전까지 다음 일은 하지 않는다. 상대방이 오케이! 실었어! 라고 답을 해야 그 다음 일을 한다. 동기식은 답변을 기다리는 것 비동기 -> 답변을 기다리지 않는 것 답변을 기다리지 않고 수박을 던진다. 동기와 비동기 답변을 기다리는게 동기 바로 일을 수행하는게 비동기 EX2_ 택배기사 동기 -> 물건을 가지고 갔을 때 택배 왔어요~! 라고 말을 하면 잘 받았어요 라고 말하면 그때서야 비로소 다음 일을 수행.. 2022. 10. 14. 03. 자바스크립트 파일 효과적으로 가져오기 btn이 null 인 것 버튼 tag 파싱 html 파싱이 된 후에 실행된다. 버튼을 누르면 경고창이 나온다. 이미지 100개를 가져오는데 html 파일이 다 끝난 후에 실행된다. async 속성 - HTML 파싱과 함께, 비동기로 자바스크립트 파일을 불러온다. html 파싱이 완료되지 않았더라도, 먼저 로딩되는 자바스크립트 파일부터 실행이 시작된다. 자바스크립트 파일을 실행할 때는 html 파싱이 중단된다. 순서에 따라서 원활하게 못가져올 수도 있다. 2022. 10. 14. 02. 브라우저 객체 모델 (BOM) 브라우저 객체 모델 Browser Object Model 마우스 하드웨어 인터페이스 마우스로 기능 브라우저를 제어하기 위한 인터페이스이다. 2022. 10. 13. 01. 자바스크립트 DOM이란? 문서 객체 모델 랜더링 엔진 -> 크롬 한 줄한줄 해석한다. 문서 객체 모델 Document Object Model 이라고 한다. 스크립트 언어로 웹문서를 객체화 한 것.. 나무 모양의 트리 구조 각각의 요소를 노드라고 한다. DOM 요소 1. 접근한다. 2. 제어한다. 웹 문서를 객체화 한 것 > DOM 이라고 한다. 브라우저 객체 모델 Browser Object Model 웹문서 제어 객체 Document 객체 Dom 트리 최상위 모델임. Dom 요소에 접근하기 위한 진입점이라고 할 수 있다. 최상위 노드 Document Dom소개 문서객체 모델로 Html, Xml 문서의 프로그래밍 interface이다. 2022. 10. 13. [39일차] 리액트 200제 6~10 🚘2022-08-16🚘 006 생명주기 함수 static getDeriveState FormProps(props, state) 사용하기 App.js import React from 'react'; import './App.css'; import LifecycleEx from './R006_LifecycleEx' function App() { return ( Start React 200! CSS 적용하기 ); } export default App; R006_LifecycleEx.js import React, { Component } from 'react'; class R006_LifecycleEx extends Component { static getDerivedStateFromProps(props, st.. 2022. 8. 16. [37일차] 리액트 200제 🤎2022-08-11🤎 https://nodejs.org/download/release/v14.4.0/ Index of /download/release/v14.4.0/ nodejs.org node.js node-v14.4.0-x64.msi 파일 다운 입문 03 App.css .App { text-align: center; } .App-logo { height: 40vmin; pointer-events: none; } @media (prefers-reduced-motion: no-preference) { .App-logo { animation: App-logo-spin infinite 20s linear; } } .App-header { background-color: #282c34; min-height:.. 2022. 8. 11. 이전 1 2 3 4 다음