构建一个和的NodeJS角JS应用 [英] Structuring a NodeJS and Angular JS app

查看:104
本文介绍了构建一个和的NodeJS角JS应用的处理方法,对大家解决问题具有一定的参考价值,需要的朋友们下面随着小编来一起学习吧!

问题描述

我要尝试我的第一个角JS项目,它是有道理的使用节点JS的后端,即使这意味着在同一时间学习两种角和节点从头开始。

I'm about to attempt my first Angular JS project and it makes sense to use Node JS for the back end, even though it means learning both Angular and Node from scratch at the same time.

我想圆我的头的第一件事情是一个很好的文件结构。到目前为止,我的纯HTML / CSS模板有以下目录结构....

The first thing I'm trying to get my head round is a good file structure. So far my Pure HTML/CSS template has the following directory structure....

_site/
Fonts/
Javascript/
SASS/
Stylesheets/
Index.html

(_site是月台幕门等工作目录)

( _site is a working directory for PSDs etc)

我发现这里节点/角应用为例目录结构....

I found an example directory structure for a Node/Angular app here....

...这表明以下目录结构

... which suggests the following directory structure

app.js              --> app config
package.json        --> for npm
public/             --> all of the files to be used in on the client side
  css/              --> css files
    app.css         --> default stylesheet
  img/              --> image files
  js/               --> javascript files
    app.js          --> declare top-level app module
    controllers.js  --> application controllers
    directives.js   --> custom angular directives
    filters.js      --> custom angular filters
    services.js     --> custom angular services
    lib/            --> angular and 3rd party JavaScript libraries
      angular/
        angular.js            --> the latest angular js
        angular.min.js        --> the latest minified angular js
        angular-*.js          --> angular add-on modules
        version.txt           --> version number
routes/
  api.js            --> route for serving JSON
  index.js          --> route for serving HTML pages and partials
views/
  index.jade        --> main page for app
  layout.jade       --> doctype, title, head boilerplate
  partials/         --> angular view partials (partial jade templates)
    partial1.jade
    partial2.jade

所以,这看起来相当不错,我(除了事实,我不会用玉)

So, this looks quite good to me (except for the fact that I wouldn't use Jade)

我还是有以下几个问题...

I still have the following questions...


  1. 我要保留所有的前端和后端的文件区分开。该解决方案将在公共/目录哪一种有意义的,因为最需要公开所有的前端的文件,但是否有意义把SASS和_site文件夹吗?我可以让他们有但不是上传到时候我把它们投入生产,但似乎错了,因为他们不应该是公开的。他们也没有在根级别的所有后端的东西的归属。

  1. I want to keep all front-end and back-end files separate. This solution puts all the front-end files in the public/ directory which kind of makes sense because most need to be public, but does it make sense to put the SASS and _site folders here? I could just keep them there but not upload them when I put them into production but it seems wrong because they shouldn't be public. They also don't belong at root level with all the Back-end stuff.

那岂不是更好地加载从CDN角?

Wouldn't it be better to load Angular from a CDN?

由于服务器将只需要提供一个模板(主应用程序模板)和所有其他HTML将在前端构造不会更有意义,保持index.html文件静态,删除该文件夹的意见,并创建一个谐音/文件夹下的公共/想当初角种子的应用程序呢?

Given that the server will only need to deliver one template (the main app template) and all other HTML will be constructed on the front-end wouldn't it make more sense to keep the index.html file static, delete the views folder and create a partials/ folder under public/ like the original Angular Seed app does ?

我意识到,这是见仁见智的所有的事,我可以在技术上把他们的地方我想,但我希望有人比较有经验,我可以告诉我不同​​的目录结构的缺陷。

I realize that this is all a matter of opinion and I could technically put them wherever I want but I'm hoping somebody more experienced than me could advise me of the pitfalls of various directory structures.

正如你所知道的,我是新来这一点。任何帮助真的会AP preciated。

As you can tell, I'm new to this. Any help would really be appreciated.

推荐答案

1),它通常不会做一些意义,使的SaaS /少文件公众可能要调试(less.js创建)时,使用客户端less-> CSS转换。不知道你的 _site 但是包含的(顺便说一句,你应该使用小写的文件夹为您的项目,特别是对公物)

1) It usually does make some sense to make saas/less files public as you may want to use client-side less->css conversion when debugging (less.js does that). Not sure what your _site contains however (btw you should use lowercase folder for your project, especially for the public stuff).

2),它通常是加载从谷歌CDN AngularJS一个很好的做法,当在生产,使用仅用于开发的本地版本,你可以有两个不同的布局,根据您的环境。

2) It is usually a good practice to load AngularJS from Google CDN when in production, using only a local version for development, you could have two separate layouts depending on your environment.

3)即使客户端渲染是要走的路,你可以保留服务器端的布局/视图渲染,你可能需要在某一时刻(管理员访问,电子邮件渲染等)。然而,它可以帮助使用来自AngularJS的谐音名称公用文件夹,以帮助避免服务器端的意见&安培;客户端谐音

3) Even if client-side rendering is the way to go, you may keep server side layout/views rendering, you will probably need it at some point (admin access, email rendering, etc.). However It can be helpful to use the partials name from AngularJS in the public folder to help avoid confusion between server-side views & client-side partials.

您应该清楚地去什么似乎在当前时间做,你可能会左右移动的东西,你熟悉的前preSS是最顺理成章的事情。

You should clearly go for what seems the most logical thing to do at the current time, you will probably move things around as you get familiar with express.

您应该检查现有的前preSS框架来看看他们是如何构建他们的应用程序。例如, TowerJS 有pretty干净配置文件夹,但它们混合起来服务器端与放大器;客户端code,我个人不喜欢。

You should check existing express framework to see how they structure their app. For instance, TowerJS has a pretty clean config folder, however they mix up server-side & client-side code which I personally do not like.

的NodeJS MVC框架来看看别人是怎么做的东西。不过,我显然会香草前preSS code开始为了要完全控制及;了解事情的过犯任何的论文框架之前的工作。

Check this comparaison of NodeJS MVC frameworks to see how others do stuff. However, I would clearly start with vanilla express code in order to be in full control & to understand how things work before over-committing on any of theses frameworks.

这篇关于构建一个和的NodeJS角JS应用的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持IT屋!

查看全文
登录 关闭
扫码关注1秒登录
发送“验证码”获取 | 15天全站免登陆