В течение последних нескольких дней я узнаю о Elm, и это был освежающий опыт. Настолько, что я не хочу возвращаться в землю JS: - (.
Моя проблема в том, что я до сих пор не вижу способа создать веб-приложение с вязами, и мне бы хотелось, чтобы некоторые рекомендации и рекомендации:
evancz/start-app отлично подходит для организации структуры приложения.
evancz/effects вместе с elmfire может работать с Firebase.
Но как я буду создавать и настраивать пользовательский интерфейс?
Возьмем конкретный пример: стилизованный виджет выбора из Semantic-UI.
Он реализуется как список divs вместе с некоторыми JS для обработки выпадающего меню и множественного выбора.
Альтернативы, которые я нашел до сих пор:
Существуют ли другие альтернативы или виджеты, которые могут быть повторно использованы, которые мне не хватает?
Контейнер TheSeamau5/TabbedPages, безусловно, пугает. Будут ли другие виджеты выполнять эту работу?
Опять же, я бы хотел использовать Elm для моего проекта, но у меня нет знаний и времени, чтобы написать все виджеты.
В контексте виджеты, которые я использую из семантики:
Еще раз спасибо за работу, которую вы вкладываете в Вяз, и любой совет, который вы можете мне дать.
PS: Я также разместил этот вопрос в списке рассылки elm.
Я знаю, что на этот вопрос ответили давно, но я подумал, что добавлю свои 0,02 доллара за Elm 0.17 и 0.18. Ознакомьтесь с компонентами Material Design Lite, для 0,17 и разветвленными на 0,18.
Сайт Live Demo является исчерпывающим и исчерпывающим.
Прежде всего, как автор контейнера TabbedPages, я хотел бы извиниться за сложность. Этот компонент действительно предназначен как эксперимент, чтобы увидеть, что возможно, используя Elm и Elm Architecture вместе со встроенными стилями. Короче говоря, идея компонента состоит в том, чтобы использовать компоненты tabs + swipeable pages, где содержимое как вкладок, так и страниц неизвестно, и все это стилизовано с использованием встроенных стилей. Это, вероятно, самый сложный путь для создания компонента, хотя он имеет свои преимущества.
Что касается внедрения виджетов, подумайте о Elm как о средстве разработки Html (например, супер продвинутого Jade). Это означает, что вы можете просто написать html и дать каждому div некоторые классы и стилизовать эти классы в CSS (или любые предварительные процессы или выберете). Это означает, что нет, ваши виджеты не будут нуждаться в такой же работе, как TabbedPages.
Лучшим способом действий, вероятно, будет включение CSS и, возможно, повторение JS-части в Elm. Это даст вам много гарантий от Elm, не заплатив слишком много затрат при работе с компонентом.
Что касается компонентов в дикой природе, к сожалению, в настоящее время их немного, поскольку Элм еще молод. Вероятно, это изменится в будущем, но в настоящее время это не так.
Наконец, для меню гамбургера есть два больших пакета в Elm, которые поставляют значки svg
Между двумя там, как чуть меньше 1000 значков на выбор (я думаю, я действительно не рассчитывал), и они просто функции, поэтому они очень просты в использовании. Они производят Svg, что является просто другим именем для типа Html, поэтому вы можете просто работать с двумя взаимозаменяемыми.
Короче говоря, в настоящее время лучший способ - написать свой html и логику в Elm и ваши стили в CSS (или Sass/Less/Stylus/etc...). И основная часть вашей логики просто заключалась бы в переключении классов, которые вы кладете в divs, например, с помощью 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
Что касается встроенных стилей, не волнуйтесь сейчас. Это незавершенное производство, и в этом пространстве происходит много прорывов (например, elm-css), и вы, вероятно, начнете видеть некоторые сообщения в блогах и компоненты, появляющиеся, когда люди начнут его освоить. (к сожалению, это то, что происходит, когда вы возитесь с режущим краем... хотя, если вы хотите присоединиться к радости открытия, сообщество Elm очень приветствуется, и это довольно весело, потому что кажется, что все учатся вместе: D)
Я тоже об этом задумался, что касается использования Bootstrap, вы можете использовать классы CSS, но это может стать беспорядочным.
В конце вы будете писать отдельные файлы CSS и использовать LESS или SASS или Stylus или какой-либо другой язык, который компилируется в CSS.
Итак, в вашем коде Elm используйте классы CSS:
div [ class "whatever" ] [ text "Hello world" ]
Я бы пошел с портами, чтобы обернуть внешние компоненты JS.