Best way to integrate Bootstrap into a Pheonix 1.3 application?

No need for SASS, before, after, brunch, etc… Just put the script src in head?

Sure, just drop it into priv/static/css and link it. Why not? :man_shrugging:

1 Like

Personally I would install it via NPM and then use Brunch to link it to the Phoenix app. However, I haven’t yet done that myself so I don’t exactly know how to do it. It’s fine to also just link it in the <head> from a CDN or download the files and link them locally from the static directory though. I prefer the NPM version because it is properly versioned and you can control when it is updated, etc.

1 Like

With that approach you are dependending on a bunch of js libraries to only install 1 css file. Seems too much work. Though if in the future you can forsee the use of other js libraries, brunch like looks like a good option. Otherwise, the old fashion way gets the job done without much of a hassle

3 Likes

I know is very unlikely but, what if the CDN stops working? For serious apps I’d consider both, CDN and local files.

You have bootstrap-only-css, if you just want CSS styles.

2 Likes

It’s more a matter of “simplest way”, because best would depend on what you’re using bootstrap (or any other lib) for and the remaining architecture of your app. If you’re just using the default bootstrap theme, without customising it, you can just download, copy the distribution files and use that from the priv/static/css (which works just fine), or link to a cdn distribution directly. If you’re doing some customisation to bootstrap, then having the SCSS files and compiling them is better, for which you need a SASS processor, either standalone or using brunch/webpack/wtv…

3 Likes