NODE and CMS with angularjs: how they interact

Question

I am going to do something with the MEAN stack. I need a way to edit the contents of a site, for example, for example. Wordpress offers (mainly CMS).

A tangled bit is how CMS and Angular will work together. I looked at a CMS called Keystone , and there you need to configure some routing, etc. In Node. Won't this happen with the routing you configured in Angluar?

In other CMS that I used, the creation of the views takes place on the server side. In Angular, as I understand it, you are creating an HTML template that you can populate with data in an Angular controller. It also looks like it might crash between CMS and Angular. Is this the case?

Are there any other quirks or similars about Angular and content management systems that I should be aware of, or, as a rule, not so many problems associated with these two?

Answer 1

meanjs.org has a pretty good approach to this. Install meanjs. It comes with sigin / signup and even allows you to create articles from a vanilla installation.

Simply put, when you create a web application with the MEAN stack, think of AngularJS as the "THE" application and node.js as the api. If you approach the creation of your web application as a javascript application (AngularJS), this happens to get your data from the api server (node.js), then you will begin to understand how to use the MEAN stack correctly.

First: Angular will have the routes defined in $ routeProvider . First create routing URLs in AngularJS. These are the "routes" for your web application. A good way to look at this is to create part of AngularJS with the ability to change your api server even in another language (PHP, python, go, etc.), if necessary.

Second: Create your AngularJS to communicate with api with $ resource . Essentially, $ resource is an easy way to access api using quiet routing. This "quiet routing" is now a routing that needs to be "simulated / copied" into routing for node.js. routes.

Often, AngularJS routes (url) will match the $ resource routing, which matches the node.js routing.

Take a look at meanjs.org again , and you will have a better understanding of how to properly organize what the "separate" (and actually) two separate applications are.

Answer 2

Basically, you need three sets of routes (or two if you are doing it on the cheap).

Start with a set of routes on the server that return regular web pages. Forget about JavaScript. Do not enable Angular at this point.

Secondly, add another set of routes on the server that return data in an earlier form (e.g. JSON). This is usually a RESTful API.

Third, add Angular to the client. When you need to refresh the view, refresh the URL in the browser and use Ajax to access the RESTful API to get the data needed to populate it. (You want the URL that you set the address bar to match the URL of the page from the first set of routes that you duplicate using JS and RESTful route data).

If you do it cheaply, as Gawker did , then you would skip the first set of routes and go straight to JS + REST.

Answer 3

I created a Skeleton AngularJS + KeystoneJS launcher application that should help you get started if you want to use MEAN with KeystoneJS:

https://github.com/dvdcastro/keystonejs-ng-skeleton

Answer 4

I think you need a CMS in the MEAN stack development environment. There are some cms on average stack that you can try.

• Pancilblue
• Calipso

try it.

Answer 5

I tried something like this, I found this link very useful AngularJsCMS He talked about free cms answers that are based on angularjs and have the ability to create pages such as wordpress and manage content.

Answer 6

We are working on a project using angular and keystonejs. Just use the default template template found in the key ladder and enter the data-ng-view tag in the body tag. Submit this template for all requests to '/'.

Then write your angular app to use endpoints. These endpoints can be performed in trapezoidal mode using api middleware. In the routes/index.js add a key / value pair to the route object with the name of your custom endpoint, then import the folder containing the endpoint function definitions.

var routes = { views: importRoutes('./views'), api: importRoutes('./api') };

 exports = module.exports = function(app) { app.get('/api/posts', keystone.middleware.api, routes.api.post.index);} 

Answer 7

I recently moved my blog to MEANie, the lightweight custom MEAN Stack CMS I developed.

I made it open source for everyone who used and posted detailed installation and installation instructions on my blog at http://jasonwatmore.com/meanie .