IT 기록 블로그

완성본 Teck Stack React , JS , css , Weather open API 🔍 날씨 데이터 가져오기 const getCurrentLocation = () => { navigator.geolocation.getCurrentPosition(( position ) => { let lat = position.coords.latitude; // 위도 let lon = position.coords.longitude; // 경도 console.log('현재위치', lat, lon); }); }; 1. Object Shorthand... Read More

🔍 React 장점 새로고침X -> 않아도 자동으로 업데이트 코드 재사용성⬆️ ( 가용성이 좋다) JSX문법 HTML + JavaScript HTML 컴포넌트 와 관련된 함수를 뭉쳐 세트로 만든다. 그리고 이 세트는 컴포넌트 라고 한다. App.js가 웹에 보여지는 내용 React는 HTML파일이 하나 main.js 는 index.html 파일과 App.js를 연결해주는 연결고리 역할 1. Object Shorthand AssignMent // 키와 키값에 ... Read More

🔍 리액트 Hooks 리액트에서 클래스형 컴포넌트와 함수형 컴포넌트가 있습니다. 그 중에 Hooks는 함수형 컴포넌트에서 사용하는 기능입니다. Hooks는 기존에 함수형 컴포넌트에서 할 수 없었던 상태 관리나, 렌더링 후 작업을 설정하는 기능 등의 작업을 할 수 있게 해줍니다. 📋useMemo란? useMemo는 리액트에서 컴포넌트의 성능을 최적화 하는데 사용되는 Hook입니다 useMemo에서 memo는 MEMOIZATION을 뜻하는데 이는 그대로 해석하면 ‘메모리에 넣기’ 라는 의미이며 컴퓨터 프로그램이 동일한 계산을 반복해야 할 때, 이전에 계산한 값을 메모리에 저장함으로써 동일한 계산의 ... Read More

🔍 리액트 Hooks 리액트에서 클래스형 컴포넌트와 함수형 컴포넌트가 있습니다. 그 중에 Hooks는 함수형 컴포넌트에서 사용하는 기능입니다. Hooks는 기존에 함수형 컴포넌트에서 할 수 없었던 상태 관리나, 렌더링 후 작업을 설정하는 기능 등의 작업을 할 수 있게 해줍니다. useEffect useEffect 는 리액트 컴포넌트가 렌더링될 때마다 특정 작업을 수행하도록 설정할 수 있는 Hook 입니다. 클래스형 컴포넌트의 componentDidMount와 componentDidUpdate를 합친 형태로 보아도 무방합니다. useEffect도 사용하려면 import가 필수입니다. useEf... Read More

🔍 리액트 Hooks 리액트에서 클래스형 컴포넌트와 함수형 컴포넌트가 있습니다. 그 중에 Hooks는 함수형 컴포넌트에서 사용하는 기능입니다. Hooks는 기존에 함수형 컴포넌트에서 할 수 없었던 상태 관리나, 렌더링 후 작업을 설정하는 기능 등의 작업을 할 수 있게 해줍니다. 상태(State)란 ? 컴포넌트 내부에 변경될 수 있는 값 props는 부모 컴포넌트로부터 넘겨 받으므로, 컴포넌트 자신은 props를 바꾸지 못하는 특성이 있는 것과는 차이가 있습니다. useState 함수형 컴포넌트에서도 상태(state)관리를 할 수 있게 해 주는 Hook 입니다... Read More