CanJs application structure - canjs

I am new to canJs. Looking for a good application structure for building a canjs app. I would like to separate the Model, controller and view/template logics to separate folders. The todo app available in canjs site is a simple one which has everything written on a single file. Any help is appreciated.
Thanks in advance

Justin Meyer always says "The secret to building large apps is to NEVER build large apps. Break up your applications into small pieces. Then assemble those testable, bite-sized pieces into your big application."
Let's assume that I have 2 models in CRUD app, so we can break the app into small apps lets say accounts app, transactions app, each app is broken into small testable pieces so the adviced structure:
in this example accounts and transaction are traditional controller that listen to can.route to update the state of the app; list, edit ...etc are views that are extended from control too but they listen just for their events (Single responsability principal) the communication between the different controllers and views is made by can.Map and can.compute (Observer pattern) to make them decoupled, take a look here and here this can be helpful too.

Previous answer is quite good but you can do it automatically by using yeoman.
You can also use yoeman to create your canjs application structure automatically.
All you need to do is in your terminal type this commands:
npm install -g yo
yo canjs
and write the directory and app name it will be asked during the app creation.
If you want to add AMD support then type Y when you have been asked for requirejs.
For more information visit yeoman website

Related

Web Dev stacks - GONE WILD --- Best Practice Architecture & Deployment?

I've run into a problem that I'm sure many new/junior web developers are facing. Before I state the problem, it's best if I first list the events that drove me to the "issue".
Step 1 - The Front-End:
I followed tutorials which allowed me to create a Vue project using the vue-cli - I now have a nice front-end ready to go, albeit it is in a way "standalone". It sits in its own directory.
Step 2 - The Back-End:
I move on, I start to look at the back-end. Laravel plays well with Vue so I go with it. Once again I follow tutorials, I create a database and an API. Fantastic.
I now have the barebones core elements for a CRUD application. However, the way the back and front end are connected seems to be convoluted (although this may be due to my inexperience and improper understanding).
Solution 1:
Some tutorials insist that the Vue project is "re-created" within the Laravel directories so Laravel is in charge of rendering the views.
Solution 2:
Others, from what I can tell keep them physically separate and have the front-end interact with Laravels API only.
What are the best practices when it comes to stack architecture? Should we aim to bundle the stack together as proposed in solution 1? Is solution 2 even possible or is that due to my misunderstanding? If it is, how is deployment handled?
From my point of experience, both are correct and the answer depends on what you want to build 😀
First, if you have a simple website and you want to make the front-end of it in vue and it is only this one website, you can put it all together and make the frontend in Vue, which is handled by laravel in the backend and you are done.
Second, the step further, is for this case, that you can have several frontends for your project. Example: You have a website and several (native or universal) apps to display your data. In this case, you can build an API, that handles all the logic, all the business secrets, and this stuff, that no one should know in detail. After that, you are free to build any frontend (Vue, native, plain-HTML), whatever) you like, that's the only purpose is to display the data the API gives back (with some little logic in it, of the cause, but the secret business logic is hidden in the API). You can even outsource the generation of an app, so you build the website frontend in Vue and another one can build an ios-app with swift or an android app with kotlin.
Hope, you get the point, the answer is, as often: it depends 😉

Application instances in Codeigniter

I have created an Application in Codeigniter which list courses on a web interface, let users register via mobile app, see or download free courses, pay for the paid categories to watch or download courses listed in that category. So far it works like a charm. My manager suddenly landed on this thread Two application instance in CodeIgniter and has now come up with an idea that we should separate users for each categories and platforms. What our management is currently insisting is that copy and paste each installation in different sub-folders, copy databases, flush old data, change path variables and database name and fire up each app individually.
You can imagine for a developer how hard it is to digest this kind of solution. I want to ask, if there is a way to instantiate complete CI application by creating some mother class and than passing some parameters to constructors like categories ids etc and do things dynamically. Is it possible to create instances of entire Codeigniter application?

Plain MEAN Stack or a MEAN Framework like mean.io?

I have very decent HTML and CSS skills and a basic understanding of JavaScript. I'm currently designing a system where different users can store an inventory list (a separate list for each user).
I started with plain Mongo, Express, Angular and Node Stack. But when researching about user authentication in MEAN-Stack I stumbled across Mean.io which seems to have a build-in user auth/management.
Is it usefull for a beginner to start with such a MEAN Framework or better to stay at the basics for a first try?
MEAN frameworks like MEAN.io or MEAN.js are great for structuring an app but you still have to understand how everything works. It may be better to go with tutorials from scratch to learn then use a framework once you want to actually build an app. Start with a node/express server using a simple html/js page to understand API creation then add angular to learn the frontend stuff. This will help you understand what MEAN.xx is doing with regards to the frontend vs backend. MEAN.js for example puts all the backend (E and N) stuff in the server/ folders and the frontend (A) stuff in client/ folders.

SPA using DurandalJS and laravel

im trying to create a Single Page Website with DurandalJS in the frontend and Laravel as the Backend. Do you think this is a good Idea?
If yes how would I do the following:
What would your recommendation for the basic interaction between both frameworks be?
Would you rather have all the computation done in JS instead of Laravel sending calculated and styled returns?
How Do I setup Laravels controller in order to only get dynamic Data for, say a Div, instead of a whole page?
How can I adjust the browser URLs?
I hope I was specific enough, thank You in advance.
Laravel does not actually care about what framework you use to build the Frontend. Laravel is just a framework that helps you build your application with. It gives you great advantage with respect to the time spent and effort.
You can use any frontend framework that you want to build your app with. I have actually not used Durandal, but from the first look of it here is my opinion.
Durandal is built on top of jQuery, knockoutJS and requireJS. It also has a MV* architecture in place with support for eventing as well. So you could basically define routes on Laravel and initiate the communication between both the frameworks through events and ajax. Again this completely depends on the functionality that you are building.
In the overall flow of your app, consider Laravel as a Model that just gives data from a source to your app and Durandal as your views and controllers. This way, it will keep your data flow cleaner and easier to build. Computation of your functionality depends on how important and secretive the app is. If there are functionalities/implementations that you need to be secretive about, you can keep it on Laravel and just send computed data to Durandal. If its a web app that you are building, then keeping all implementation on the JS is just a right click away from knowing what and how you have built it. One can just see how the implementation is done just looking at the Javascript source of the web app. If you are building Mobile Device App, then the case is different.
Take a look at Restful Controllers. Will give you an idea on how to setup controllers to return only data. But if you need to return the div itself, then you can make use of the Basic Controllers of Laravel to perform them.
You can setup cleaner routes for the browser URL's. Take a look at Laravel Routing

customizing componnet in joomla

i have created a component using this http://www.notwebdesign.com/joomla-component-creator/index.php component creator how can i add a simple registration form in that and also make its backend looks like the other component
The name of that utility is a little misleading since it only creates the structure of a component. If you want to add functionality to the structure created you will need to actually put in the code that does what ever you need it to do. Think of this as the foundation and framework of a house. You actually have to put the walls up and furnish it.
It would probably be helpful to understand the files that have been created for you so you know what needs to be added. I would recommend learning how to build a component from scratch first. Joomla has pretty good documentation on that here - http://docs.joomla.org/Developing_a_Model-View-Controller_Component_-_Part_1
i have develop the Lots of component from this site http://www.notwebdesign.com/joomla-component-creator/index.php .
1) First Create the components and give the name and crrate the require field fo the registration from .and save the components then after the download this components.
2) Install the components in your joomla site.
3) Go to the Fornt-end view components folder. and create a form in the default.php page and save and update operation query is written in the model .
Your Registration page is ready.
This tutorial is the best I have come across so far. It will hopefully guide you to understand the MVC structure that the component generating site delivers to you.
I am actually the developer of the Component Creator you have used. It only creates the MVC files and structures needed to quickly create a component. You still need quite good PHP skills to develop a fully working component.
The component creator helps developers with the tedious tasks of building the framework.

Resources