Skip to main content

Making It All Work Together - Controllers, Services and routes

Making It All Work Together
We have defined our resources, controllers, services, and routes and included the files in our index.html. Now let’s make them all work together.
Let’s set up our Angular app to use all of our components. We will use dependency injection and set up our Angular application.
// public/js/app.js
angular.module('sampleApp', ['ngRoute', 'appRoutes', 'MainCtrl', 'NerdCtrl', 'NerdService']);


Conclusion

Now we have an application that has a Node.js backend and an AngularJS frontend. We can use this foundation to build any sort of application moving forward. We can add authentication and CRUD functionality to create a good application.
Also, for those looking for this project with the addition of the Jade templating engine, Florian Zemke has created a Jade version at his GitHub repo.

NEXT STEPS

Moving forward, I’d encourage you to take this and see if it fits your needs. The point of this was to have a foundation for starting applications so that we aren’t reinventing the wheel every time we start a new project.
This is a very barebones example and for something more in depth, I’d encourage people to take a look at mean.io for a more in depth starter application.
Check out the Github repo for this project and take from it what you need. Sound off in the comments if you have any questions about how to expand this into your own applications.


Starter Kit

We’ve put this tutorial together as a starter kit at the Github repo. We’ll keep adding features to it on request and any updates we think will be helpful for applications.
Hopefully it will be a good foundation for any sort of Single Page MEAN Stack Application.

TO USE THE STARTER APP

  1. Download the code
  2. Install the npm modules: npm install
  3. Install the bower components: bower install
  4. Start the server: node server.js
  5. Visit the application in your browser at http://localhost:8080
  6. Use this starter kit to build any application you need.
Further Reading: When building MEAN stack apps, the backend Node application will usually be an API that we build. This will allow the Angular frontend to consume our API that we built through Angular services. The next step is to hash out building a Node API. This next tutorial will teach us that and then we can go further in depth of how to

Comments

Post a Comment

Popular posts from this blog

Create Web API in Asp.Net Core MVC with Example

Introduction : Here we will learn how to create web api in  asp.net  core mvc with example or  asp.net  core mvc rest web api tutorial with example or  asp.net  core mvc restful api with example or implement web api using asp.net  core with examples. By using  asp.net  core mvc web api templates we can easily implement restful web api services based on our requirements. To create web api first we need to create new project for that Open visual studio  à  Go to File menu  à select New  à  Project like as shown below  Now from web templates select  Asp.Net Core Web Application  ( .NET Core ) and give name ( CoreWebAPI ) to the project and click  OK  button like as shown below. Once we click  OK  button new template will open in that select  Web API  from Asp.Net Core templates like as shown below Our asp.net core web api project s...
Post a Comment
Read more

.NET Core 2.0 Changes – 4 Key Things to Know

1. .NET Standard 2.0 Expanded APIs & the Ability to Reference Full Framework Libraries .NET Standard broadens the set of APIs available to include a lot of the missing features. It now supports 32,000+ APIs. It is now much easier to port your code to a .NET Standard library without major code changes. One of the biggest problems with .NET Core was the lack of third-party libraries. For example, when 1.0 came out, popular logging libraries like log4net were not even available (it is now). However, this was really only a problem if you wanted to deploy your app on Mac or Linux. You could have used .NET Core and targeted full .NET framework and not had these issues. .NET Standard 2.0 has added a  new compatibility shim  that will enable any .NET Core app to reference any full framework library. 2. Expanded OS Support One of the big goals with .NET Core is portability across multiple operating systems. Including desktops, servers, and even mobile. Microsoft ...
Post a Comment
Read more

Scenario : Cloud Computing

7 comments
Read more