我如何将Node.js实现为Ionic / Angular应用程序?

时间:2015-09-24 13:55:56

标签: javascript angularjs node.js express ionic-framework

我目前有一个基地"标签"离子/角度应用。

ionic start testproject tabs

我已经完成了npm install以获得项目目录中的一些基本节点模块。

我对如何一起使用Angular和Express以及如何设置节点/服务器端的事情感到有些困惑。我试过看一堆教程,发现自己在混合中有点迷失,所以我希望有人会有一些资源可能会帮助我朝着正确的方向发展。

因为Angular和Express都做MVC / MV * - 它开始变得非常混乱什么做什么。我对设置感到困惑,以及如何让他们一起聊天。

请告诉我我能提供的其他信息,因为我不确定还有什么。 (该项目非常简单。)

非常感谢你!

2 个答案:

答案 0 :(得分:8)

似乎你对术语MVC及其含义感到困惑。 MVC(模型,视图,控制器)只是应用程序结构的一般模式。

使用angular编写Web应用程序时,实际上是在编写两个应用程序(在大多数情况下):

您的前端应用程序,即在您的浏览器中运行的应用程序,使用HTML,JS和CSS(以及它们之上的角度等框架),向用户显示数据并允许它们与之交互。后端应用程序,即在您的服务器上运行的应用程序(例如在节点或Spring或RubyOnRails上运行...),存储数据,提供数据并计算业务逻辑。

这两个应用程序都可以使用MVC模式独立构建。然而,这并不影响它们如何协同工作 - 它们完全独立并使用HTTP协议进行通信(在前端使用AJAX)。因此,对于角度前端应用程序,后端应用程序是否在Node或其他任何内容上运行并不重要。

只是解释名称int hat context:

Node是一个后端框架,运行服务器,执行业务逻辑并与数据库通信。 Express是Node的一个模块,可以更轻松地在Node中编写HTTP API。

Ionic和Angular是前端框架。它们允许您更轻松地创建前端应用程序。

我希望这有点帮助,这是一个非常庞大的主题,并且它不可能在一个合理大小的StackOverflow答案中解释所有这些。

答案 1 :(得分:8)

标准Angular Web App

在构建MEAN Web应用程序时,您应该首先使用Express-Generator创建Express应用程序这些命令(假设您有节点和快速安装全局)

  

$ express myapp

构建应用

  

$ cd myapp

进入应用

  

$ npm install

package.json文件

安装依赖项

文件结构

.
├── app.js
├── bin
│   └── www
├── models
│   └── home.js
├── node_modules
├── package.json
├── public // your Angular app goes here
├── README.md
├── routes
│   ├── home.js
│   └── users.js
└── views

所以我们可以看到应用程序的基本结构。运行Express生成器后应该有类似的东西。您将获取Angular应用程序并将其放入公用文件夹并使用

运行服务器
  

$ DEBUG = myapp npm start

离子

使用Ionic应用程序,你想要一个人的手机应用程序,因为你不需要在这里将应用程序添加到公共文件夹。您将使用Express来创建一个api供您的应用程序调用。您可以创建一个简单的Web api,其中包含可以使用

运行的server.js文件
  

$ node server.js

在您的角色工厂和服务中,您可以直接向您的api拨打$http电话。

更新

目前正在使用样板来拆分平均应用程序的前端和后端,这意味着您将能够为Android应用程序,ios应用程序和您的Web应用程序提供完全相同的后端。

这是一项正在进行中的工作,但随时可以查看想法或开始自己独立的前端和后端MEAN堆栈。 https://github.com/joeLloyd/MEANBoilerPlate