http://semantic-ui.com has always looked pretty good too.
3 Likes
SemanticUI is absolutely amazing and needs more love 
. Half a year ago we switched from using Bootstrap to SemanticUI for our new projects, and we havenāt looked back. These are the regions it outperforms Bootstrap (and, in my opinion, Zurb Foundation as well):
- The used classes are a lot easier to remember, as styles are chosen by a combination like
large purple buttoninstead ofbtn btn-lg btn-primary - Wherever applicable, the used classes are standardized, e. g. colours and size modifiers work the same, regardless of used with buttons, text headers, notice/alerts images, etc.
- Very clever sesign choices for the JS-interactivity libraries.
- It is easily customizable through Sass (which has more features than Less)
- Proper use of transparency in things like e.g. table backgrounds. This was one of the things that always annoyed me in Bootstrap.
As Css-precompiler I like to use Sass(Scss) , because it has a lot of features that Less doesnāt provide. Unfortunately, using Sass in phoeniz right now is somewhat problematic, as Brunchās only sass-compiler plugin is broken (it outputs an empty style file half the time and adter that does not register any more changes until Brunch is restarted).
4 Likes
Oh, and we use Haml in our Rails projects. Once you get used to the syntax (which you can do in <30 minutes), it will make for a lot cleaner html templates than erb/eex and the likes. There is a phoenix haml package, which, although not entirely feature-complete yet works great!
2 Likes
Weāre using ember.js as frontend in our Rails project, and emblem.js as alternative for handlebars.js for our markdown. So far so good. 
2 Likes
Iāve always been a big fan of Slim over Haml. Same idea, just much cleaner.
Iāve been working in a company where half of the templates are in Slim, and the other half is still in Haml. This is definitely a bad idea, as switching between the two is hell.
Slim and Haml are very similar, but Haml has some advanced features that I like over Slim:
- The ability to add conditional attributes to my elements by evaluating code inside the attribute
{}part, including the ability to pass arrays to attributes that are concatenated automatically. - The ability to write normal text without having to prefix it with a
|.
Of course, this is very personal. ^^ā
In any case, both methods are a lot more readable and maintainable than Embedded PHP/Ruby/Elixir-style html.
2 Likes
Looks like Phoenix has options for both at least.
HAML: https://github.com/chrismccord/phoenix_haml
Slim: https://github.com/slime-lang/phoenix_slime
3 Likes
All I know is React now but I am interested in Ember (convention over config!) and Elm. Anyone here use Ember?
2 Likes
I think you meant āconvention over configā Iām also using Ember (you can check out my side project here). I really liked it and favor it for single page apps.
It was years ago so Iāve used Rails as back-end but now Iād go with Phoenix as it seems to be a great fit for Ember (and any framework that just needs some solid API). Ember has picked up many nice ideas from React and its development cycle is pretty stable.
1 Like
Thanks, fixed.
Yeah I like how Phoenix is a bit opinionated and has generators for stuffāI love React but it can get a bit crazy. I just need time to look into Ember more D:
1 Like
Ember.
A few reasons:
- Complete package with routing, data models, and testing facilities.
- Core teamās dedication to long-term stability and proper release management.
- Gold standard for tooling.
- Unapologetically steals the best ideas from other communities.
React has a nice future, but Iām going to wait for the dust to settle and for the community to build a complete framework and set of tools. I looked about a month ago and still there are 1000s of boilerplate options all with different opinions. Iāll swing back around in a few months and see how things are doing.
Cheers,
Ben
1 Like
React is not framework it is library. You need something more to build app than library. I think there will be always one plus option to build web app with react. Is bad or good it depends
If you you want something more opinionated:
- Ember
- Angular2 (it has cli.angular.io based on Ember) -> most adoption in enterprise (Google, Microsoft)
- http://aurelia.io/
- http://elm-lang.org/ for ML syntax lover
1 Like
Anyone has experience with Vue.js? Iāve mostly worked with React and am an huge fan. However, when working with Phoenix/Elixir you basically have to design your app as a React app that consumes a JSON API. This can be great, but it can certainly be overkill. In that respect vannila JS/jQuery is amazing, where you can add JS when needed.
Vue.js seems to be highly praised, it offers the same components principle, itās more lightweight, and describes itself as a progressive framework. And progressive in this context means, can be introduced step by step. In my limited experience it seems to hit a sweet spot between a React app with a JSON API, and Phoenix + vanilla JS/jQuery.
3 Likes
Iāve worked with Vue.js for a little bit, itās quite alright.
Iām not a fan of front-end frameworks and libraries at all though. All the projects I do at work consist of custom CSS (BEM styling), so no Bootstrap or anything. Modular and reusable HTML templates with clean ES6 JavaScript, no jQuery. This results in extremely fast websites with clean code and easily reusable components.
I find Elm the most interesting front-end framework at the moment, but because the whole front-end world is changing so fast at the moment Iām not betting on any of them yet.
2 Likes
HTML tempaltes & ES6 w/o jQuery sounds interesting. I think you are not talking about ES6 template strings? Do you have an example project on github?
1 Like
Bootstrap because itās popular (easy to find answers and add-ons). Iām interested in evaluating others, but Iām not a frontend guy so itās hard to justify the cost, especially since Bootstrap is sufficient and (I think) the most popular.
I also just use plain CoffeeScript, no libraries or frameworks. Err, ok, jQuery and maybe Underscore (for libraries). Like others, I hate Javascriptā¦ the language itself and also its ecosystem; too many languages that compile down to JS and too many frameworks and libraries. Itās just ridiculous.
! Awesome to see some SemanticUI love.
Have you done any apps with Phoenix & Semantic UI, and if so, how do you structure your files?
I currently have it installed at web/semantic/ and then build semantic.css and semantic.js to /web/static/assets, but was curious what arrangement others might be using.
1 Like
I wonder how you guys decide to separate the frontend from Phoenix, to use something like React, Angular or Ember. In what situations do you do this?
2 Likes
