Logo Questions Linux Laravel Mysql Ubuntu Git Menu
 

Best practice for Laravel 4 + Zurb Foundation 5?

TL;DR: what is the best way to arrange files, package managers and build tools for Laravel 4 + Zurb Foundation 5 combo (with Compass) as one consistent repository with clean public (static) section?


I wanted to start a fresh project, based on latest Laravel on the backend side and using Foundation for the frontend. I am new to both of these and apparently I missed some of the tooling that was developed meanwhile when I wasn't doing PHP for some time.

My confusion:

  • Laravel uses Composer for installation and dependency/module management. (Ok, I'm new to Composer)
  • Foundation is available as a Composer module (but then what?), but generally also as a CLI tool that creates a new project and uses bower for module/dependency management. But then I have two repositories.
  • Is it required for me to expose all my .scss files, or maybe even put the whole Foundation project into laravel's public dir to make all work?

How do people usually approach using these frameworks together? They shouldn't interfere, but they still have totally different tooling.

Where do I put my foundation files? Keep it as composer module or inside public? How to refer to them? How to have one build everything command?

like image 266
ikari Avatar asked Jan 31 '14 13:01

ikari


1 Answers

I have the same issue as using Bootstrap SCSS version for Admin & Foundation SCSS for the frontend. I noticed also that both css frameworks come as composer packages however the issue you have with this approach is that you generally use other Javascript files in a development that will be merged also so using the composer versions just adds to the confusion.

The best solution i found was using either gulp or grunt with bower at the top level of your Laravel build. Rather that go through the configuration for you there is a good article at http://blog.elenakolevska.com/using-grunt-with-laravel-and-bootstrap/ that goes over a bootstrap integration but this can be tweaked for Foundation. This solution is good as grunt has many of the other popular javascript libraries that you may use in your project also..

Alternatively you could use an application like codekit and create a compass project to manage the merging & compiling of your assets into the public folder. As a side note if using git again your would need to exclude additional folders from your project.

If you think of your SCSS framework files as development assets there is no real need for them to be in the project as you only really need one version of Foundation on your development machine.

Your custom SCSS changes can be added to your Laravel project as modules ie a navigation module, via a private composer repo for the project or just added to the Compass project at development time. Your public folder should only be referencing the final merged style.css & java.js files for example. Any images from the framework can then just be copied over to the public folder ie icons etc.. Hope that helps..

like image 138
Richard Avatar answered Oct 25 '22 01:10

Richard