earthssu 개발 공부

최근 졸업 프로젝트를 시작하면서 다시 리액트를 공부해야 하는 상황이 생겼다. 이 프로젝트 내에서 ref를 유용하게 쓸 수 있을 것 같아 공부 겸 다시 정리해보려고 한다. 개념은 책 '리액트를 다루는 기술'을 참고했다. ref ? 일반적으로 HTML에서 DOM 요소에 이름을 달 때는 id를 사용한다. 그래서 CSS에서 특정 id에 스타일을 적용하거나 Javascript에서 특정 id에 접근해 작업할 수 있는 것이다. 이렇게 HTML에서 id를 사용해 DOM에 이름을 다는 것처럼 리액트 프로젝트 내부에서 DOM에 이름을 다는 방법을 ref라고 한다. 어라 잠깐, 리액트 프로젝트에서는 id를 쓸 수 없는 건가? 쓸 수 있다! 그러나 리액트는 컴포넌트 단위로 이루어지는데, 컴포넌트가 여러 번 사용될 경우 '유일..

리액트 공부를 시작할 때 필수적으로 보이는 두 단어가 있다. 바로 Bundler와 JSX! 이 두 가지가 무엇인지, 어떻게 쓰이는지 간단하게 정리해보았다. 번들러(Bundler) 이전의 자바스크립트 : 페이지별, 기능별 등으로 자바스크립트 파일을 분리해 HTML파일에서 형식으로 불러왔다. 프로젝트 규모가 작을 경우 큰 문제 없지만, 규모가 커질수록 몇 가지 치명적인 문제가 발생한다. 1. 두 개의 자바스크립트 파일에서 같은 변수명을 사용할 경우, 해당 변수명의 용도가 불분명해질 수 있다. 자바스크립트 파일이 얼마 없을 경우 겹치지 않게 개발하면 되지만, 프로젝트 규모가 커진다면...? 일일이 확인하고 변수명을 고치기란 꽤나 머리 아픈 일이다. 2. 사용자가 URI를 입력하면 해당 URI에 필요한 파일을 ..

위의 사진과 같이 서울시 행정구를 폴리곤으로 구분하고, 해당 위치에 마우스를 얻을 경우 색이 바뀌는 이벤트를 발생시키는 것까지 해보겠다. 그 전에 행정 구역을 구분하는 geojson 파일이 필요하다. 해당 파일은 아래 링크를 통해 쉽게 생성할 수 있다! https://neurowhai.tistory.com/350 대한민국 행정구역(시도, 시군구) GeoJSON 파일 다운로드 및 SHP 파일 단순화 후 변환 방법 설명 원본 출처이자 해상도가 높은 파일(SHP)은 아래 링크에서 구하실 수 있습니다. http://www.gisdeveloper.co.kr/?p=2332 대한민국 최신 행정구역(SHP) 다운로드 – GIS Developer www.gisdeveloper.co.kr 위 데이터.. neurowhai...