Develop Reference

MeteorJS file in template

I'm working on Meteor app, and we just received a HTML/CSS design, with a custom min.js for a slider, and I would add it in my templates and I don't know how to do it ..

You have to add all the required html, javascript and css files in the package.js file api.addFiles section.
api.addFiles(['css/file1.css', 'js/file2.js','file3.html'], 'client');

Laravel Asset Manager and serving CSS/JS as modules

I'm searching for days now for a proper way to serve the static content for my Laravel 4 website in a most optimal speed performance way. What I tend to obtain is serving only the needed JS and CSS, already minified to each requested page.
Example:
page1.html
-> styles.css - for this page it includes bootstrap.css, jquery-ui, selectize.css, google-custom-maps.css
-> scripts.js - for this page it includes boostrap.js, jquery.js, selectize.ks, google-custom-maps.js
page2.html
-> styles.css - for this page it includes only bootstrap.css
-> scripts.js - for this page it includes boostrap.js
Currently I have all my plugins installed with bower and using gulp tasks I managed to minify all the less, css and js scripts at once, the only problem is I don't know If it is possible to serve only the needed files for a custom page.
In my opinion an optimal solution would be that in each view.blade.php file i provide all the needed assests using
{{ asset('front/css/bootstrap.css') }}
{{ asset('front/css/jquery.css') }}
{{ asset('front/css/selectize.css') }}
And at first run this is compiled and cached. Is there any package that can do that?

I have been always using template system where I include all the needed files in one place and other blade.php files extend this template.

Avoid multiple src files in my html page

I have a website I'm working on in Visual Studio 2013 and I'm mainly using AngularJS 1.2.6. In my index.html I have a src line for each .js file which for 3 page is 6 lines, 1 js file for each controller and 1 js page for each view.
Is there a way I could consolidate all of these lines into 1 .js file and call that .js file in my index.html?

Yes, you can use something like grunt.js to build a custom build script for your .js files. In your case, you may want to use grunt-contrib-concat with grunt-contrib-watch.
If you are not familiar with grunt, feel free to read the tutorial.

Bootstrap 3.1.1: I can't import all the bootstrap .js files, how is "= require" supposed to work?

I am using the latest Bootstrap v3.1.1 Sass.
Within the .zip file, I get
lib, tasks, templates, test and vendor.
I ignored everything and only use the vendor > assets folder.
The assets folder has all the fonts, stylesheets and javascripts I need.
I have gotten the file structure setup properly.
However when I am trying to import .js files from the javascript folder, I am having a bit of a problem.
Unlike the bootstrap.scss file that comes along. I can just uncomment the _.scss file that I need and it will work.
Within the bootstrap.js file, it contains some syntax that I haven't seen before. After a bit of Google, it says 'require' is a nodejs syntax.
I uncommented a few and try to see if they work. However it fails. the .js file I got back is exactly like the above screenshot. It doesn't concatenate modal.js, tooltip.js and popover.js. I did abit of Google, it says I need to have RequireJs?

How to manage CSS and JS files structure in web application (Custom vs plugins)?

I searched over the internet but I could not find an answer to my question. I am just trying to figure out a clean way to structure my CSS and JS files inside my project. Let us say for example I have a CSS folder and I have a custom my.css file and also I have a Scripts folder and I have inside it a myscript.js. I understand that my.css will go in the CSS folder and myscript.js will go under the Scripts folder in this folder setup :
root
css
my.css
Scripts
myscript.js
My question is, if I want to use a jQuery plugin like jstree for example. This library require me to add one js and one css file. Should I keep these files under the Scripts and CSS folder ?
Plan A
root
css
my.css
jstree.css
Scripts
myscript.js
jstree.js
Or should I separate them into a different folder for cleaner structure like this
PLan B
root
css
jstreeFolder ---> jstree.css
my.css
Scripts
jstreFolder ---> jstree.js
myscript.js
Is this structure acceptable? Any standard ways for achieving this ?
Any help is appreciated.

Root
-- styles
|-- your_file.css
-- scripts
|-- your_file.js
-- libs (or plugins)
|-- jquery
|-- jquery-ui
...
I think this structure will be nicer and all the third party libraries (no matter css or javascript libs) that you've chosen should be located under libs directory. It will make maintenance be easier and clear.

For mainentance reasons i prefer another approach. The library jstreee organise the javascript files, css-files and images in a certain way.
/libs/
/jstree/ // <-- folder
/themes/ <-- folder
/default/ <-- folder
style.css
32px.png
jstree.js
jstree.search.js
/other-plugin/
I put everything under libs and in a folder with the name of the library. This way the external dependency of a library is clear and the internal path structure (css files may point to images) of the external library is untouched.