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

Popular posts from this blog

Scenario : Cloud Computing

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...

SQL Server Tutorial - Date functions

1. Get month names with month numbers: In this query we will learn about  How to get all month names with month number in SQL Server . I have used this query to bind my dropdownlist with month name and month number. 1 2 3 4 5 6 7 8 9 10 11 12 ;WITH months(MonthNumber) AS (      SELECT 0      UNION ALL      SELECT MonthNumber+1      FROM months      WHERE MonthNumber < 12 ) SELECT DATENAME(MONTH,DATEADD(MONTH,-MonthNumber,GETDATE())) AS [MonthName],Datepart(MONTH,DATEADD(MONTH,-MonthNumber,GETDATE())) AS MonthNumber FROM months ORDER BY Datepart(MONTH,DATEADD(MONTH,-MonthNumber,GETDATE())) ; 2. Get name of current month: In this query we will learn about  How to get name of current month in SQL Server . 1 select DATENAME(MONTH, GETDATE()) AS CurrentMonth 3. Get name of day: In this query we wil...