728x90
반응형

가장 기본적인 개발환경이 설정되었다.

잠깐 요약해보면 이전 블로그 포스팅에서 다음 리스트를 설치했었다.

  • Rust 설치
  • VSCode 설치 + 플러그인 설치
  • Tauri 설치 [create-tauri-app]
  • Tauri 프로젝트 설정 [Tauri + Cargo + yew]

설치 후 Tauri + yew 샘플페이지가 정상적으로 실행되는걸 확인했으니 앞으로 개발할 App에서 사용할 기술이 어떤것이 있는지 확인해볼 차례다. 이제 겨우 개발환경 기초만 만들었기 때문에 앞으로 가야할 길이 멀긴하다.

자 그럼 어떤기술이 필요할 것인지 전체적인 App의 기능에 대해서 기획해볼 차례다.

  1. 업비트, 바이낸스 (혹은 기타 거래서 API) Websocket, Restful API 를 통해서 필요한 거래정보를 가져온다. (API 신청이 완료되었다고 가정한다. : 댓글이나 메일로 API 신청에 대해서 자세히 알고 싶다는 요청글이 많아지면 별도로 작성하겠지만 API 신청에 대해서는 이미 많은 정보들이 있으므로 검색해서 찾아보도록 하자)
  2. 코인리스트를 우측에 보여주고 체크된 코인에 대해서 오른쪽 화면에 Grid 형태로 필요정보를 지속적으로 갱신해준다.
  3. 개인이 설정한 전략에 따라서 자동, 반자동, 수동 매매를 할 수 있도록 버튼을 배치한다.
  4. 간략한 차트를 볼수 있게 버튼을 구성하거나 차트를 기본적으로 보여주도록 한다.
  5. 매매 전략에 부합되는 코인들에 대해서 알림을 해준다.
  6. 현재는 현물 거래만 지원하고 추후 비트코인 및 원하는 알트코인에 대한 선물 매매기능도 지원한다.
  7. 특정 알고리즘에 부합되면 Telegram Bot으로 채널에 알림을 전송한다.
  8. 오류가 발생하거나 이상이 발생하면 Telegram 이나 email, sms 메세지로 알림을 전송한다.
  9. 코인 마켓메이커의 성향을 반영한 매매전략을 수립할 수 있도록 한다.

대략적인 기능을 나열해봤는데 구현하려면 꽤 많은 학습이 필요할 것 같다. 왜냐하면 처음 해보는 언어이기 때문에 어떤 crate 들이 필요한지 체크해야 하고 적합성도 확인을 해야 하는데 그렇게 간단한 일이 아니다. 그렇지만 일단 Just Do It 프로젝트이기 때문에 과감하게 진행하면서 문제점들을 해결해나가야 한다. 

너무 고민을 오래 하지말자. 시간만 가고 머리속 지식으로 끝나버리는 경우가 너무 많다. 최근에 [클루지(Kluge)] 라는 책을 읽었는데 내가 가진 문제를 콕 찝어서 해결책을 알려주는것 같은 책이었다. 

 

클루지 : 어떤 문제에 대한 서툴거나 세련되지 않은 (그러나 놀라울 만큼 효과적인) 해결책

너무 깊은 고민에 어떤일을 진행하지 못하는 나쁜 습관을 가지고 있다면 꼭 한번 읽어보도록 하자. 의외의 해결책을 깨달을지도 모른다.

자 책소개는 이정도만 하고 본론으로 돌아가 보자.

위의 기능을 구현하기 위해 필요한 개발 기술들을 나열해보도록 하자

  • Winform : Tauri
  • Webform : Yew (WASM)
  • Websocket : Tokio, Actix
  • GUI : Tarui - EGUI

위의 기술들은 비교적 신규 기술들이므로 지속적으로 발전하고 급격한 변화를 맞아서 소스코드를 뒤엎을 수도 있을지도 모른다. 하지만 현재 구상한 프로젝트를 만들기 위한 최적의 기술들을 나열해봤다.

일단 진행해본다. 진행하다보면 기술적난제나 난이도 때문에 교체가 필요할지 모르겠지만 선택한것을 믿고 가도록 하자.

728x90
728x90
반응형

개발 환경은 Windows 기반으로 진행한다. Docker나 Windows WSL2 로 설정해서 Linux 상에서 개발을 하는것도 나쁘지 않은데 지금은 최대한 빠른템포로 작업을 해야 하기에 익숙한 Windows 환경에서 개발을 전제로 진행할것이다.

VS Code는 설치되어 있다고 가정한다.
Tauri VS Code Extension 추가

개발 OS : Windows 11 (Windows 10에서는 Webview2가 어떻게 설치되는지 확인안됨)
개발언어 : Rust
프레임워크 : Tauri, Yew
DB : 미확정
패키지매니저 : cargo, trunk


먼저 Tauri에서 Webview2를 사용하므로 현재 OS에 Webview2가 설치되어 있는지 확인해보자 (Linux와 macOS는 다름)

1. Rust 설치

https://www.rust-lang.org/learn/get-started

 

Getting started

A language empowering everyone to build reliable and efficient software.

www.rust-lang.org

현재 설치된 Windows OS가 32bit이면 왼쪽, 64bit 면 오른쪽 버튼을 클릭해서 Rust를 설치한다.

설치 후 cmd (Command 창)을 실행해 다음을 입력해본다.

rustc --version

버전이 표시되면 설치가 정상적으로 된것이다.

2. create-tauri-app 설치

RUST 를 설치하면 Cargo가 설치된다. Cargo 는 RUST 의 패키지의 의존성을 관리해주는 패키지 관리자 이다.

요즘 각 언어들의 패키지를 관리해주는 패키지 관리자들이 너무 많은데 여러 언어들을 조합해서 사용하다 보면 각각의 패키지 매니저들의 명령어들을 알아야 하는데 조금씩 틀려서 너무 헷갈린다.

시간내서 주로 사용하는 패키지 매니저들을 수집해보고 많이 사용하는 명령어들을 한곳에 모아두는 글을 작성해볼까 한다. 내가 너무 힘들다. 명령어 각각 외우려니깐 뒤죽박죽이 되어서 계속 헤맨다.

자 일단 Tauri app 프로젝트를 만들기위해 create-tauri-app 을 설치해보자

cargo install create-tauri-app

설치가 완료되면 설치된 패키지 확인을 해본다.

tauri-cli도 설치를 해야 하는데 create-tauri-app을 설치하면 패키지 리스트에는 나타나지 않지만 같이 설치가 되는것 같다.(좀 더 확인이 필요함)

cargo install --list

정상 설치가 확인이 되면 개발할 프로젝트를 생성해보자.

일단 프로젝트 명칭을 정해야 한다. 프로젝트명이 폴더명이 되므로 원하는 명칭을 미리 생각해둔다.
현재 프로젝트는 graduateapp-yew 로 정했다.

프로젝트 생성을 할때 다음의 절차를 가진다.

1. 프로젝트 명 등록 : 폴더명
2. 패키지관리자를 선택한다 (cargo, pnpm, yarn, npm)
3. 사용할 프론트엔드 프레임워크
> 어떤 패키지 관리자를 선택하느냐에 따라 선택할 프론트엔드 프레임워크가 다르다.
> 현재는 yew를 사용할 것이므로 cargo를 선택한다.

이렇게 3가지를 등록 선택하고 나면 프로젝트가 생성된다.


기본적인 템플릿형태로 프로젝트가 생성되기 때문에 한번 실행해 볼 수 있다.

하지만 yew의 경우는 별도의 추가적인 설치가 더 추가되어야 한다.

WASM 을 빌드/배포 하고 localhost 서버를 구동해주는 모듈이 필요한데 2가지 중 선택해서 사용하면 된다.

Trunk 사용

https://www.yew.rs/docs/getting-started/project-setup/using-trunk 

 

Using trunk | Yew

Install

yew.rs

wasm-pack 사용

https://yew.rs/docs/getting-started/project-setup/using-wasm-pack

 

Using wasm-pack | Yew

This tool was created by the Rust / Wasm Working Group for building WebAssembly applications. It supports packaging code into npm modules and has an accompanying Webpack plugin for easy integration with existing JavaScript applications. More information is

yew.rs

 

trunk는 빌드/배포와 local서버를 같이 사용할수 있고 wasm-pack은 빌드만 가능하고 local서버를 별도의 외부 모듈을 사용하는 형태로 사용되는데 자신에게 맞는 형태의 것들 사용하면 되겠다. 두가지의 장단점은 아직 잘 모르겠다. 그런데 특이하게 wasm-pack 의 인기도가 더 높은것 같아보여서 혹시 나중에 정리할 수 있다면 정리해보도록 하겠다.

그리고 현재 wasm-pack 을 cargo로 설치하면 openssl 관련 오류 떄문에 설치가 정상적으로 되지 않는데 wasm-pack 홈페이지에서 제공하는 exe 파일을 다운받아서 실행하면 사용가능하다.

일단 이번 프로젝트에서는 trunk 를 사용하기로 하고 trunk 관련 모듈을 설치한다.

# WebAssembly 대상 설치
rustup target add wasm32-unknown-unknown

# Trunk 설치
cargo install --locked trunk

# need to install wasm-bindgen manually.
cargo install --locked wasm-bindgen-cli

trunk 와 wasm-bindgen-cli 이 모두 설치되었고 안보이던 tauri-cli v1.1.1 도 리스트에 나타났다.

자 이제 설치는 모두 끝났으니 graduateapp-yew 폴더로 이동 후 앱을 개발모드로 실행해보도록 하자

-- 프로젝트 폴더로 경로를 이동한다.
cd graduateapp-yew

-- Tauri 실행
cargo tauri dev

 

 

정상적으로 실행되었다.

기존에 실행하던 svelte 와 react 연동보다 실행속도가 확실히 빠르다는걸 느낄수 있다.

 

내친김에 release 배포 build도 진행해보자

cargo tauri build

release 빌드를 실행하면 다음과 같은 오류가 발생한다.

 

tauri.conf.json 에 identifier 항목의 'com.tauri.dev' 가 앱 사이에서 유니크한 명칭이어야 한다는것 같은데 관련 글들을 읽어봐도 정확한 의미를 모르겠다. 일단 release 빌드 가능하도록 수정해주자

'com.graduateapp-yew.dev' -> 'com.graduateapp.yew'

그리고 tauri.conf.json 설정 파일에서 몇가지 더 수정해야 할 부분이 있는데 수정하지 않더라도 빌드 및 실행은 상관없지만 최종 배포본을 만들기 위해 언젠간 수정을 해줘야 할부분이라서 몇가지만 수정하고 가도록 한다.

Google 에 tauri.conf.json 으로 검색해보면 상단에 Configuration - Tauri Apps 링크가 보인다. 클릭하여 들어가보자

https://tauri.app/v1/api/config/

 

Configuration | Tauri Apps

The Tauri configuration object. It is read from a file where you can define your frontend assets, configure the bundler, enable the app updater, define a system tray, enable APIs via the allowlist and more.

tauri.app

꽤 많은 항목들이 있는데 추후 필요한부분 체크할때 참고해서 보도록 하자

release 모드로 빌드시 Wix 모듈을 사용해서 자동으로 설치파일을 만들어 주는데 그때 파일명으로 사용하는 속성

Package > ProductName : "GraduateTrading"

프로그램 title 명칭

Windows > title : "원하는 타이틀명칭"

 일단 두 부분만 원하는대로 수정해둔다.

cargo tauri build

다시 빌드를 해보고 target 폴더를 살펴보자

 

release > bundle > msi  폴더에 exe 실행파일이 생성되었다.

 

설치를 해보자

 

Launch GraduateTrading 항목을 체크하고 Finish 버튼을 클릭하자.

거의 Native 앱 정도로 빠르게 실행되는 Tauri App을 볼 수 있을것이다.

Release 모드로 빌드했을때 설치형 exe 파일과 실행형 exe 파일이 동시에 생기는데 설치하지 않고 실행만 하려면 
Target > release 폴더에 있는 GraduateTrading.exe 파일을 직접 실행하면 된다.

 

이제 Tauri 에 대한 경험을 마쳤으니 다음 장부터는 생성된 프로젝트 구조 분석과 Rust - Tauri - Yew - Trunk 간의 관계를 분석해 보도록 하겠다. 그래야 어떤 기술에 먼저 집중할 것인지 결정할 수 있을테니까...

 

Bye~~

728x90
728x90
반응형

어제 Tauri + Svelte 기반의 코인 매매 앱을 만들겠다고 첫글을 올렸다.

검색을 해보다 보니내가 만들 컨셉에 더 맞는 조합이 보여서 추가적으로 브렌치를 따기로 했다.

혹시 돈을 많이 벌기 위해 만드는 거냐고 생각할 수 있겠지만 매매프로그램 만드는게 쉽지 않다. 단순히 포트폴리오 정도로 생각하는게 더 적당할 듯 하다. 혹시(?) 잘되면 뭐 대박!!

 

tauri, yew에 대한 자세한 설명은 별도 카테고리에 설명을 하기로 하고 일단 개발환경 설치 부터 필요기술들에 대해서 하나씩 작성해보기로 하겠다. yew (Webassembly : WASM) 기반의 비동기 프로그래밍을 하기 위한 프론트엔드 프레임워크이다. 아직 초창기 버전이라 커뮤니티도 형성이 되어있지 않고 부족한 부분이 많겠지만 만들려고 하는 컨셉에는 많은 기능의 UI 컨트롤들이 필요하지 않고 성능과 안정성이 더 우선이기 때문에 큰 문제는 없지 않을까 싶다.

Tauri + Yew 기반 실행 화면

https://www.rust-lang.org

 

Rust Programming Language

A language empowering everyone to build reliable and efficient software.

www.rust-lang.org

https://tauri.app/ko/

 

Build smaller, faster, and more secure desktop applications with a web frontend | Tauri Apps

Tauri는 주요 데스크톱 플랫폼을 위한 작고 불티나게 빠른 바이너리를 만드는 프레임워크입니다. 개발자는 사용자 인터페이스를 위해 HTML, JS, CSS로 컴파일되는 그 어떤 프론트엔드 프레임워크라

tauri.app

https://yew.rs

 

What is Yew? | Yew

Yew is a modern Rust framework for creating multi-threaded

yew.rs

 

Bye~~

728x90
728x90
반응형

기대하고 있던 Tauri 가 1.0  정식버전이 릴리즈 되었다. -> 1.1 버전으로 최근에 업그레이드 되었네.

Electron의 무거움에 배울까말까 고민하고 있던 터엿는데 Tauri가 출시되면서 학습할 동기를 만들어준것 같다.

그래서 학습용으로 뭘 만들까 고민을 하다가 코인 매매앱을 만들어 보기로 했다.

이름은 심플하게 GraduateApp-TAURI 이다. 코인으로 졸업하게 해주세요 젭알!!! ㅠ.ㅠ

농담이고 일단 많은 기술적인 난제가 있을것 같긴한데 하나하나 만들어가면서 방법을 찾아보도록 하겠다.

개발초기 몇년간은 웹쪽에 관심이 있다가 너무 급여가 팍팍한데다가 정적인 페이지 기술의 한계가 보여서 CS(C#, JAVA)계열로 넘어갔지만 웹에 대한 관심은 항상 있었다. 그래서 하나 배워서 다 같이 연동해서 써먹을 수 있는게 없을까 항상 고민을 했는데 최근에 찾은 언어가 Rust 이다. 시스템 프로그래밍, 웹, 모바일, 데스크탑 프로그래밍  모두 가능하도록 계속 진화하고 있는데 지켜보고 있으면 뿌듯해진다. 내 주력언어가 되기를 기원하며 조금씩 학습을 진행하고 있다.

하지만 Rust는 아직 비주류 언어라서 대한민국에서 취업을 위해 배우기에는 시간적 리스크가 있고 학습곡선도 높기때문에 일반적인 업체 취업용으로는 추천하지 않는다. 다만 긴 호흡을 가지고 꾸준히 배우고 싶다면 한 번 도전해도 좋지 않을까 싶다. 그리고 Svelte도 핫한 언어이긴 하지만 취업용으로는 아직 추천하지 않는다.

이 메뉴 카테고리는 Tauri Svelte Vite 를 가지고 개인적인 프로그래밍을 하면서 학습내용을 정리하고 공유하는 곳이기에 Rust에 대한 사설은 더 하지 않겠다. Rust는 별도 메뉴에서 다룰 예정이다.

===============================================

Tauri가 뭔가?  황소!!

https://www.tauri.app

 

Build smaller, faster, and more secure desktop applications with a web frontend | Tauri Apps

Tauri is a framework for building tiny, blazing fast binaries for all major desktop platforms. Developers can integrate any front-end framework that compiles to HTML, JS and CSS for building their user interface.

tauri.app

https://vitejs.dev/

 

Vite

Next Generation Frontend Tooling

vitejs.dev

https://svelte.dev/

 

Svelte • Cybernetically enhanced web apps

Svelte is a radical new approach to building user interfaces. Whereas traditional frameworks like React and Vue do the bulk of their work in the browser, Svelte shifts that work into a compile step that happens when you build your app. Instead of using tec

svelte.dev

 

짜잔~~

개발에 사용할 굵직한 기술 3가지이다.

이렇게 3가지를 선택한 이유는 간단하다.

코인앱을 만들기에 속도적인 부분이 좀 중요한 포인트기 때문이다.

처음에는 Electron + Viewjs or React를 고민했는데 대체 할수 있고 성능적인 부분도 우위에 잇는 Tauri와 Svelte가 나타나서 냉큼 바꿔버렸다.

하나씩 기술적인 내용을 확인하고 개발목표와 목차들을 구성해 보도록 하자.

 

Bye!!

728x90

+ Recent posts