Phát triển phần mềm

Phát Triển Phần Mềm Desktop Với ElectronJS: Bài Học Từ Dự Án Auto Photobooth

10 phút đọc3 lượt xem
Phát Triển Phần Mềm Desktop Với ElectronJS: Bài Học Từ Dự Án Auto Photobooth

ElectronJS cho phép xây dựng phần mềm desktop chạy trên Windows/macOS bằng công nghệ web, đồng thời truy cập phần cứng thực như máy in, camera và GPS. Dự án Auto Photobooth cho tiệm ảnh Hiếu là ví dụ thực tế nhất về những gì công nghệ này có thể làm cho doanh nghiệp nhỏ.

ElectronJS Là Gì Và Tại Sao Nó Quan Trọng?

ElectronJS là framework mã nguồn mở của GitHub, cho phép lập trình viên dùng công nghệ web (HTML, CSS, JavaScript/TypeScript) để tạo ra ứng dụng desktop chạy được trên Windows, macOS và Linux. Những phần mềm quen thuộc như VS Code, Slack, Discord, và Figma đều được xây bằng Electron.

Câu hỏi thường gặp: "Nếu có web app rồi, sao không chỉ dùng browser?" Câu trả lời nằm ở khả năng truy cập phần cứng. Web app chạy trong sandbox của browser — không thể đọc file trực tiếp từ ổ cứng, không điều khiển được cổng USB, không kết nối với máy in nhiệt hay camera theo cách tùy chỉnh. ElectronJS phá vỡ giới hạn đó.

Với doanh nghiệp nhỏ như tiệm ảnh, cửa hàng in ấn, hay kiosk bán hàng — những nơi cần phần mềm tương tác trực tiếp với thiết bị vật lý — ElectronJS là lựa chọn hợp lý hơn nhiều so với web app thuần.

Dự Án Auto Photobooth — Bối Cảnh và Bài Toán

Khách hàng: Võ Minh Hiếu, chủ tiệm ảnh tại Cần Thơ.

Bài toán ban đầu không phải "tôi cần phần mềm ElectronJS." Bài toán là: "Tôi có nhiều máy photobooth cho thuê đặt ở nhiều địa điểm khác nhau. Mỗi lần khách dùng, nhân viên phải xác nhận thủ công, máy hay bị lỗi mà tôi không biết ngay, và tôi không biết máy đang ở đâu chính xác."

Đây là bài toán phổ biến với mô hình cho thuê thiết bị hoặc kiosk tự phục vụ: thiết bị phân tán, khó giám sát tập trung, quy trình thủ công gây sai sót và tốn nhân lực.

Giá trị hợp đồng: 40.000.000 VND

Timeline: 6 tuần (đang triển khai)

Trạng thái: Đang triển khai

Giải Pháp Kỹ Thuật — Từng Tính Năng

Tự Động Nhận Diện Máy Ảnh Và Máy In

Thay vì yêu cầu người dùng cài đặt driver thủ công và chọn đúng máy in từ danh sách, phần mềm tự quét các thiết bị kết nối. Khi khởi động, ElectronJS gọi Node.js API để liệt kê tất cả cổng COM, USB device, và printer queue đang active.

Ưu điểm thực tế: khi nhân viên kỹ thuật cắm máy ảnh mới hoặc thay máy in, phần mềm tự nhận diện mà không cần config lại. Giảm đáng kể số cuộc gọi hỗ trợ kỹ thuật.

GPS Tích Hợp Không Cần Thiết Bị Rời

Một yêu cầu thú vị từ phía khách hàng: theo dõi vị trí của từng máy photobooth mà không muốn lắp thêm thiết bị GPS vật lý (thêm chi phí, thêm điểm hỏng hóc).

Giải pháp: dùng Geolocation API của trình duyệt thông qua Electron renderer process, kết hợp với IP geolocation để xác định vị trí ước tính. Kết quả được gửi lên server cùng với heartbeat định kỳ. Chính xác đến mức phường/quận — đủ để biết máy đang ở địa điểm nào, không cần GPS chính xác đến mét.

Tính Năng Chống Trộm và Bảo Mật

Đây là tính năng nhạy cảm nhất về mặt thiết kế: khi nào nên coi là "có người đang cố thoát phần mềm" và khi nào là "vô tình nhấn nút"?

WinSell triển khai hệ thống phân tầng:

  • Phần mềm chạy ở chế độ kiosk (toàn màn hình, không có taskbar, không Alt+F4 bình thường)
  • Mỗi hành động thoát bất thường (force close, task manager) ghi log và gửi alert về admin dashboard
  • Remote lock: admin có thể khóa máy từ xa ngay lập tức nếu phát hiện bất thường
  • Tự khởi động lại sau 30 giây nếu phần mềm crash (Windows startup registry + watchdog process)

Admin Dashboard Quản Lý Từ Xa

Đây là phần web app đi kèm (chạy trên server, admin truy cập qua browser). Tính năng:

  • Xem trạng thái real-time của từng máy (online/offline, pin, printer status)
  • Xem lịch sử giao dịch (bao nhiêu lần chụp trong ngày, doanh thu)
  • Gửi lệnh từ xa: khóa máy, restart, cập nhật cấu hình
  • Xem log lỗi và alert tức thì qua email/Zalo

Giao tiếp giữa desktop app và dashboard dùng WebSocket (Socket.IO) — cùng công nghệ WinSell đã dùng trong Platform SaaS, nên có sẵn kinh nghiệm.

Những Bài Học Kỹ Thuật Từ Dự Án Này

Bài Học 1: ElectronJS Tốn RAM — Cần Tối Ưu Từ Đầu

Electron mang cả Chromium engine vào ứng dụng — điều đó có nghĩa là mỗi instance chiếm tối thiểu 150–300MB RAM. Với máy photobooth thường chạy hardware yếu (mini PC giá rẻ), đây là vấn đề thực tế.

Giải pháp: tắt tất cả Chromium feature không cần thiết (extensions, spell check, hardware acceleration ảnh), lazy load các module, và giới hạn background process. Kết quả: giảm footprint xuống còn ~120MB trong trạng thái idle.

Bài Học 2: Auto-Update Cần Thiết Lập Cẩn Thận

Khi có nhiều máy photobooth ở nhiều địa điểm, việc cập nhật phần mềm thủ công là không thực tế. Electron có module electron-updater cho phép auto-update. Tuy nhiên, nếu update thất bại giữa chừng (mất điện, mất mạng), máy có thể bị lỗi.

WinSell thiết lập rollback tự động: nếu version mới không khởi động được trong 60 giây, tự động rollback về version cũ. Admin dashboard hiển thị version đang chạy trên từng máy.

Bài Học 3: Giao Tiếp Với Phần Cứng Cần Test Thực Tế

Code test trên máy dev của lập trình viên (driver đầy đủ, máy tính mạnh) khác rất nhiều với thực tế trên mini PC của khách hàng. Phải test trực tiếp trên thiết bị mục tiêu với đúng máy in model thực, đúng loại camera, đúng cáp kết nối.

WinSell yêu cầu khách hàng cung cấp một bộ thiết bị mẫu trước khi hoàn thiện code tích hợp phần cứng. Chi phí vận chuyển thiết bị ra Cần Thơ cho giai đoạn test đã được tính vào hợp đồng.

Khi Nào Nên Chọn ElectronJS Thay Vì Web App?

Không phải dự án nào cũng cần desktop app. Dưới đây là các tiêu chí để quyết định:

Chọn ElectronJS khi:

  • Cần tương tác với phần cứng (máy in, camera, USB, COM port, GPS)
  • Ứng dụng phải hoạt động offline hoặc kết nối internet không ổn định
  • Muốn trải nghiệm native (shortcut, system tray, notifications OS)
  • Cần truy cập filesystem local trực tiếp (đọc/ghi file, xem ảnh local)

Chọn Web App khi:

  • Người dùng truy cập từ nhiều thiết bị khác nhau
  • Không cần tích hợp phần cứng đặc biệt
  • Update thường xuyên (web deploy không cần user cài đặt lại)
  • Muốn tối thiểu hóa chi phí phát triển

Với tiệm ảnh, kiosk, POS, hay thiết bị tự phục vụ — ElectronJS thường là lựa chọn đúng.

Liên Hệ Tư Vấn Dự Án Desktop App

WinSell nhận tư vấn và phát triển phần mềm desktop ElectronJS trọn gói. Xem thêm năng lực đầy đủ tại trang dịch vụ phát triển phần mềm theo yêu cầu hoặc danh sách gia công phần mềm trọn gói.

Câu Hỏi Thường Gặp

ElectronJS có phù hợp cho phần mềm POS bán hàng không?

Rất phù hợp. POS cần in hóa đơn nhiệt, đọc barcode, kết nối màn hình khách, đôi khi cần hoạt động offline khi mất mạng — tất cả đều là điểm mạnh của Electron. Nhiều hệ thống POS thương mại lớn trên thế giới dùng Electron hoặc framework tương tự.

Chi phí làm phần mềm desktop có cao hơn web app không?

Thường cao hơn 20–40% do phức tạp hơn: phải test trên nhiều phiên bản Windows, xử lý driver phần cứng, và thiết lập auto-update. Nhưng nếu bài toán của bạn cần desktop app, đây là chi phí không thể tránh khỏi.

Phần mềm ElectronJS có chạy được trên macOS không?

Có. Electron cross-platform — cùng một codebase compile ra Windows, macOS, và Linux. Tuy nhiên, tích hợp phần cứng (máy in, cổng COM) có thể khác biệt giữa các hệ điều hành và cần test riêng.

Cần bao lâu để làm một phần mềm desktop cơ bản?

Phần mềm desktop đơn giản (không có tích hợp phần cứng phức tạp): 10–20 ngày công. Với tích hợp phần cứng và dashboard quản lý từ xa như Auto Photobooth: 30–50 ngày công. WinSell sẽ ước lượng chính xác sau khi nghe mô tả bài toán.

Thông Tin Liên Hệ

Công ty TNHH WinSell, Số 79 Đường A4, KDC 91B, Phường An Khánh, Quận Ninh Kiều, TP Cần Thơ.

Điện thoại / Zalo: 0817771184 — Email: [email protected] — Website: winsell.vn

Chi Tiết Kỹ Thuật: Stack Công Nghệ Dự Án Auto Photobooth

Với những ai quan tâm đến khía cạnh kỹ thuật, đây là stack được WinSell chọn cho dự án Auto Photobooth:

Electron framework: Electron 28 với contextIsolation bật và nodeIntegration tắt theo best practice bảo mật. Giao tiếp giữa renderer (UI) và main process qua IPC channels được định nghĩa rõ ràng.

Frontend UI: React 18 với TypeScript. Giao diện kiosk được xây dựng trên Tailwind CSS — nhẹ và dễ customize khi cần thay đổi branding.

Backend local: SQLite cho data local (lịch sử giao dịch, cấu hình máy). Khi có mạng, đồng bộ lên MySQL server trung tâm.

Communication layer: Socket.IO cho real-time connection giữa app desktop và admin dashboard. Heartbeat mỗi 30 giây để phát hiện máy offline.

Build và distribution: electron-builder để đóng gói NSIS installer cho Windows. Auto-update qua electron-updater với S3 bucket làm distribution server.

Printer integration: Node.js serialport library cho máy in COM port, node-printer cho máy in Windows Print Queue.

GPS/Location: Electron renderer Geolocation API + IP lookup fallback. Không cần driver hay thiết bị GPS vật lý.

Toàn bộ stack này được WinSell lựa chọn dựa trên kinh nghiệm thực tế — không phải lý thuyết. Mỗi quyết định kỹ thuật xuất phát từ yêu cầu cụ thể của dự án và ràng buộc về phần cứng của khách hàng.

Tại Sao WinSell Phù Hợp Cho Dự Án Desktop App?

Phần lớn đội ngũ outsource chuyên web app và ngại nhận desktop app vì phải test trên nhiều cấu hình phần cứng khác nhau. WinSell không ngại điều đó — vì đã có kinh nghiệm thực tế từ Auto Photobooth.

Cụ thể hơn: team WinSell đã debug vấn đề máy in không nhận diện được trên mini PC Intel NUC chạy Windows 10 Home — một vấn đề driver đặc thù mà không tài liệu nào ghi lại rõ ràng. Kinh nghiệm này là tài sản thực sự khi nhận dự án desktop app tiếp theo.

Nếu bạn đang có ý tưởng về phần mềm desktop — dù là kiosk, POS, phần mềm quản lý nội bộ, hay ứng dụng tích hợp phần cứng đặc thù — hãy liên hệ để thảo luận trước khi quyết định có outsource không. Cuộc tư vấn ban đầu hoàn toàn miễn phí.

Chia sẻ:

Bài viết liên quan