Programming

[ElasticSearch] logstash + mysql window 환경 연동

1. 개요 ElasticSearch에 RDB로 이용하고 있는 mysql 데이터를 적재하고 싶어서 찾아보다가, elk의 스택인 logstash를 이용해서 batch job 형태로 주기적으로 적재할 수 있는 방법을 찾게 되었습니다. 일단은 테스트 용도이기 때문에, 윈도우 환경에서 작업을 했고, 리눅스 환경에서의 예제는 많지만 윈도우 환경에서의 예제는 없는 것 같아 정리해보려고 합니다.(elk가 생각보다 상당히 리소스를 많이 차지합니다) 2. 준비물 1) ElasticSearch https://www.elastic.co/kr/downloads/elasticsearch Download Elasticsearch Download Elasticsearch or the complete Elastic Stack (for..

[ElasticSearch] Insert(생성), Search(조회) 기본적인 CRUD

1. 개요 RDB를 하다가 ElasticSearch를 찾아보는데, 개념 자체가 RDB랑은 많이 달라서 최대한 알기 쉽게끔 필요한 기능만 정리를 해보려고 이 글을 작성해봅니다. 클러스터, 샤드랑 노드, 인덱스, 다큐먼트 등 개념적인 부분은 이 글에서는 다루지 않겠고, 아래 가이드북 링크를 참고해주시길 바랍니다. https://esbook.kimjmin.net/03-cluster/3.2-index-and-shards ElasticSearch 버전은 7.0버전 이상의 버전으로 진행합니다. 7.0버전부터 type이 사라졌기 때문입니다. 2. 클러스터 관련 Rest API 1) 클러스터 상태 조회 # curl -XGET http://localhost:9200/_cluster/health?pretty=true * ..

[Elasticsearch] The bulk request must be terminated by a newline [\\n] 에러

1. 개요 elastic search의 자동완성 기능을 구현해보려고 샘플 데이터를 insert하는 도중, The bulk request must be terminated by a newline [\\n] 와 같은 에러가 발생했습니다. 2. 해결 방법 {"index":{"_index":"autocomplete_test_1","_id":"1"}} {"word":"스팀게임"} {"index":{"_index":"autocomplete_test_1","_id":"2"}} {"word":"스팀게임 추천"} {"index":{"_index":"autocomplete_test_1","_id":"3"}} {"word":"스팀게임 추천 2019"} {"index":{"_index":"autocomplete_test_1"..

[Mysql] 위도 경도 반경 구하기

1. 개요 지도에 관한 로직을 짤때 latitude, longitude 위도 경도 값을 구해서 radius, 위도 경도 값 기준으로 주변 5km, 10km의 위도 경도 리스트 또는 거리를 알고 싶을 때가 있습니다. 이러한 로직을 mysql에서 구현할 수 있을까 해서 찾아봤는데 stack over flow에서 친절하게도 작성된 sql이 있더군요. https://stackoverflow.com/questions/8850336/radius-of-40-kilometers-using-latitude-and-longitude Radius of 40 kilometers using latitude and longitude Possible Duplicate: Radius of multiple latitude/longit..

[Next.js] router query(props) 값이 비어있는 오류

1. 개요 Next.js에서 router를 사용해서 페이지 이동을 할때, query에 keyword를 담아서 페이지 이동을 시키려고 했습니다. search라는 페이지에 해당하는 tsx에서 props로 저 쿼리가 읽혀야 하는데 props.data에 값이 비어있었습니다... 2. 해결 방법 const router = useRouter(); const queries = router.query; // 전달받은 쿼리 내용 useEffect(() => { if (!router.isReady) return; console.log(queries) }, () => { }) }, [router.isReady]) 위와 같이 전달 받은 tsx에서 useRouter() 객체를 가지고 초기화를 해서 사용해야 합니다. 이유는 정적..

[ElasticSearch] received plaintext http traffic on an https channel, closing connection 에러

1. 개요 윈도우 환경에서 ElasticSearch를 설치하고 localhost:9200으로 열어보았을때, received plaintext http traffic on an https channel, closing connection 라는 오류가 발생하고 연결이 되지 않는 이슈가 있었습니다. 2. 해결 방법 [elasticsearch설치폴더]/config/elasticsearch.yml ... # Enable security features xpack.security.enabled: false xpack.security.enrollment.enabled: false # Enable encryption for HTTP API client connections, such as Kibana, Logstash..

[Node.js] Selenium 크롤링 사용

1. 개요 프로젝트를 진행하다보니 실제 프로젝트에 사용할 데이터가 필요할 때가 있는데, 이 데이터를 얻기 위해 자연스럽게 인터넷의 정보를 쉽게 얻어 올 수 있기 위해 크롤링을 사용해야 했습니다. 2. 패키지 먼저 폴더를 하나 생성하고 npm init -y 로 node.js 기반 패키지를 생성해줍니다. 사용할 라이브러리는 selenium으로 npm install selenium-webdriver 위의 패키지를 설치해줍니다. selenium 크롤링을 사용하기 위해서는 브라우저의 드라이버를 사용해야 합니다. http://chromedriver.storage.googleapis.com/index.html 저는 크롬 드라이버를 사용했기 때문에, 위의 링크에서 최신 크롬 드라이버를 받아주면 됩니다. 다운 받은 드라..

[React] Redux 사용하기(2) - 카운터 구현

1. 개요 첫번째 글에서 흐름을 설명했던 카운터를 실제로 구현해보겠습니다. 코드는 아래 블로그를 참고했습니다. https://react.vlpt.us/redux/04-make-modules.html 4. 리덕스 모듈 만들기 · GitBook 4. 리덕스 모듈 만들기 이번에는, 리액트 프로젝트에 리덕스를 적용하기 위해서 리덕스 모듈을 만들어보도록 하겠습니다. 리덕스 모듈이란 다음 항목들이 모두 들어있는 자바스크립트 파일을 react.vlpt.us 2. 코드 작성 결과물은 위와 같습니다. 인풋 값으로 숫자를 입력받아 그 값만큼 현재값에서 +하거나 -하는 카운터 기능입니다. 프로젝트 폴더 구조는 위와 같습니다. module/counter.js /* 액션 타입 만들기 */ // Ducks 패턴을 따를땐 액션의 ..

[React] Redux 사용하기(1) - 개념과 흐름

1. 개요 React 기반으로 웹 프로젝트를 개발할때, 컴포넌트의 상태 관리를 해야할 경우가 생기는데, 이때 사용하는 것이 Redux입니다. 리액트의 꽃이라고 할 수 있고, 처음 접하는 사람에게 굉장히 러닝 커브가 높은 부분입니다.(저도 그랬습니다.) (상태 관리 하는 이유 : 리렌더링에 의한 자원 소모를 줄이기 위해서) 사실 Redux가 어렵기도 해서 사용하기 쉽게 라이브러리들이 개발이 되어서 MobX, xstate, recoil, zustand 등 여러가지 라이브러리가 등장하고, Redux를 굳이 사용하지 않아도 위 라이브러리로 간편하게 상태 관리를 할 수 있게 되었습니다. 하지만, 리액트 프로그래밍을 시작하는 사람으로서 어떤 맥락으로 상태관리가 이루어지는지 파악하는 것은 중요하다고 생각합니다. 2...

[Next.js] Proxy Axios 설정

1. 개요 Axios를 사용해 Next.js서버가 아닌 다른 도메인으로 url을 요청할 때가 있는데, 이때 프록시 설정을 하지 않으면 CORS 오류로 인해 호출이 되지 않는 경우가 있습니다. 또한, React에서 package.json에 프록시를 명시한 것과 다르게 Next.js에서 Proxy는 조금 다른 방법으로 설정을 해야만 했습니다. 2. 코드 Axios 호출 useEffect(() => { async function get() { try { const result: AxiosResponse = await axios.post("/redis/visit"); console.log(result.data) if (result) setVisitor(result.data) } catch (e) { } } ge..