플랫폼·앱
당류·나트륨을 각설탕으로 보여주는 뷰어
바코드를 읽어 당류를 각설탕 개수로 바꿔 보여 주고, 그 수치가 어느 데이터에서 나왔는지도 함께 적습니다.
glucose-salt-viz-demo-157245-production.up.railway.app
열어 보시면 이런 걸 확인하실 수 있습니다
- 샘플 바코드를 눌러 스캔하면 당류가 각설탕 개수로 바뀝니다
- 표기 기준을 총 내용량으로 바꾸면 7개가 13.5개로 다시 계산됩니다
- 결과 화면 출처 리본에서 조인 성공 여부와 빈 필드를 확인할 수 있습니다
- 관리자 화면에서 계수를 4g→3g으로 바꾸면 모든 수치가 함께 바뀝니다
만들면서 풀어야 했던 것
- 앱이 그려 낸 바코드를 앱의 디코더가 읽지 못했습니다. 모듈 폭을 올림 처리해 인접한 막대가 겹친 것이 원인이어서 경계를 반올림 좌표로 잡고, '그려서 다시 읽는' 왕복 검증을 테스트에 넣었습니다. 기존 테스트가 다른 경로를 검사하느라 이 문제를 통째로 지나쳤던 점도 함께 막았습니다.
- 표기 기준을 바꿔도 각설탕 개수가 그대로였습니다. 1회 제공량 값이 특정 조건에서만 채워져 비례 환산이 발동하지 못했기 때문입니다. 인식 결과 확인 화면에 1회 제공량 입력을 추가해 배선하고, 1회 제공량 200mL 5개 · 총 내용량 500mL 기준 7개와 13.5개로 다시 확인했습니다.
- 쓰려던 외부 바코드 라이브러리가 파일을 직접 열어 실행하는 환경에서 브라우저 정책에 막혀 로드되지 않았습니다. 저희가 스캔라인 디코더를 직접 구현해, 외부 라이브러리와 별도 바이너리 없이도 인식부터 시각화까지 전 경로가 동작하도록 했습니다.
비슷한 걸 만들어 보고 싶으시다면
구간 견적으로 규모를 먼저 가늠해 보시거나, 조건을 적어 보내 주시면 범위를 정리해 회신드립니다.