首页 > 解决方案 > 如何使用 ruby​​ 设计 Web UI

问题描述

使用轻量级框架(如 Sinatra),如何呈现信息并从用户接收信息的最佳方式是易于编码,但令人赏心悦目。

前端设计不是我的强项,所以我正在寻找可以让我直接向用户显示信息并允许用户向后端发起工作请求的选项。这也应该有移动浏览器的支持。

例如,在主页上我想用两个按钮来列出一些机器的状态来开始和停止工作:

System powered:      On
System status:       Idle
Workload present:    True
Last work activated: Today

[Start Work]  [Pause Work]

但我想在眼睛格式、UI 设计和着色上做一些简单的事情,不会让用户挖出他们的眼睛。

我或多或少想向用户输出文本信息并接受按钮按下以在后端触发事件,而不必花几天时间浏览引导框架的文档或学习 CSS、HTML5 和 javascript 的复杂性。

谢谢。

标签: rubysinatra

解决方案


首先,我建议添加与前端相关的标签,例如html cssandjavascriptui design。这样一来,对这些技术(Web UI 设计)有浓厚兴趣的人就可以参与进来并为您提供一些建议/答案。

其次,这个问题似乎相当广泛。一开始您询问了有关呈现和接收信息的问题,然后您有一个前端示例。

无论如何,这是我的答案:

https://jsfiddle.net/tgcmkf0p/6/


推荐阅读