[BE devlog] FAERS 약물명 정규화 작업
·
DevLog
전에 작업한 내용 [BE devlog] FAERS 약물명 통합 쿼리 최적화지금 진행하고 있는 프로젝트에서 대규모 데이터를 다루는 FDA 페이지를 오늘 개선해봤다. 문제 상황FDA에서 운영하는 FAERS(FDA Adverse Event Reporting System) 라는 부작용 자발보고 데이터베이스가 있다jiiiwonyy.tistory.com 문제상황일단 이 작업의 한계점은 주요 약물에만 동의어 사전을 만들어준것이었다.그래서 아직 집계가 제대로 되지 않는 문제가 있었음.예를 들어서 타이레놀 같은 경우는 브랜드명인데 주성분은 paracetamol 이다. 그래서 성분명 매핑작업을 시작했다. 기존에는 tylenol을 검색했을 때 제대로 된 타이레놀은 안나오고 tylenol's 라던가 tylenol-acea..
[BE devlog] FAERS 약물명 통합 쿼리 최적화
·
DevLog
지금 진행하고 있는 프로젝트에서 대규모 데이터를 다루는 FDA 페이지를 오늘 개선해봤다. 문제 상황FDA에서 운영하는 FAERS(FDA Adverse Event Reporting System) 라는 부작용 자발보고 데이터베이스가 있다.전 세계 의료진과 환자가 "이 약 먹고 이런 부작용이 생겼어요"를 직접 신고하는 시스템이다.이 데이터들을 약 별로 조회할 수 있게 해달라는 요청을 받았고 내가 간호학과에서 받은 데이터만 해도 약 1.9억행이다 일단 이게 실제 연관된 테이블들이 3개나 있었기 때문에 이 테이블들을 조인하는것도 어려웠고처음에는 사실 실행에 의의를 두고 만들었다.그래서 마음속에 묻어두고 다른 기능 개발하다가 이제 주 기능은 구현이 끝나서 리팩토링을 하다가 문제를 깨달음. aspirin으로 검색하면..
[GitHub] GitHub 라벨 설정 한번에 등록하기
·
DevLog
(25년 1월 31일 기준) 기존에 레포 새로 파고 프로젝트 할 때는 라벨을 일일히 등록해주었는데 이번에는 너무 귀찮아서 github api를 이용해서 한번에 등록해보았다! 1. Github API 설치하기- 저는 npm이 패키지 설치하기 때문에 npm 으로 github api 설치하였음.npm install -g github-label-sync 2. github access token 발급하기 깃허브 프로필 클릭 > Settings > Developer Settings > Personal access tokens(classic)Fine-grained tokens 말고 Tokens(classic)으로 할 것!처음에 Fine-grained로 했다가 403 에러가 계속 떠서 당황했음. Generate n..
AWS S3 + Presigned URL로 PDF 다운로드 구현하기
·
DevLog
지금 진행하고 있는 의약품정보 사이트에서 안전성서한을 보여주는 기능이 필요해서 구현하게 되었다.pdf와 한글 자료들은 클라이언트쪽에서 제공해주었기 때문에 난 이 자료들을 웹 사이트에서 보여주고 다운로드 할 수 있게 구현해야 했다. 일단 백엔드 공부, aws를 거의 챗지피티와 함께 공부했기 때문에 pdf를 어디에 넣고 어떻게 다운로드 받게 해야할지 막막했다. 결과적으로 나는 FastAPI + AWS S3 + Presigned URL을 이용해서 pdf 다운로드 기능을 구현했다. 0. 전체 구조 개요 다운로드 정책은 전부 서버에서 통제, 프론트엔드는 S3 존재 모름 1. S3 + Presigned URL 구조 선택 일단 처음에는 무식하게 db가 있으니까 db안에 pdf파일을 통째로 넣으면 되는거 아닌가 싶었다..
[BE devlog] React로 관리자 페이지 분리 후 발생한 CORS 이슈 해결하기
·
DevLog
배경 지금 개발하고 있는 사이트에서 데이터베이스 정보 변경이 필요해졌다.기본에 클라이언트 측에서 준 데이터는 단순히 웹 사이트를 드래그해서 그대로 복붙한 내용이어서 원본 데이터가 표인 경우에 그 형태가 제대로 보존되지 않은 문제가 있었다.그래서 xml 데이터를 다운로드 받아서 xml 내용이 보이도록 DB 구조를 변경하고 코드를 수정했는데 이제 xml 데이터를 하나하나 다 넣어주어야 한다는 번거로움이 생겼다! 클라이언트 측에서 원하는 데이터를 제공해주는 api도 없었기 때문에 정말 수동으로 데이터를 넣어주어야 하는 상황이 생긴것이다.다행히 클라이언트 측에서 데이터를 알아서 넣어주신다고 하셔서 관리자페이지를 만들어서 db에 데이터를 넣을 수 있도록 하였다. 그래서 처음에는 xml -> json 파싱이 잘 되..
[React] Axios Instance & Interceptors
·
Develop/FE
이번 캡스톤디자인에서는 서버가 DB백엔드 서버, AI 서버 두개로 나뉘고 토큰도 두 서버가 각각의 토큰이 필요한 상황이어서 axios의 인스턴스 기능과 Interceptors를 이용해서 각각의 서버에 맞게 설정하여줬다. Axios- axios는 Promise 기반의 HTTP 클라이언트 라이브러리- fetch 보다 인터셉트, 자동 json 변환 등 더 많은 기능을 지원한다. import axios from "axios";axios.get("/api/users") .then((response) => { console.log(response.data); }) .catch((error) => { console.error(error); }); Axios 인스턴스공통 설정을 가진 axio..
[React] Redux Thunk, Redux Persist
·
Develop/FE
이번에 과제를 하면서 redux 환경에서 local storage를 적용해야 하는 문제가 있어서 알아 보던 중에 redux prsist라는 라이브러리가 있다는 것을 알게 되었다! 생각보다 적용하기 쉬워서 바로 프로젝트에 적용해볼 수 있었다.추가로 redux thunk라고 데이터를 비동기로 처리할 수 있게 해주는 라이브러리도 있어서 함께 공부해보았다. redux thunk redux는 기본적으로 동기적인 코드만 처리할 수 있다.그런데 API 요청은 시간이 걸리니까 비동기 작업으로 처리해야 한다.이 때 redux-thunk를 사용하여 비동기 작업을 처리할 수 있다. redux-thunk는 비동기 작업을 처리할 수 있게 도와주는 미들웨어이다. [기존 방식]const App = () => { const dis..
React + PWA + Vite 프로젝트 시작하기 (feat. tailwind)
·
Develop/FE
이 블로그 글은 내가 PWA 초기 세팅을 까먹지 않기 위해 작성하는 것임. PWAPWA(프로그래시브 웹 앱)은 크로스 플랫폼 웹 어플리케이션을 생성해준다.그냥 쉽게 정리하면 리액트 네이티브를 안쓰고 리액트만으로 앱을 만들 수 있는 것임. PWA 사용 이유캡스톤디자인이 일단 앱으로 해야지 접근성이 좋고 주제와 잘 맞을 것 같아서 앱 개발을 해야 하는 상황임. 그런데 Flutter는 일단 해본 적이 없고 리액트 네이티브는 너무 무겁고 다시 공부해야 되는게 귀찮았음. 무엇보다 안드로이드 스튜디오 이용해서 시뮬레이터 돌리는게 너무 무거워서 쓰고 싶지 않았다. 그래서 우리 프로젝트에는 마이크 기능만 필요하기 때문에 리액트 기반 앱을 만들 수 있는 PWA를 적용하고 자함. 프로젝트 생성npm create @v..
지원지
지원지의 개발 블로그