I'm developing several AngularJS applications and I'm looking for best practices how I can share code, especially directives, between these projects. The biggest problem I'm facing is the following:
Most of my directives contain at least one js file and a html template. The js file often contains a reference to the template. When I include the same js file from two different projects, what's the best way to handle the different paths?
There may be better ways to handle this situation I can't even think of. So, I would like to know if someone has experiences with this situation and how this is handled. Thanks!
I find it helpful to use compiled HTML templates using a build tool like https://www.npmjs.com/package/grunt-angular-templates . There are plenty of Gulp/Grunt alternatives if that one doesn't suite your needs.
Then you will need to keep your templates in namespaced directories so that your consumer applications don't collide.
Then you when you just need to consume a single compiled JS file. The templates are compiled into it. If you need to override the templates in your applicatons, just use the template namespace convention to provide the overrides.
Maybe you can write your code in nodejs style (with CommonJS), locate your files in different folders and such, and then use browserify to combine your js code into one piece. HTML templates can be also easily transpilled into js files using angular template cache and some tool like this one for gulp or maybe some similiar for grunt.
Related
I'm looking for reactjs responsive email framework.
I found MJML, but it is for static templates. I need to generate a dynamics template. I wanna pass data from database to template.
Can you suggest some good solution?
Solutions are available without reactjs.
You're right: MJML handles only static templates.
Lots of email authors are using packages like Handlebars with MJML for the dynamic piece. They write the MJML with Handlebars variables embedded. They run the MJML template through Handlebars, which creates a series of templates, each with the variables replaced from a database, for example. Then, they run the MJML compiler to create the HTML output for all those emails.
Handlebars has competitors. The MJML team has decided not to expand the scope of their project to include variables (as of this writing). That way, their users can pick which of the dynamic packages best meets their particular needs and they're better served.
Some recommend using Gulp to automate the process. The MJML team supports one such Gulp implementation.
A great place to get MJML support is https://slack.mjml.io/
Good luck.
I am developing an application with a few modules. Each module is individually deploy-able on the server. I am using Angular for my UI.
Because I have 4 modules, I obviously have 4 different Angular projects, setup & files.
Though there are certain differences like routing, controllers, views, the external frameworks, libraries used can be very similar and I do not want to replicate all of them.
Hence I wish to have a common project/folder/directory and use these in different modules. this way I can avoid redundancy (if it can be called that). Can someone please help me understand if my thought process is correct? If so how can I achieve this?
Use a third party package manager like npm or bower. You can then add the libraries during build time with browserify or custom gulp/grunt code.
You can then bundle all you libraries into a single file and include it in you application.
I want to create a popup using angularjs in Extjs Page.This is my current situation.I have manually bootstrapped angular link when they click.now the issue is ext-all.css and bootstrap.css files are conflicting.So How can i avoid this conflict.Can any one suggest idea?any conflict arise in js file if its in same page? Lot of thanks in advance
AngularJS + ExtJS - another question in stackoverflow read this before considering to combine both.
I have tried doing it for my websites for curiosity's sake but it creates more problems then it solves. I would strongly recommend sticking to one framework.
You can combine Jquery and ExtJS without problems because they do not have any conflicting elements.
Your conflict probably arises from the same naming and calling that might or might not exist within the libraries of these two frameworks. The way I see to fix it would be to go within a library and start solving the conflicts. That will be very tedious to say the least.
I wouldn't really mix these frameworks together in a single project. ExtJs is a fully fledged component based framework which should provide most, if not all the functionality that you need. If you are missing something then you should look at the Sencha forums section on user plugins and extensions or even build it yourself.
ExtJs provides most, if not all of the functionality of AngularJs already but adds visual components such as grids, forms, windows, treepanels etc. If your using Ext already for your project you should really stick by it. Adding another framework adds complexity and additional libraries to download, increasing load times etc.
I'm searching some similar to PHPUnit Skeleton Generator just for Angular, maybe you could help me to find one ?
I'd recommend looking into the ng-boilerplate project. It sets you up with a sane structure, including where to put tests and running them.
You should familiarize yourself with yeoman which is a very nice scaffolding tool for JS projects.
It works around the concept of generators, different generators can generate different files for you. For example the angular-generator will help you with setting up an angular project and also add controllers, services and such.
We're about to start a project using mentioned libraries. We have already used jQM in another project, but coupled with Backbone. Now we're thinking about using AngularJS with jQM. Do you think it's a good idea? And if not, why?
To elaborate, the question is whether it is advisable/recommended/easy/beneficial to use these libraries together, or maybe there is something that should prevent us from using them both in one project. We don't want to spend half of project's time on making them work together just on principle.
AngularJS and JQM do different things. AngularJS is MVC + Lot More. JQM on the other hand is for direct UI manipulation (lower level than Angular). The good news is AngularJS is flexible and will let you work with any other Javascript framework including JQM. The recommended way of using them together is use the adapter as mentioned above or create your own reusable directives that will add "JQM nature" to your views. For e.g. you can create a directive that will convert a standard UL to a fancier JQM list. The good thing about doing this in directives and not within your view is that your UI code is separated in separate modules and not intermingled with business logic.