728x90 프론트엔드 개발42 웹 렌더링 (Rendering on the Web) FP(First Paint) 픽셀이 처음으로 사용자에게 표시되는 시점. 즉, 흰 화면에서 무언가가 처음으로 그려지기 시작하는 시점 FCP(First Contentful Paint) 요청 콘텐츠가 표시되는 시점. 즉, 텍스트나 이미지가 출력되기 시작하는 시점 FMP(First Meaningful Paint 요청 콘텐츠가 표시되는 시점. 즉, CSS와 Javascrip 로드가 시작되는 시점 TTI(Time to Interactive) 페이지가 상호작용 가능하게 될 때까지의 시간. 즉 Javascript의 초기 실행이 완료되어 사용자가 직접 행동을 취할 수 있는 시점까지의 시간 TTFB(Time to First Byte) 첫 번째 바이트까지의 시간. 즉, 링크를 클릭하고 처음으로 들어오는 콘텐츠 비트 사이의 .. 2021. 10. 15. URI?? URL?? URI (Uniform Resource Identifier) : 통합 자원 식별자 URL (Uniform Resource Locator) : 통합 자원 지시자 URI에는 resource의 이름과 위치 또는 둘 다를 식별하기 위한 URL과 URN이 모두 포함. URL은 URI의 하위 집합이며 resource의 위치만 식별. URI의 예는 urn:isbn:0-476-27557-4이고 URL의 예는 https://google.com URI는 HTML, XML 및 기타 파일에서도 resource를 찾는 것에 사용할 수 있지만, URL은 웹 페이지의 위치를 찾는 것에만 사용 가능 각 URL은 URI일 수 있지만, 모든 URI가 항상 URL일 수는 없음 http://opentutorials.org:3000/main.. 2021. 10. 8. React-Hooks : useState 연습하기 React에서 함수형 컴포넌트를 이용하면 클래스형 컴포넌트보다 훨씬 간단하게 코드를 작성할 수 있다. React-Hooks는 함수형 컴포넌트로 좀 더 나은 코드를 작성하는데 도움을 준다. React에서는 컴포넌트 내에서 데이터를 저장하는데 state를 사용한다. state : 컴포넌트 내에서 사용하는 변수 useState : 컴포넌트에서 사용하는 변수를 만들어주는 기능 setState : 컴포넌트에서 사용하는 변수를 변경해주는 기능 포맷은 이렇게. const [state, setState] = useState("initial value") 1. 버튼을 누를 때마다 숫자가 커지게 하기 export default function StatePage() { const [count, setCount] = useS.. 2021. 10. 8. 클로저 (Closure) “A closure is the combination of a function and the lexical environment within which that function was declared.” 클로저는 함수와 그 함수가 선언됐을 때의 렉시컬 환경(Lexical environment)과의 조합이다. 클로저의 정의 MDN에서 정의하고 있는 클로저(Closure)이다. 위 정의에서 말하는 “함수”란 반환된 내부 함수를 의미하고 “그 함수가 선언될 때의 렉시컬 환경(Lexical environment)”란 내부 함수가 선언됐을 때의 스코프를 의미한다. 즉, 클로저는 반환된 내부 함수가 자신이 선언됐을 때의 환경(Lexical environment)인 스코프를 기억하여 자신이 선언됐을 때의 환경(스코프.. 2021. 10. 7. Module not found: Can't resolve 'xxx' 위와 같은 error 발생시 node js 에서 해당 모듈을 찾을 수 없다는 뜻으로 아래와 같이 설치한다 yarn add xxx 또는 npm install xxx 2021. 7. 24. 타입스크립트를 사용해야 하는 이유 자바스크립트는 자동완성이 구리다. 다른 언어였으면 파라미터 타입이 이상하다면서 오류를 냈을텐데 자바스크립트 환경에서는 실행해볼때까지 해당 코드에 오류가 있는지 없는지 알 방법이 없다 리액트 컴포넌트 쓸 때 어떤 props 를 넣어야하는지 에디터에서 알 방법도 없다. 자바스크립스를 사용 할 때 처음에는 불편한지 모른다고 하는데 개발자들은 타입스크립트 없이 어떻게 개발을 하지? 라는 생각을 하게 된다고 할 정도라고 한다 리액트 프로젝트에서 타입스크립트를 사용하면 개발이 편해진다고 하니까 많이 사용하자! - 벨로퍼트 - 2021. 7. 19. 이전 1 ··· 4 5 6 7 다음 728x90
