내 주소를 입력하면 지도로 표시하기 위해 카카오 지도 API를 이용해보았다!📄 카카오 지도 API 공식문서https://apis.map.kakao.com/web/ 개발 문서도 잘 정리되어 있고, 1일 30만회까지 요청도 가능해서 선택하게 되었다.여기도 마찬가지로 javascript로 사용 시 위의 공식 문서의 예제 등을 통해 쉽게 사용 가능하다. 하지만 나는 리액트 환경이고리액트에서 간편하게 이용 가능한 라이브러리 react-kakao-maps-sdk로 리액트 환경에 맞게 컴포넌트를 완성할 수 있었다 ㅎ.ㅎ 🔗 react-kakao-maps-sdk 라이브러리 공식 문서https://react-kakao-maps-sdk.jaeseokim.dev/" data-og-host="react-kakao-map..
라이브러리
내 주소를 입력하는 컴포넌트를 만들기 위해 Daum에서 제공한 우편번호 서비스(이하 다음 주소 API)를 이용해보았다!📄 다음 주소 API 공식문서https://postcode.map.daum.net/guide Daum 우편번호 서비스우편번호 검색과 도로명 주소 입력 기능을 너무 간단하게 적용할 수 있는 방법. Daum 우편번호 서비스를 이용해보세요. 어느 사이트에서나 무료로 제약없이 사용 가능하답니다.postcode.map.daum.net이 API는 대부분의 사이트에서도 이용하고 있다.javascript로 사용 시 위의 공식 문서의 예제 등을 통해 쉽게 사용 가능하다. 하지만 나는 리액트 환경이기 때문에리액트에서 간편하게 이용할 수 있도록 만들어진 라이브러리 react-daum-post를 사용해 쉽게..
⚒️ TailwindCSS 설치하기공식 문서아주 쉽게 잘 설명되어 있다! https://tailwindcss.com/docs/guides/vite Install Tailwind CSS with Vite - Tailwind CSSSetting up Tailwind CSS in a Vite project.tailwindcss.com 0. 프로젝트 생성react + vite 프로젝트를 생성한 후 프로젝트 폴더로 이동한다. (my-project : 프로젝트 이름)npm create vite@latest my-project -- --template reactcd my-project App.jsx에 아래와 같이 코드를 써보고import "./App.css";function App() { return Hello ..
Create React App 로 시작하기npx create-react-app my-appcd my-appnpm run start Vite 로 시작하기npm create vite@latest my-app -- --template reactcd my-appnpm installnpm run devCRA vs ViteCRA 보다 Vite를 사용했을 때 프로젝트 생성 + 패키지 설치 속도가 훨씬 빠르다. 자세한 비교는 아래 글을 참고! [React] 리액트 프로젝트 생성 - Create React App 보다 더 빠른 Vite 사용하기보통 리액트에서 간단한 프로젝트를 생성하기 위해 가장 많이 사용하는 것은 Create React App 즉 CRA다. 그러나 CRA는 단점이 있는데, 바로 속도가 느리다는 것이다..