If I want to build a large application with ExtJS how am I supposed to use Modularized architecture?
Ex,
/app
/registration
/app
/model
/view
/controller
index.html
/lab
/app
/model
/controller
/view
index.html
index.html
(got it from somehwere :D)
is this the recommended approach?
I need to use MVC architecture too, advice? suggestion?
Simple version of my question :
How to put the code into modules while using MVC with ExtJS
:)
=================================================
updated on 03-29-2012 :D
I'm new to ExtJS, so i'm still having the problem :(
My intension is to put code in to sperate manageble modules
like,
core - for core functionality
radio - separate module, something realted to Radio
tv - separate module, something related to TV
This is what i need
/core
/controller
/(...)
/radio
/controller
/(...)
/(...)
But as Dimitry told, may be this is impossible (current framework)
So....
are we supposed to do something like below?
/controller
/CoreController
/RadioController
/(...)
If this is the case, im sure i will run in to problems very soon :(
Thanks
As a start point, I'd recommend reading over the sencha documentation on using their client side MVC architecture.
The link can be found here: http://www.sencha.com/learn/the-mvc-application-architecture/
The current version of framework does not have a straight forward way to modularize an app.
What people generaly do is initialize secondary controllers when they are needed instead of at strartup by app.js
The key is to call init() method on the secondary controller. That sets up it's listeners.
Here is an example of such solution: https://stackoverflow.com/a/7649658/834424
Edit: this means you only have one app.js not two as in your original question.
Related
I want to make angularjs project name A and B,
But i want B will be inside A,
I ask my developer and he said just build those 2 and put it together,
But when i do that, it keep have this error
So basically it looks like this:
I grunt build project A and B and make this structure:
Project A
-css
-js
-scripts
-styles
-views
-index.html
-home.html
-BProject
css
js
scripts
styles
views
home.html
index.html
And when i try to go to www.a.com/b/index.html, it making that error,
Anyone know what is wrong?
Do i need to change the app.js for both routing?
I'm using html5 mode for those 2 project.
I found a way, this article help me to setting my project.
I just need to add <base href="/bproject/"></base>
and set my nginx configuration :)
Link :
http://ajbogh.blogspot.kr/2015/05/setting-up-angularjs-html5-mode-in.html
Hope it can help you guys too :)
Up until now I have been building my application using the following structure.
/src
/components
/shared
/messagebox
/alertbox
/Home
/About
So as you can see I have shared components which are components being used on other components / pages. and I have the concept of Home, About which are also components (which translate to viewable pages) as everything in Angular is now supposed to be a component - right?
Does anyone have a better implementation of the structure of a NG 1.5 app?
I now need to create some filters and as far as I am aware I cannot hang these off of a component, so where is the based place for putting this type of file?
Also other things that come to mind are constants, services etc.
There is no recommendation on Angular docs site as far as I can see.
The one which i used to follow for my project is :
project
/www
/assets
/components // directives
/accordion
/accordion.html
/accordion-directive.js
/accordion-controller.js
/accordion-controller-test.js
/core // shared services
/route
/router-service.js
/sections // pages we build by adding components
/registration-page
/registration.html
/registration-controller.js
/registration-controller-test.js
app.js
index.html
index-controller.js
app-configuration.json // for keeping constants
this might help you.Please check.
I am reading how to write a clean code as I am learning the basics of this framework.
If I understand correctly, it is preferred to have one Controller per file, and one module per file but that will end up making my index.html head tag so long if I have to link to all those controllers.js files in the head.
Please look at the image below.
Am I missing something? Thanks
Why don't you use any build tools (e.g gulp, grunt, webpack, etc.)? They can actually combine all your js into one bundle and include it in index.html automagically.
This is a must-answer question that needs answered for a generation of coders.
I know to go to the website, but how do you actually download Backbone and start coding.
Most tutorials leave out this stage.
Thanks for helping!
Most Backbone code I see on stackoverflow is a real mess lacking structure which is a shame. But the flexibility in the right hands is also a very strong point that is why larger companies still use frequently choose Backbone whilst newbies would go for something with a little more magic out the box like Angular or Ember.
This is what I recommend in a general sense:
Grunt or gulp for tasks - grunt might be easier as it is more widely used still. Main tasks would be:
- build (compile and minify your code and css) and bundle into a build folder
- server (runs local server or a server from a build folder)
- test (if you have unit or functional tests)
Next you have an index.html file which contains an app wrapper and a single RequireJS call the the entry point of your code.
My folder structure would look something like this:
server/
server/server.js
public/
public/app/app.js
public/app/modules/
public/app/extensions/
public/assets/
public/assets/css/
public/assets/images/
public/packages/
public/index.html
dist/
dist/<env>/public/assets/
dist/<env>/public/app/app.min.js (or app.js depending on env)
package.json
Gruntfile.js
A colleague's boilerplate is probably the closest to my ideal setup in the public domain: https://github.com/mderrick/backbone-boilerplate
There is also marionette: http://marionettejs.com/
Im using angular-ui-bootstrap with Grails 2.3.x asset-pipeline:1.6.1 plugin. One of the components - alert.js is attempting to load /template/alert/alert.html but this resolves to 404.
I tried including grails.assets.includes=[*/.html], did not help.
Any workaround for this? Anyway to let asset-pipeline include partial templates?
Is template located in assets, if so remember the first level folders inside of assets are flattened so you may want to nest your templates one more level or adjust your path
I have tried putting the /partials directory under /web-app. It ends up like:
/web-app/partials/content.html
I don't need to mess about with asset-pipeline, it just works!
The versions I use are:
Grails: 2.4.2
compile ":asset-pipeline:1.8.11"
Hope this helps anyone who upgrades their Grails version as well.
thanks for your great blog about AngularJS and Grails, which jumpstarted me on this topic.
Regarding partials, I assume the assets directory is not the right place to put them, because they get concatenated and minified in production mode.
Instead, I use GSP templates as AngularJS partials. For example, I have
views/partials/login.gsp
<div>Hello World!</div>
conf/UrlMappings.groovy
static mappings = {
...
'/partials/login'(view:'/partials/_login')
}
grails-app/assets/javascript/
...
templateUrl: 'partials/login',
...
Advantage: You may even use script lets and taglibs in the partials.
An alternative to using GSP directly would be James Kleeh's approach in this thread.
Best regards,
Björn