LG CNS 부트캠프 학습일지 11일차

학습 내용

• Context API
• 카카오맵 토이프로젝트

Context API

Context API에 대해서 잘못 이해하고 있었다.

export const MyContext = createContext({
	name = "",
	age = 0,
});

const ParentComponent = () => {
	const [name, setName] = useState("John Doe");
	const [age, setAge] = useState(25);

	return (
		<MyContext.Provider value=>
			<ChildComponent></ChildComponent>
		</MyContext.Provider>
	);
}

const ChildComponent = () => {
	const context = useContext(MyContext);

	return (
		<GrandChildComponent
			name={context.name}
			age={context.age}
		>
		</GrandChildComponent>
	);
}

카카오맵 토이프로젝트

OpenWeather 에서 제공하는 API를 활용해서 날씨 정보를 웹브라우저에 표시하는 프로젝트를 진행했다.

카카오맵 API를 활용해서 지도를 그려보았다. 코드를 작성하는 것보다 카카오맵 API키 활용방법을 배우는데 더 많은 시간을 보냈다. react-kakao-maps-sdk를 활용했고, 꽤 괜찮았다.

다른 교육생분이 만든 결과물을 보았다. UI까지 꽤 잘 만들었다. 인공지능을 활용했다고 했는데, 코드 에이전트의 힘을 다시 한 번 느낄 수 있었다. 구독 비용과 토큰 사용량 제한 때문에 사용하고 있지 않은데, LocalLLM으로 클라우드 인공지능의 빈자리를 채워보려고 하지만 한계가 느껴지는 것은 사실이다.

결론

카카오맵 토이프로젝트는 조금 더 만져봐야겠다. city와 position 그리고 weather등의 상태를 따로 관리하는 것이 과연 좋은 설계인지 의문이 들었다. weatherInfo 같은 것으로 일원화해서 관리한다면 더 좋을 것 같다.