[Electron] 6.프로세스와 IPC 통신 - 레시피 일렉트론 앱

개요 이미지 파일과 압축 파일 모두 DB에 삽입했으면, 이제 기능을 구현해야한다. 현재까지는 앱 실행시에 이미지 파일과 압축 파일을 DB에 넣는 클래스만 main.js(메인 프로세스)에 Import하여 사용했다. 어차피 DB 테이블 완성을 위한 1회성 클래스 및 함수였기 때문에, 구조를 생각하지 않고 메인 프로세스에서 한번만 돌아가면 됐었다. 하지만 이제부터는 몇가지 기능에 관련된 요청과 응답이 메인 프로세스(Main process)와 렌더러 프로세스(Renderer process) 사이에서 오가며, 그러한 통신들을 처리해줄 클래스들이 필요하다. 소스 구조 변경 우선 사진1과 같이 프로세스에 맞춰 프로젝트 경로를 재구성해주었다. main 폴더에는 각 메인 프로세스에서 돌아갈 스크립트들을 넣어주고, ren..

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

[Electron] 5.레시피 압축 파일 생성 및 바이너리화

개요 검색 결과 페이지에서 레시피의 다운로드 버튼을 클릭하면 받을 수 있는 압축 파일을 만들 것이다. 압축 파일에는 레시피 이미지 파일과 레시피 title, ingredients, instructions 가 포함된 .txt 파일을 포함한다. 이 압축 파일은 이미지 image_file 컬럼 처럼 recipe_zip_file 이라는 새 컬럼을 만들어 바이너리 데이터로 DB에 삽입한다. DB 컬럼 추가 및 데이터 삭제 -- 값이 누락된 데이터 삭제 DELETE * FROM tb_recipe WHERE title = '' OR ingredients = '[]' OR instructions = '' OR image_name = ''; -- 손상된 이미지 파일의 레코드 삭제 (파일은 존재하지만 손상된 파일) DEL..

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

[Electron] 4.이미지 바이너리화 - 레시피 일렉트론 앱

Git: https://github.com/bsorryman/recipe.electron GitHub - bsorryman/recipe.electron: 레시피 정보를 검색 및 다운로드 할 수 있는 일렉트론 앱. 레시피 정보를 검색 및 다운로드 할 수 있는 일렉트론 앱. Contribute to bsorryman/recipe.electron development by creating an account on GitHub. github.com 개요 각 레시피에 해당하는 이미지 파일을 image_file 이라는 새로운 BLOB 필드에 삽입할 예정이다. BLOB 필드에 이미지를 삽입하려면 파일을 바이너리화 해야한다. 즉, 모든 이미지 파일을 한번 씩 조회하면서 그에 맞는 레코드의 image_file 필드에 파..

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

[Electron] 3.Electron 프로젝트 생성 - 레시피 일렉트론 앱

💡 참조 docs https://www.electronforge.io/ Getting Started - Electron Forge Electron Forge currently only supports npm and Yarn Classic. If you are using Yarn >=2, please use the nodeLinker: node-modules install mode. www.electronforge.io 기본적인 DB 설정을 마쳤으므로, 이제 프로그램을 만들 Electron 프로젝트를 생성한다. 사전 환경 Node.js 및 npm electron-forge 패키지 전역 설치 npm i -g @electron-forge/cli Git IDE (VS code 등) VS Code - Electr..

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

[Electron] 2.Sqlite3 DB Fts5 설계 - 레시피 일렉트론 앱

Fts5 테이블 설계 검색 조건은 전체 컬럼 검색과 각 컬럼 검색을 지원할 생각이다. Sqlite는 fts 라는 가상테이블을 통해 Full text search를 지원한다. Sqlite의 fts5 테이블은 일반적으로 WHERE 절에 붙이는 LIKE 절 보다 훨씬 간편한 조건 문법과 좋은 검색 성능을 제공한다. 전체 검색 또한 모든 컬럼을 일일히 탐색할 필요 없이 간단하게 가능하다는 이점이 있다. -- full text search table CREATE VIRTUAL TABLE tb_fts_recipe USING FTS5( title, ingredients, instructions, id, tokenize = 'porter' ); 먼저 CREATE 문으로 fts5 테이블을 생성한다. 각 컬럼은 원본 테이..

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

[Electron] 1.데이터셋 및 DB 생성 - 레시피 일렉트론 앱

개요 Electron을 알게되면서, 이를 활용해 간단한 데스크톱 앱을 만들고 싶었다. 네트워크가 필요하지 않은 Stand Alone의 형태로 간단한 검색 기능 등을 가진 앱을 생각했고, 그에 맞는 DB가 되어줄 데이터셋(CSV)부터 찾기 시작했다. 데이터셋 구하기 적합한 데이터셋을 찾고 있었는데, 원하는 조건의 csv 데이터셋을 찾기 쉽지 않았다. 조건은 아래와 같다. 검색에 충분하도록 최소 1000개 이상의 레코드를 가지고 있을 것 각 레코드에 맞는 이미지 파일이 포함되어 있을 것 id 제외 최소 3개의 컬럼을 가질 것 id 제외 컬럼의 모든 데이터의 길이 합이 500자 이상일 것 (파일화를 위해) 위와 같은 조건을 먼저 정한 이유는 간단한 검색 앱이기 때문에 결과 화면을 풍성하게하고 부가적인 기능 (..

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