LDSTechForumProjects

OpenWebStack Integration with the .NET Stack

This article provides information on front end development that you can enjoy and be proud of.

OpenWebStackBanner.png

Creating a project with the Open Web Stack for .NET

Getting started with the Open Web Stack in a .NET project is quick and easy. You do not need to install node.js or anything else. .NET developers can use a NuGet package created by the Stack Team to set up a ready-to-go self contained environment for compiling front end code with node.js.

Note: This is not a comprehensive document on the Open Web Stack. If you are new to it then you may want to first go through the Open Web Stack website.

Installation

a) Open the NuGet package LDS Open Web Stack for .NET from the NuGet Package Manager in Visual Studio. To do this, select Tools > Library Package Manager > Manage NuGet Packages and then click Install. OpenWebStackInstallation.png

b) The package will add several things to your project:

OpenWebStackPackage.png 1. Node Solution Folder

node.exe will be used to compile the front end OpenWebStack files when you build the solution.

node.targets is an MSBuild file that tells Visual Studio how to use node.exe.


2. Content Folders: css and js

JavaScript and .less files the OpenWebStack uses for optimizing scripts and style sheets.


3. Folder: node_modules

Files from the OpenWebStack starter kit.

More details on the starter kit can be found at the OpenWebStack site: http://openweb/project-starter

The steps listed on the project starter page were already performed during the compilation of the NuGet package so you do not need to perform them.

You do not need to install node.js or anything else, the NuGet package is self-contained.


4. Primary Build File

app.build.js is the primary file used by node to define the front end build.

c) Where to put your scripts:

main.js is a centralized place for you to put your JavaScript functions.

d) Debugging:

When you are debugging your project in Visual Studio, the front end will run unoptimized. node.js is only used in your site's output but your site will run the same either way (just not optimized).

e) Building the project:

  • After building your project you will notice a Content-build folder. This includes front end files that node has optimized.
  • If you choose to Publish your site, then you will have a single Content folder containing only .css files and a single main.js file.
This page was last modified on 6 December 2012, at 17:17.

Note: Content found in this wiki may not always reflect official Church information. See Terms of Use.