본문 바로가기

프론트엔드5

네트워크 필수 개념 1 ) 신호란, 디지털 신호란 목차 ) 과학에서 신호란 전기 신호란 결론 1. 과학에서 신호란 신호란 ) 대화를 할때 쓰는 신호 어떠한 정보를 나타내는 무언가를 서로 약속하고 사용하는 것 과학에서 사용 되는 신호 약속된 무언가를 통해서 정보를 나타내고, 사용되는 것 과학에서 신호란 항상 그래프 형태로 표현 되는 이유는? 과확에서 신호는 약속된 무언가를 "숫자와 수학 기호"로 표현하기 때문이다. 과학에서 "수"를 표현하기 위해서는 숫자(0~9)와 계산을 위해 만들어진 "숫자 기호"를 이용해서 "무언가"를 나타낸다. 이때 "변했다" 리는 것을 알게 해주는 기준은 "시간"이다 "시간"을 기준으로 삼는 이유 시간은 어디에나 존재 하며, 무엇이든 관여하기 때문이다. (시간을 배제 할수 있는 것은 없다. ) 흐르는 시간을 기준으로 "무언가"를 .. 2024. 1. 16.
useCallback과 useMemo: React 컴포넌트 최적화를 위한 훅 사용법 React는 웹 애플리케이션을 효과적으로 구축하는 것을 목적으로 하는 UI 라이브러리입니다. 여기서 성능 최적화는 중요한 요소인데, 이를 위해 React에서 제공하는 주요 기능 중 하나가 Hook입니다. useCallback은 주로 메모이제이션된 콜백 함수를 반환하는 데 사용됩니다. 이전에 계산된 결과를 캐시에 저장하여 동일한 입력이 들어올 경우 다시 계산하는 것이 아닌 캐시에서 값을 반환합니다. 이로 인해 함수 컴포넌트가 효율적으로 업데이트되고, 렌더링 성능이 향상됩니다. 반면, useMemo는 콜백 함수를 직접 반환하는 것이 아니라 콜백 함수가 실행된 결과의 값을 반환하는 데 사용됩니다. 즉, useMemo는 계산량이 많은 함수를 실행하는 것을 방지하고, 꼭 필요한 경우에만 함수를 실행하여 성능을 최.. 2023. 6. 21.
TypeScript에서 [key: string]: any;를 사용하는 방법과 주의사항 TypeScript의 인터페이스를 사용하면, 객체의 구조와 모습을 명확하고 명시적으로 정의할 수 있습니다. 인터페이스의 일부로 [key: string]: any;를 사용하게 되면, 객체에 동적인 속성을 추가할 수 있습니다. [key: string]: any; 의 사용 방법, 이점, 주의사항, 그리고 대안에 대해 설명하겠습니다. 사용 방법 interface Example { [key: string]: any; } const exampleObject: Example = { name: 'John', age: 30, address: { street: '123 Main St', city: 'New York', state: 'NY', zip: '10001' } }; 위 코드에서, Example 인터페이스에 [key.. 2023. 6. 20.
리액트 Input 컴포넌트: 모바일 사용자를 위한 키보드 타입 지정 방법 input 요소에 inputMode 속성을 추가하면, 표시되는 키보드 유형을 지정할 수 있습니다. 이 속성은 다양한 모바일 기기에 최적화된 키보드를 사용자에게 제공합니다. inputMode 가 가질 수 있는 다양한 값들은 다음과 같습니다. none text tel url email numeric decimal search inputMode 속성을 원하는 값으로 설정하면 적절한 키보드가 표시되어 사용자 경험을 개선할 수 있습니다. 입력 모드 예제 다음은 inputMode의 사용 예제입니다. 이 예제를 사용하면 React의 input 요소에 inputMode 속성을 추가할 수 있습니다. import React from 'react'; function Example() { return ( Enter your .. 2023. 6. 19.
HTML 과 CSS 기본 정리. 쉽게 말하면 👉 HTML은 뼈대, CSS는 꾸미기! 를 생각하면된다. HTML은 구역과 텍스트를 나타내는 코드로, CSS는 잡은 구역을 꾸며주는 것으로 생각합니다. HTML 내 style 속성으로 꾸미기를 할 수 있지만, 긴 세월동안 이것을 한데 모아 볼 수 있는 CSS 파일이 탄생하게 되었습니다. HTML 코드 내에 CSS 파일을 불러와서 적용합니다. 또한 CSS를 잘 사용할 줄 아는 것과, '예쁘게' 만드는 것은 다른 영역이기 때문에(붓을 잡을 줄 아는 것과 그림을 잘 그릴 줄 아는 것의 차이), 많은 경우 웹디자이너나 퍼블리셔에게 의존하게 됩니다. - HTML 기초 HTML은 크게 head와 body로 구성된다. head안에는 페이지의 속성 정보를, body안에는 페이지의 내용을 담습니다. head.. 2022. 2. 15.