Library-Framework31 React 컴포넌트를 어떻게 만들어야 할까? React는 컴포넌트 기반 라이브러리입니다. 웹을 개발할 때 헤더, 메인 콘텐츠가 들어가는 부분, 버튼 등을 만든다면 하나의 컴포넌트로 묶어서 관리할 수 있습니다. 그렇기 때문에 개발하다가 특정 부분에서 오류가 생겼다고 한다면, 그 컴포넌트만 수정하면되기 때문에 코드를 간결하게 만들 수 있습니다. 지금까지 React로 여러 가지 프로젝트를 해보면서 많은 컴포넌트들을 만들어보았고, 그 과정에서 비슷한 기능인데도 모두 따로 만든다던가 하는 방식으로 비효율적인 방법으로 만들었다가 또 다시 그 코드를 고쳐서 하나의 컴포넌트를 깔끔하게 만들었을 때 재미를 느꼈습니다. 그래서 컴포넌트를 어떻게 해야 잘 만들 수 있을 지에 대한 점이 궁금해 몇 가지 글과 웨비나를 참고해서 정리해봤습니다. 1. React 컴포넌트와 .. 2024. 1. 20. React 프로젝트 웹뷰 android 빌드하기 현재 진행 중인 프로젝트를 모바일 뷰로 개발 중인데, 어느 정도 주요 기능이 모두 완성된 상태에서 이 서비스를 어플로 사용한다면 편리할 것 같다는 생각이 들었습니다. 작년 상반기에 근무했던 팀에서 모바일 앱 내에 웹뷰 형태로 서비스를 제공했었기 때문에, 이번 프로젝트를 Flutter를 사용해서 앱으로 만들어보기로 했습니다. (↓ 아래 사이트는 현재 진행 중인 프로젝트의 웹 사이트입니다) 산-책, 등산/트레킹 정보 큐레이션 플랫폼 지구환경 분야 공간데이터 기반 등산/트레킹 정보를 확인하고 공유해보세요! kground.web.app 1. mac OS Flutter 개발 환경 설정하기 chrome, vscode, xcode 등은 이미 설치되어 있는 경우, 아래 4개를 설치해주면 됩니다. // Flutter b.. 2024. 1. 4. 🌟 외부 라이브러리 없이 별점 평점 기능 만들기 별점 평점 은 리뷰 기능을 만들 때 빠질 수 없는 요소이다. 현재 진행 중인 프로젝트의 리뷰 작성 페이지를 만들면서 별점 평점 기능을 만들게 되었다. 요새 Chakra UI 처럼, 외부 UI 라이브러리가 매우 잘 되어있기 때문에 자주 쓰이는 UI 컴포넌트들은 대부분 라이브러리를 사용해 만들고 나는 로직에 더 집중하는 방식으로 개발을 진행했었다. 하지만 아쉽게도 (?) 자주 쓰는 라이브러리에서는 별점 컴포넌트가 제공되지 않았고 로직을 생각해보니 그리 어렵지 않은 것 같아서 직접 만들어보았다. (찾아보니 있긴 했다.) https://www.npmjs.com/package/rc-rate rc-rate React Star Rate Component. Latest version: 2.12.0, last publi.. 2023. 12. 29. [Next.js] Google Maps API로 지도에 원 그리기 (당근마켓 내 동네 설정 따라해보기) 당근마켓의 내 동네 설정 기능을 보면, 하단 바를 움직일 때마다 지도에 표시된 영역의 넓이와 지도 스케일이 변하는 것을 볼 수 있다. 당근마켓처럼 지역 특성에 맞추어 자세한 다각형으로 표현하는 것은 무리고, 지역별로 중심 좌표를 정하고, 이를 중심으로 한 원을 그리는 것을 한 번 해보기로 했다. 0. Google Maps API 키 받기 가입해서 키를 발급 받으면 된다. https://developers.google.com/maps?hl=ko Google Maps Platform | Google for Developers Google Maps Platform 설명 developers.google.com 1. 설치하기 Google Maps API Docs는 순수 javascript로 설명을 해주고 있기 때.. 2023. 6. 28. 이전 1 2 3 4 ··· 8 다음
