Elm：您将如何构建和设计您的 UI？
Elm: How would you build and style your UI?
在过去的几天里，我学习了 Elm，这是一次令人耳目一新的体验。这么多，我不想回到 JS 领域，:-(。
我的问题是我仍然没有找到用 elm 制作网络应用程序的方法，我希望得到一些指导和建议：
evancz/start-app 非常适合组织应用程序的结构。
evancz/effects together with elmfire can handle talking to Firebase.
但是我将如何构建和设置 UI 的样式？
举个具体的例子：a styled select widget from Semantic-UI.
它被实现为 div 列表，以及一些 JS 来处理下拉列表和 multi-select.
目前我找到的备选方案是：
- 包括 Semantic 的 CSS 和 JS（它需要 JQuery）并使用 ports 挂接到小部件的 JS 事件。
- 仅包括语义的 CSS 并尝试在 Elm 中构建功能。
- 两者都在 Elm 中构建功能和样式 (adam-r-kowalski/Elm-Css)。
- 忘记语义并使用 circuithub/elm-bootstrap-html.
在 Bootstrap 中重做站点
是否还有我遗漏的其他替代品或可重复使用的小部件？
TheSeamau5/TabbedPages 容器确实令人生畏。
其他小部件需要这么多工作吗？
同样，我很想在我的项目中使用 Elm，但我没有知识也没有时间自己编写所有小部件。
对于上下文，我使用的 Semantic 小部件是：
- 两个汉堡菜单，屏幕的每一侧各一个。
- 样式 select.
- 披露三角，hiding/showing 更多内容。
- 类似旋转木马的图像显示，prev/next 和底部的圆点。
再次感谢您为 Elm 所做的工作，以及您可以给我的任何建议。
PS: 我也在elm的邮件列表中发布了这个问题。
首先，作为 TabbedPages 容器的作者，对于复杂性，我深表歉意。该组件实际上是一个实验，旨在了解使用 Elm 和 Elm 架构以及内联样式的可能性。简而言之，该组件的想法是允许选项卡+可滑动页面组件，其中选项卡和页面的内容都是未知的，并且整个内容都使用内联样式进行样式设置。这可能是制作组件最困难的路线，尽管它有其优点。
至于实现小部件，请将 Elm 视为一种创作方式 Html（就像一个超级高级的 Jade）。这意味着您可以只写 html 并给每个 div 一些 类 并在 CSS 中设置 类 的样式（或您选择的任何预处理程序）。这意味着，不，您的小部件不需要像 TabbedPages 那样多的工作。
最好的做法可能是包含 CSS 并可能在 Elm 中重做 JS 部分。这将为您提供 Elm 的许多保证，而无需为组件的工作付出太多成本。
至于野外的组件，不幸的是目前 Elm 还很年轻，所以目前还没有很多。将来可能会改变，但目前情况并非如此。
最后，对于汉堡包菜单，Elm 中有两个很棒的包可以提供 svg 图标
两者之间大约有不到 1000 个图标可供选择（我想，我还没有真正数过），它们只是功能，因此非常易于使用。它们生成 Svg 这只是 Html 类型的另一个名称，因此您可以互换使用两者。
简而言之，目前最好的方法是在 Elm 中编写 html 和逻辑，在 CSS（或 Sass/Less/Stylus/etc...）中编写样式。你的大部分逻辑只是切换 div 中的 类，就像 jQuery.
为此，我建议遵循 Elm 架构：
init : Options -> Model
update : Action -> Model -> Model
-- or update : Action -> Model -> (Model, Effects Action)
-- if you need effects like http
view : Address Action -> Model -> Html
关于行内样式，暂时不用太担心。这是一项正在进行的工作，并且在 space（如 elm-css）中正在发生许多突破，并且当人们开始掌握它时，您可能会开始看到一些博客文章和组件出现。 （不幸的是，这就是当你修补尖端时会发生的事情......虽然，如果你想加入发现的乐趣，Elm 社区非常热情而且非常有趣，因为似乎每个人都在一起学习：D）
我也想知道这个问题，关于使用 Bootstrap 你可以使用 CSS 类 但这会变得混乱。
最后你将编写单独的 CSS 文件并使用 LESS 或 SASS 或 Stylus 或编译为 CSS.
的其他语言
所以在你的 Elm 代码中，使用 CSS 类:
div [ class "whatever" ] [ text "Hello world" ]
我会使用端口来包装外部 JS 组件。
我知道很久以前就有人回答了这个问题，但我想我应该为 Elm 0.17 和 0.18 添加 0.02 美元。查看 Material Design Lite components, for 0.17, and forked for 0.18。
Live Demo site 圆滑而详尽。
在过去的几天里，我学习了 Elm，这是一次令人耳目一新的体验。这么多，我不想回到 JS 领域，:-(。
我的问题是我仍然没有找到用 elm 制作网络应用程序的方法，我希望得到一些指导和建议：
evancz/start-app 非常适合组织应用程序的结构。
evancz/effects together with elmfire can handle talking to Firebase.
但是我将如何构建和设置 UI 的样式？
举个具体的例子：a styled select widget from Semantic-UI.
它被实现为 div 列表，以及一些 JS 来处理下拉列表和 multi-select.
目前我找到的备选方案是：
- 包括 Semantic 的 CSS 和 JS（它需要 JQuery）并使用 ports 挂接到小部件的 JS 事件。
- 仅包括语义的 CSS 并尝试在 Elm 中构建功能。
- 两者都在 Elm 中构建功能和样式 (adam-r-kowalski/Elm-Css)。
- 忘记语义并使用 circuithub/elm-bootstrap-html. 在 Bootstrap 中重做站点
是否还有我遗漏的其他替代品或可重复使用的小部件？
TheSeamau5/TabbedPages 容器确实令人生畏。 其他小部件需要这么多工作吗？
同样，我很想在我的项目中使用 Elm，但我没有知识也没有时间自己编写所有小部件。
对于上下文，我使用的 Semantic 小部件是：
- 两个汉堡菜单，屏幕的每一侧各一个。
- 样式 select.
- 披露三角，hiding/showing 更多内容。
- 类似旋转木马的图像显示，prev/next 和底部的圆点。
再次感谢您为 Elm 所做的工作，以及您可以给我的任何建议。
PS: 我也在elm的邮件列表中发布了这个问题。
首先，作为 TabbedPages 容器的作者，对于复杂性，我深表歉意。该组件实际上是一个实验，旨在了解使用 Elm 和 Elm 架构以及内联样式的可能性。简而言之，该组件的想法是允许选项卡+可滑动页面组件，其中选项卡和页面的内容都是未知的，并且整个内容都使用内联样式进行样式设置。这可能是制作组件最困难的路线，尽管它有其优点。
至于实现小部件，请将 Elm 视为一种创作方式 Html（就像一个超级高级的 Jade）。这意味着您可以只写 html 并给每个 div 一些 类 并在 CSS 中设置 类 的样式（或您选择的任何预处理程序）。这意味着，不，您的小部件不需要像 TabbedPages 那样多的工作。
最好的做法可能是包含 CSS 并可能在 Elm 中重做 JS 部分。这将为您提供 Elm 的许多保证，而无需为组件的工作付出太多成本。
至于野外的组件，不幸的是目前 Elm 还很年轻，所以目前还没有很多。将来可能会改变，但目前情况并非如此。
最后，对于汉堡包菜单，Elm 中有两个很棒的包可以提供 svg 图标
两者之间大约有不到 1000 个图标可供选择（我想，我还没有真正数过），它们只是功能，因此非常易于使用。它们生成 Svg 这只是 Html 类型的另一个名称，因此您可以互换使用两者。
简而言之，目前最好的方法是在 Elm 中编写 html 和逻辑，在 CSS（或 Sass/Less/Stylus/etc...）中编写样式。你的大部分逻辑只是切换 div 中的 类，就像 jQuery.
为此，我建议遵循 Elm 架构：
init : Options -> Model
update : Action -> Model -> Model
-- or update : Action -> Model -> (Model, Effects Action)
-- if you need effects like http
view : Address Action -> Model -> Html
关于行内样式，暂时不用太担心。这是一项正在进行的工作，并且在 space（如 elm-css）中正在发生许多突破，并且当人们开始掌握它时，您可能会开始看到一些博客文章和组件出现。 （不幸的是，这就是当你修补尖端时会发生的事情......虽然，如果你想加入发现的乐趣，Elm 社区非常热情而且非常有趣，因为似乎每个人都在一起学习：D）
我也想知道这个问题，关于使用 Bootstrap 你可以使用 CSS 类 但这会变得混乱。
最后你将编写单独的 CSS 文件并使用 LESS 或 SASS 或 Stylus 或编译为 CSS.
的其他语言所以在你的 Elm 代码中，使用 CSS 类:
div [ class "whatever" ] [ text "Hello world" ]
我会使用端口来包装外部 JS 组件。
我知道很久以前就有人回答了这个问题，但我想我应该为 Elm 0.17 和 0.18 添加 0.02 美元。查看 Material Design Lite components, for 0.17, and forked for 0.18。
Live Demo site 圆滑而详尽。