개발 일지20 맛집 검색기 React 리팩터링 작년 초에 웹 개발 공부를 시작하면서 만들었던 맛집 검색기를 리팩터링했다. 리팩터링을 하고자 했던 이유는 다음과 같다. 1. HTML 위주의 하드 코딩으로 인한 유지 보수 문제 2. 디자인 기존 코드 극 초기의 코드는 정말 HTML 80~90%로 작성되었었기 때문에, 한 번 함수 정리를 한 상태긴 했다. ver 1.5 리팩터링 일기 리팩터링 리디자인하면서 컴포넌트 위주로 리팩터링하였다. 따라서 리액트를 사용하였고 언어는 typescript를 사용했다. 재사용성을 고려하여 컴포넌트를 만들고 별도의 폴더에 넣어두었다. 또한 함수의 재사용성을 고려하여 따로 함수 파일을 생성한 후 이를 필요한 곳에서 export 해오는 방식으로 사용했다. 이전에 HTML, JS 파일에 변수로서 저장되었던 데이터들을 json 파.. 2023. 9. 15. 약 4개월 간의 프로젝트를 끝내고 쓰는 개인 회고 1. 프로젝트 설명 - 어떤 프로젝트를 진행하였는지 연구실에서 이미 MATLAB으로 개발되었던 프로그램을 웹 버전을 개발하는 프로젝트를 진행하였다. 증기침입 위해성 평가를 진행할 수 있는 프로그램이다. (https://rapvi-ku.web.app/) 이 프로젝트의 특징은 다양한 종류의 많은 입력값들을 받고, 결과 값을 시각화해주는 것이라고 할 수 있을 것 같다. - 프로젝트의 목적 MATLAB으로 개발된 프로그램의 단점을 극복하고자 하였다. MATLAB으로 개발된 프로그램의 경우, 이용하고자 하는 사람의 컴퓨터에 MATLAB 프로그램이 설치가 되어있어야 한다. 또한 그 프로그램의 용량이 꽤나 무겁기 때문에 이 프로그램이 필요할 때 손쉽게 접근하여 사용하기에는 무리가 있었다. 따라서 이 프로그램의 기능들.. 2023. 4. 2. 배포 및 운영 비용 현재 진행 중인 프로젝트를 배포해야 하는데, 토이 프로젝트가 아니라 연구 과제 느낌..? 이다. 그렇기 때문에 서버비나 향후 유지보수 등까지 고려해야 한다. 또한 비개발자 분들도 함께 참여하고 있어 이에 대한 배경 지식이 부족하기 때문에 (물론 나도 부족하지만...) 나도 공부할 겸 정리를 해보았다. 나 또한 제대로 알아본 것은 처음이기 때문에 잘못된 내용이 있을 수도 있다. 내 블로그 읽는 사람 없을 것 같긴 하지만 혹시 잘못된 내용이 있으면 지적해주십사... 사이트 구조 먼저 우리 팀이 개발하고 있는 서비스는 쉽게 말하면 계산기 프로그램이다. 따라서 아래와 같은 구조로 이루어져있다고 생각했다. 트래픽 : 네트워크 장치에서 일정 시간 내에 흐르는 데이터의 양 서버 : 웹 요청 처리 DB : 회원 데이터.. 2023. 1. 10. [개발일지] 하이디라오 훠궈 소스 백과사전 아이디어 나는 (한식 제외) 향신료가 들어간 음식들을 그다지 좋아하지 않아 훠궈를 먹어본 적이 없었다. 하지만 요새 내 주변 친구들은 '하이디라오'라는 식당을 매우 좋아하는 데, 이 곳은 다른 훠궈 식당과는 다르게 직접 소스를 만들어먹을 수 있는 소스바가 있다. 소스 재료 종류가 정말 다양하기 때문에 이들을 조합할 수 있는 레시피 또한 아주 많다. 하지만 식당에는 4~5가지의 소스 제조법만 적혀있었다. 인터넷에서 내가 본 소스 레시피는 더 많았는데! 그래서 이 레시피들을 모아서 한 곳에서 확인할 수 있다면 정말 편할 것 같다는 생각이 들었다. 버전 1 개발 이 때 당시에는 내가 막 HTML/CSS 그리고 자바스크립트 조금 적응해가던 때였기 때문에 데이터베이스같은 고오급 기술을 생각할 여력이 없었다. 레시.. 2022. 12. 7. 이전 1 2 3 4 5 다음