[Flutter] Online Multitools 개발기

Flutter를 공부해본 김에 평소에 필요했던 것을 한 번 만들어 봤습니다.

 

https://hmultitools.web.app/

HoYa's Online Multi Tools

 

임베디드 개발자이다보니 비트단위 계산을 하는 경우가 많아서, binary, hex 계산기가 필요해서 만들기 시작했어요.

 

만드는 김에 계산기 시리즈로 만들어볼까? 싶어서 평소에 카드 할인 같은 거 계산할 때 필요했던 할인 계산기도 만들고, 온라인 쇼핑할 때 대략적인 환율 정보를 매번 검색하느라 귀찮아서 환전 계산기도 만들었어요. ㅋㅋ

 

거기에 추가로 가끔 우리나라는 안쓰는 단위 정보가 쉽게 변환이 안되서 헷갈려서 필요했던지라 단위 변환기도 만들어 넣고, BMI 계산기도 넣어봤어요.

 

이제 사용해 보면서 버그도 잡고 추가로 필요한 게 생기면 하나씩 덧붙여 보려고 합니다.

 

이번 포스팅에서는 개발하면서 있던 것들을 가볍게 다뤄볼게요.

Calculator for Programmer

계산기는 20년도 더 전쯤 C언어로 프로그래밍을 배우던 시절에 처음 만들어 봤었는데, 오랫만에 다시 만들어봤습니다.

 

사용자 입력을 분석해서 계산을 해야하다보니 단순하게 식을 평가하는 방식보다 직접 만드는 방법을 택했어요.

 

잘 알듯이 스택을 사용해서 중위 표현식을 후위 표현식으로 바꾸어 연산을 하도록 해줬어요.

 

또, 괄호 앞뒤에 연산자가 없이 피연산자가 오면 자동으로 곱셈으로 바꾸는 트릭도 넣어줬고요. ㅎㅎㅎ

 

10진수의 경우, 큰 숫자는 한 눈에 파악하기 어려울 수 있어서 ,로 구분하도록 했어요.

 

고생을 했던 부분은 계산기를 64bit으로 만들려고 했던 부분이에요.

 

Flutter Web으로 만들다보니 dart가 JS로 변환되면서 53bit로 잘라지다 보니 이걸 해결하려고 노력을 좀 했고, 소수점 이하 부분의 컴퓨터 표현 방식의 고질적인 한계로 인한 부분을 해결하기 위한 노력도 좀 했어요.

 

이런 저런 것들을 많이 트라이 한 후, 결국은 decimal package를 사용하는 것으로 타협했습니다. ㅎㅎ

Currency Exchanger

환율 정보를 가져오는 부분에서도 직접 해보려다 고생을 좀 했었어요.

 

CORS 이슈도 있고 API 문제도 있고 해서 그냥 currency_converter package를 사용했습니다.

 

기존에 사용하던 google_fonts와 버전 문제를 일으키긴 했지만, google_fonts의 버전을 하나 내리는 것으로 쉽게 해결했어요.

Unit Converter

별건 아닌 UX 관점에서 히스토리 부분이 정렬이 안맞는 게 좀 거슬려서 소수점 몇 째 자리까지 유효 자리로 할까를 고민했었는데, 보이는 것보다 숫자가 더 중요한 거 같아서 그냥 위키에 있던 숫자를 그대로 다 사용했어요.

 

부피였나? 단위 중 하나는 위키에 있는 숫자가 잘 안맞는 거 같아서 검색해서 다른 숫자를 갖다 쓰기도 했고요.

Wrap Up

확실히 UI를 만드는 게 참 쉽고 편했습니다.

 

막힐 때 찾아볼 자료들이 많은 느낌은 아니었는데, 그래도 어찌저찌 있는 자료들로 그다지 어렵지 않게 극복이 가능하긴 했어요.

 

모바일 위주로 만들어 보다, 처음으로 웹용을 만들어 본 것이었는데 나중에는 desktop용 프로그램도 하나 만들어봐야겠어요.