[Electron] 18.프로젝트 완료 (요약 정리) - 레시피 일렉트론 앱

스크린샷      버전 정보Electron v28.1.3Electron forge v7.2.0Node.js v18.18.0SQLite3 v3.39.0Jquery v3.7.1기능검색 기능다운로드 기능상세 보기 기능추가SQLite - Full Text Search를 활용한 검색 기능 최적화Web worker를 활용한 앱 성능 안정화 (응답 없음 이슈 해결)DB 내에 파일을 압축하고 바이너리화하여 데이터 용량 경량화요약Kaggle에서 csv 데이터 및 이미지 파일 탐색데이터 및 이미지 DB 테이블 삽입 자동화SQLite - FTS 테이블 및 쿼리문 구현기능 구현HTML 마크업 및 CSS 소스 반영이슈 및 기능 수정빌드 및 패키징 설정

• format_list_bulleted 토이 프로젝트/레시피 일렉트론 앱 (완)
• · 2024. 7. 10.
• textsms

[Electron] 17.앱 빌드 및 패키징 - 레시피 일렉트론 앱

GitHubhttps://github.com/bsorryman/recipe-bag 개요생각해두었던 기능은 모두 구현 완료했고, 이제 마지막으로 빌드와 패키징이 남았다. electron forge를 이용해 프로젝트를 구성했기 때문에, 간단한 script 명령어 하나로 설치파일(setup)을 패키징할 수 있다.  패키징 설정{ "name": "recipe.electron", "productName": "Recipe Bag", "version": "1.0.0", "description": "What should I eat today", "main": ".webpack/main", "scripts": { "start": "electron-forge start", "package": "ele..

• format_list_bulleted 토이 프로젝트/레시피 일렉트론 앱 (완)
• · 2024. 7. 6.
• textsms

[Electron] 16.최근 검색어 저장 - 레시피 일렉트론 앱

GitHubhttps://github.com/bsorryman/recipe-bag 개요메인 화면 및 검색 결과 화면 내의 검색창에서 최근 검색어를 저장하는 기능을 추가한다. JavaScript 코드 req_loadRecentKeywords: () => ipcRenderer.send("req_loadRecentKeywords"), resp_loadRecentKeywords: (keywordList) => ipcRenderer.on('resp_loadRecentKeywords', keywordList), req_pushRecentKeyword: (keyword) => ipcRenderer.send("req_pushRecentKeyword", keyword), req_delRece..

• format_list_bulleted 토이 프로젝트/레시피 일렉트론 앱 (완)
• · 2024. 7. 5.
• textsms

[Electron] 15.상세보기 기능 수정 및 마크업 디자인 반영 - 레시피 일렉트론 앱

GitHubhttps://github.com/bsorryman/recipe-bag개요 기존에는 '레시피 상세 보기 기능'을 위해, DB에 바이너리 타입으로 들어있는 파일을 압축 해제(Decompress)하여 텍스트 파일을 보여주도록 했다. 해당 기능을 수정하고 마크업 디자인 적용 및 검색어 Highlight 기능을 구현한다. JavaScript 코드 selectRecipeByIdAndKeyword(keyword, id) { if (this.db == null) return ''; let query = ''; if (keyword==null || keyword=='') { query = ` SELECT id, title, ingredients, instruc..

• format_list_bulleted 토이 프로젝트/레시피 일렉트론 앱 (완)
• · 2024. 6. 27.
• textsms

[Electron] 14.디자인 마크업 적용 및 무한 스크롤 기능 추가 - 레시피 일렉트론 앱

사실 이미 프로젝트는 4월 초에 끝나서 v1.0으로 빌드까지 완료되었다. 근래에 일이 있어 기록이 소홀해졌는데, 더 늦기전에 다시 기억을 더듬으며 기록하기로 한다. GitHubhttps://github.com/bsorryman/recipe-bag개요기획, 디자인 틀만 잡아두었던 HTML 코드를 걷어내고, 회사 동료가 작성해준 HTML, CSS 소스를 적용하였다. 기본적인 틀은 비슷하지만 검색 결과 페이지 내 페이징 방식을 버튼 식에서 무한 스크롤 식으로 변경하였다.  무한 스크롤 selectRcpByKeyword(keyword, column, offset) { if (this.db == null) return ''; if (column == 'all') { column = ..

• format_list_bulleted 토이 프로젝트/레시피 일렉트론 앱 (완)
• · 2024. 6. 26.
• textsms

[Electron] 13.멀티스레딩 구현 with worker(2) - 레시피 일렉트론 앱

개요Worker thread가 되어줄 script를 작성한다.Worker를 생성하고 통신해줄 Class를 작성하고, 각종 리스너를 설정한다.Worker에 맞춰서 IPC및 DB 쿼리문 호출 로직을 수정한다.Worker를 통한 검색 로직기존에는 Renderer 단에서 검색을 요청할 시, Main에서 바로 Sqlite DB의 쿼리문을 호출 해 결과를 보냈다. Worker를 추가하게 되면 Main에서 DB 대신 Worker로 검색 결과를 요청하게 된다.Worker는 RcpIPC 인스턴스가 Main에서 생성될 때 함께 생성되고 대기 중에 있다.Worker는 RcpSqliteDB 인스턴스를 생성한다.Renderer 단에서 검색 요청 시, Main은 요청을 바로 Worker thread로 전달한다.Worker는 생성..

• format_list_bulleted 토이 프로젝트/레시피 일렉트론 앱 (완)
• · 2024. 2. 12.
• textsms