node.js - How to organize build, server, client and shared JavaScript code with NodeJS - Stack Overflow

One big benefit I've always perceived with using NodeJS on the server is the potential for sharing

One big benefit I've always perceived with using NodeJS on the server is the potential for sharing bits of code between the server and client side (ex. input validation). Now that I'm actually developing using NodeJS one difficulty that I've found is determining the responsibility and context in which each body of code is executed. Below I'll list a few of the difficulties I've had in hopes gain some enlightenment on conventions or guidance that I may be overlooking that could help elevate these issues.

Build-Time Code

Build time code for projects that use Gulp, Grunt, or vanilla NPM in a way that follow the basic documentation are generally pretty easy to follow. Most smaller projects tend to keep all of the code within a single file and the file tends to be named a conventional name like gulpfile.js, however with bigger projects I've seen these scripts begin to be split out. I've seen some cases where the gulp file is split into multiple files and placed under a separate directory. Even worse I've found cases where the gulpfile.js file isn't even named as such causing new developers to hunt around to find where the gulpfile is located and once it is located the gulp mand always has to be run with the specific --gulpfile option.

Run-Time Server-Side Code

The entry point for basic node applications appear to simply require pointing out a specific JavaScript file when running the node mand (ex. node script.js). For web server applications, such as those using Express, I've noticed that by convention the entry point file is often called server.js and can usually be found in the root directory of the application. In some other cases however such as when running the web server in a developer environment I've seen gulp tasks take on the responsibility of launching Node. In these cases there seems to be multiple ways to include the entry point but one example I've found is just starting up the webpack plier followed by a require statement for the entry point script. Figuring out how to incorporate normal guidance on how to acplish a typical node debug mand is non-trivial in this type of setup. Besides the entry point of the application, there doesn't seem to be any general guidance on directory structure for NodeJS/Express applications that keeps server-side specific code in it's place to help locate it and to keep it separate from build-time and client-side code.

The server-side story bees even more plex in cases where the server side code is used both for the purpose for serving up static content, server-side generated views (such as with MVC), as well as for providing an API to the client side. My preference is to separate API from the application project but I get the feeling from others that there is a sense of overplexity involved in doing so where I see it as a reasonable separation of concerns.

Run-Time Client-Side Code

Since client-side code can often have various entry points based on the first page that is requested this can be tricky. However because of the general transparency of URLs with how they map to resources for typical cases it as well as how powerful the debugging tools have bee in modern browsers, it isn't too much trouble following the follow of the scripts. The difficult instead for the client side code es more for typical build processes which generally end up copying the files around and placing them into a production like structure under a different name. An example would be a project that has a folder called src or js that holds client-side and server-side code intermingled except for that only a portion of the files happen to be included in a build task which transforms and often concatenates the files and places them in a distribution folder. Common names of these distribution folders that I've seen are dist, public, www, and wwwroot. Often if not always these directories are at the root of the project which at least makes it a bit easier to locate without having to interrogate the build scripts.

My hope is that there is some general guidance on how to put all of this together in a sane way perhaps by an authoritative source mainly to give guidance to those like myself who may want start off on the right foot. As a side effect perhaps being able to reference some sort of standard even if it is a loose one may also reduce the amount of boilerplate a team has to invent and discuss as they get started. Within each of the contexts listed above there will obviously be some technology specific conventions such as those followed for AngularJS, Meteor, or ReactJS on the client-side. The conventions I'm looking for are more specific to separating the main highlevel contexts in end-to-end JavaScript applications where the language and platform no longer bee obvious way to differentiate between each.

One big benefit I've always perceived with using NodeJS on the server is the potential for sharing bits of code between the server and client side (ex. input validation). Now that I'm actually developing using NodeJS one difficulty that I've found is determining the responsibility and context in which each body of code is executed. Below I'll list a few of the difficulties I've had in hopes gain some enlightenment on conventions or guidance that I may be overlooking that could help elevate these issues.

Build-Time Code

Build time code for projects that use Gulp, Grunt, or vanilla NPM in a way that follow the basic documentation are generally pretty easy to follow. Most smaller projects tend to keep all of the code within a single file and the file tends to be named a conventional name like gulpfile.js, however with bigger projects I've seen these scripts begin to be split out. I've seen some cases where the gulp file is split into multiple files and placed under a separate directory. Even worse I've found cases where the gulpfile.js file isn't even named as such causing new developers to hunt around to find where the gulpfile is located and once it is located the gulp mand always has to be run with the specific --gulpfile option.

Run-Time Server-Side Code

The entry point for basic node applications appear to simply require pointing out a specific JavaScript file when running the node mand (ex. node script.js). For web server applications, such as those using Express, I've noticed that by convention the entry point file is often called server.js and can usually be found in the root directory of the application. In some other cases however such as when running the web server in a developer environment I've seen gulp tasks take on the responsibility of launching Node. In these cases there seems to be multiple ways to include the entry point but one example I've found is just starting up the webpack plier followed by a require statement for the entry point script. Figuring out how to incorporate normal guidance on how to acplish a typical node debug mand is non-trivial in this type of setup. Besides the entry point of the application, there doesn't seem to be any general guidance on directory structure for NodeJS/Express applications that keeps server-side specific code in it's place to help locate it and to keep it separate from build-time and client-side code.

The server-side story bees even more plex in cases where the server side code is used both for the purpose for serving up static content, server-side generated views (such as with MVC), as well as for providing an API to the client side. My preference is to separate API from the application project but I get the feeling from others that there is a sense of overplexity involved in doing so where I see it as a reasonable separation of concerns.

Run-Time Client-Side Code

Since client-side code can often have various entry points based on the first page that is requested this can be tricky. However because of the general transparency of URLs with how they map to resources for typical cases it as well as how powerful the debugging tools have bee in modern browsers, it isn't too much trouble following the follow of the scripts. The difficult instead for the client side code es more for typical build processes which generally end up copying the files around and placing them into a production like structure under a different name. An example would be a project that has a folder called src or js that holds client-side and server-side code intermingled except for that only a portion of the files happen to be included in a build task which transforms and often concatenates the files and places them in a distribution folder. Common names of these distribution folders that I've seen are dist, public, www, and wwwroot. Often if not always these directories are at the root of the project which at least makes it a bit easier to locate without having to interrogate the build scripts.

My hope is that there is some general guidance on how to put all of this together in a sane way perhaps by an authoritative source mainly to give guidance to those like myself who may want start off on the right foot. As a side effect perhaps being able to reference some sort of standard even if it is a loose one may also reduce the amount of boilerplate a team has to invent and discuss as they get started. Within each of the contexts listed above there will obviously be some technology specific conventions such as those followed for AngularJS, Meteor, or ReactJS on the client-side. The conventions I'm looking for are more specific to separating the main highlevel contexts in end-to-end JavaScript applications where the language and platform no longer bee obvious way to differentiate between each.

Share Improve this question edited Apr 16, 2018 at 16:26 pseudosudo 6,6109 gold badges46 silver badges56 bronze badges asked Oct 26, 2015 at 2:45 jpiersonjpierson 17.4k16 gold badges109 silver badges151 bronze badges 1
  • Perhaps far from authoritative, I have stumbled across this github project which discusses possible layouts for large NodeJS apps. gist.github./lancejpollard/1398757 – jpierson Commented Oct 26, 2015 at 3:00
Add a ment  | 

1 Answer 1

Reset to default 7

Build-Time Code

IMHO if you have so much build-time code that it's more than say 1000 lines and requires more than a handful of files, something has gone off the rails. Either you don't know how to make good use of existing packages from npm or you don't understand how to refactor generic code and publish as independent npm packages. If you feel like you need guidance about a project's build-time code because it is so large and plex, my suggestion is to modularize and split out into separate projects - each published independently to npm. Also just check your overall approach. What are you doing that is so custom and requires so much machinery?

Run-Time Server Side Code

Please see my other answer to ExpressJS How to structure an application?

Generally I'd rather see client side code and server side code either pletely separate npm packages (separate git repos, separate package.json files, published independently) (if they are large enough) or otherwise co-mingled in the same module and grouped by coupling (all the code relating to a feature kept together including front and back end code), especially if your code base has a substantial amount of code that works in both environments.

I have an open-source full-stack node/JS application called mjournal that keeps browser code and node code alongside each other. You can have a look and see if it feels logical to you and easy to understand where code lives. It is by no means a popular approach, so many folks will dislike it, but it feels good to me personally since I've embraced "group by coupling" as a general principle.

Figuring out how to incorporate normal guidance on how to acplish a typical node debug mand is non-trivial in this type of setup

Yeah, that's nonsense. Your app should start with npm start or something like node server.js. Elaborate gulp/grunt setups that confuse new developers are unnecessary plexity you should just eliminate.

The server-side story bees even more plex in cases where the server side code is used both for the purpose for serving up static content

In my experience, the code to serve up static content boils down to 5 lines or less, so no big deal. If you have a non-microscopic amount of code dealing with serving static content, again something has gone way off the rails.

Run-Time Client Side Code

My hope is that there is that there is some general guidance on how to put all of this together in a sane way perhaps by an authoritative source mainly to give guidance to those like myself who may want start off on the right foot.

There are some people in the node munity that have adopted the "convention over configuration" approach in use by Ruby on Rails, EmberJS, and some other large projects. If you like that approach, check out tools that use it like SailsJS, EmberJS, Yeoman generators, etc.

But in general, looking for a "standard" is not how the node.js/javascript/web munity rolls. Small npm packages. File layouts that are forced into obviousness due to smallness. I feel your frustration here as front-end toolchains are so plex, but ultimately it's because JavaScript in the browser took too many decades to create a reasonable module system. Things may start to standardize in the next few years now that ES6 modules are an official spec, but with so much code already written in CommonJS and it's terrible precursors like RequireJS/AMD, we'll be dealing with them probably for the foreseeable future.

发布者:admin,转转请注明出处:http://www.yc00.com/questions/1743818330a4512309.html

相关推荐

  • Python | python3.8安装教程(Windows环境)

    摘要:本文将介绍python的安装教程,适用于首次安装python的用户 官网链接:https:www.python 配置说明 运行环境:Wind

    1小时前
    00
  • MCP实战

    前言最近热衷于找一些好玩的MCP,集成在cursor中,给大模型外挂许多有趣的功能,例如:什么是MCP?本地如何开发MCP ServerMCP实战 | cursor 如何一句话操作 gitHub 代码库cursor 如何调用 MCP ser

    1小时前
    00
  • win 7系统怎么看计算机配置,windows7系统怎么查看电脑配置

    通常我们在选购电脑的时候都比较注重电脑配置,那么windows7系统怎么查看电脑配置呢?接下来大家跟着学习啦小编一起来了解一下windows7查看电脑配置的解决方法吧。 windows7查看电脑配置方法一&#x

    1小时前
    00
  • VMware虚拟机设置为固定IP

    操作原因:安装完成虚拟机后会生成一个IP,由于ip变化导致搭建好的k8s集群无法启动。因此将虚拟机配置为固定IP1、修改虚拟网络编辑器:打开虚拟网络编辑器,修改NAT设置:2、修改电脑的虚拟网卡地址选中这个网卡-->点击右键-->

    1小时前
    00
  • 很干!dockerfile最佳实践

    为什么你打包的镜像那么大?为什么打包过程耗时这么久?导致整个部署的效率很低,如果你有这样的疑问,那么很多时候是因为dockerfile的问题,这篇文章将会深入介绍dockerfile的最佳实践,帮助你构建更高效、更小、更可维护的镜像。缓存机

    1小时前
    00
  • PDF转换Word深度评测

    ComPDFKit PDF 转换 SDK V3.0有以下几个新功能:使用百万级文档训练数据集对 PPYoloE AI 模型进行微调全场景布局分析算法及下一代表格识别算法重构数据结构、转换流程、PDF解析和输出模块混合布局:将流式布局与固定布

    1小时前
    00
  • Python 爬虫如何伪装 Referer?从随机生成到动态匹配

    一、Referer 的作用与重要性Referer 是 HTTP 请求头中的一个字段,用于标识请求的来源页面。它在网站的正常运行中扮演着重要角色,例如用于统计流量来源、防止恶意链接等。然而,对于爬虫来说,Referer 也可能成为被识别为爬虫

    1小时前
    00
  • Elasticsearch BBQ与OpenSearch FAISS:向量搜索性能对比

    基于二进制量化的向量搜索:Elasticsearch使用BBQ技术比OpenSearch搭配FAISS快5倍。我们收到社区要求,希望能解释Elasticsearch与OpenSearch在语义搜索向量搜索方面的性能差异。因此,我们进行了一

    55分钟前
    00
  • DeepSeek辅助Power BI自定义Vega条形图

    Power BI Deneb这个视觉对象支持Vega自定义图表。网上有丰富的Vega代码资源,参考《Power BI Deneb图表资源库》,EasyShu提供了Excel版本的Vega图表库,Power BI也可以借鉴。使用Vega并不意

    52分钟前
    00
  • 完美解决win7系统使用wireshark未响应问题

    Win7系统,安装wireshark4.0的版本,发现打开可以打开,但是只要点击网卡之后就会显示无响应 一开始我以为是位数的原因,之前用的64位的&am

    51分钟前
    00
  • 你的服务器够快吗?一文说清如何衡量服务器的性能?

    本文以一个标准的 Seurat 单细胞分析流程为例,深入探讨衡量计算性能的关键指标——运行时间(Elapsed Time)、CPU 时间(CPU Time)和等待时间(Wait Time)——揭示它们在单线程与多线程环境下的差异及其反映的系

    50分钟前
    00
  • windows11 x64 操作系统不支持Xilinx ISE 14.4版本,解决方案:创建windows7 x64 虚拟机,再安装Xilinx ISE 14.4。

    点击 下面的xsetup.exe可执行文件,弹出下面的报错框 : 于是我通过网上阅读文章进行了一系列的尝试 。 省流:1-7步骤都可以不用看,这些都是

    49分钟前
    00
  • 苹果电脑装win7系统问题

    安装中问题: Windows 未能启动。原因可能是最近更改了硬件或软件。解决此问题的步骤: 1. 插入Windows 安装光盘并重新启动计算机。 2. 选择语言设置,然后单击

    47分钟前
    00
  • 铜缆以太网19

    40G-CR4100G-CR10 (C85)PCS (C82)(二)发送方向发送过程发送过程基于从XLGMIICGMII接收到的TXD<63:0>和TXC<7:0>信号生成块。1个XLGMIICGMII数据发送

    40分钟前
    00
  • CMeas度量体系建设:让数据驱动更科学

    本文来自腾讯蓝鲸智云社区用户: CanWay研发效能度量在企业数字化转型中至关重要。它有助于企业全面量化研发过程,洞察业务绩效,识别效能瓶颈或提效机会、优化资源配置,并为决策提供有力支撑,持续推动企业研发效能优化提升。目前,效能度量已不局限

    35分钟前
    00
  • Fabric8 Kubernetes 日志工具实践

    最近在使用 Fabric8 Kubernetes Client 的过程中发现了新大陆一样,感觉利用这个库可以进行很多有趣的功能尝试,其中一个便是日志的本地化。原因无他,rancher 页面性能实在太差了,经常性的暂停工作,碰到故障排查的时候

    33分钟前
    00
  • Sentinel 的熔断和限流

    在分布式系统里,服务之间牵一发而动全身,一个接口雪崩,可能带崩整个应用链路。要想系统抗住流量洪峰,顶住突发异常,就得在稳定性上下功夫。今天我就来说说稳定性保障里的老将——Sentinel,看看它是怎么凭借限流熔断,在服务治理的江湖里占得一席

    31分钟前
    00
  • PostgreSQL无服务 Neon and Aurora 新技术下的新经济模式 (翻译)

    说完新技术下的新经济模式,下面咱们用Amazon Aurora 的Postgres 无服务的介绍来结束此篇文章。(跟上新形势,不做落后的人)原文地址:引言:文章首先提到,将传统关系型数据库(如 MySQL)分解为独立的存储和计算组件,可

    30分钟前
    00
  • MODIS遥感影像批量下载方法

      本文介绍在Earthdata中批量下载MODIS遥感影像各产品数据的方法。  前期我们介绍了批量下载Landsat与MODIS等遥感影像的最新可行方法,本文则再介绍一种基于Earthdata的MODIS批量下载方法。但要注意,此方法有的

    15分钟前
    20
  • OFC 2025:IBM开发应用于CPO的高密度聚合物波导光子模块

    一、技术背景:突破电互连瓶颈在服务器硬件中,计算单元的带宽每两年以约 3 倍的速度增长,而互连技术仅以 1.4 倍的速度发展,导致 “带宽鸿沟” 持续扩大。传统可插拔收发模块虽能扩展传输距离,但在高密度集成和功耗上存在局限。

    8分钟前
    00

发表回复

评论列表(0条)

  • 暂无评论

联系我们

400-800-8888

在线咨询: QQ交谈

邮件:admin@example.com

工作时间:周一至周五,9:30-18:30,节假日休息

关注微信