Skip to content

Commit f97b72b

Browse files
Rewrite repo README.md to link to other docs
1 parent dab67c8 commit f97b72b

File tree

1 file changed

+41
-64
lines changed

1 file changed

+41
-64
lines changed

README.md

Lines changed: 41 additions & 64 deletions
Original file line numberDiff line numberDiff line change
@@ -1,89 +1,66 @@
1-
JavaScriptServices
2-
========
1+
# JavaScriptServices
32

43
This project is part of ASP.NET Core. You can find samples, documentation and getting started instructions for ASP.NET Core at the [Home](https://github.com/aspnet/home) repo.
54

65
## What is this?
76

8-
This repo hosts sources for the `Microsoft.AspNetCore.AngularServices` and `Microsoft.AspNetCore.ReactServices` packages, along with samples and the underlying `Microsoft.AspNetCore.SpaServices` and `Microsoft.AspNetCore.NodeServices` packages.
7+
`JavaScriptServices` is a set of technologies for ASP.NET Core developers whose applications involve JavaScript. It's especially useful if you use Angular 2 / React / Knockout / etc. on the client, or if you build your client-side resources using Webpack.
98

10-
#### `Microsoft.AspNetCore.AngularServices`
9+
These technologies consist of:
1110

12-
This package provides facilities for developers building Angular 2 applications on ASP.NET.
11+
* A set of NuGet/NPM packages that implement the functionality
12+
* A Yeoman generator that creates preconfigured app starting points
13+
* Samples
1314

14-
Most notably, this includes **server-side prerendering**. You can build a "universal" (sometimes called "isomorphic") single-page application that renders its initial HTML on the server, and then continues execution on the client. Benefits:
15-
* Massively improves application delivery and startup time (often reducing from 5-10+ seconds to 100ms or so, especially on high-latency networks or low-CPU-speed clients)
16-
* Enables search engine crawlers to explore your SPA
17-
* Ensures that users don't wait for any 'loading' UI when they first hit your application.
15+
Everything here is cross-platform, and works with .NET Core 1.0 RC2 or later on Windows, Linux, or OS X.
1816

19-
A sample is included in this repo.
17+
## Creating new applications
2018

21-
We are also working with the Angular team to add support for other client+server features such as cache priming, so that the client-side SPA code does not need to wait for an initial set of ajax requests to complete - the necessary data can be bundled with the initial page. Another possible future feature would be helpers to emit a JSON representation of C# class model metadata, so some validation rules can transparently apply both on the server and the client.
19+
If you want to build a brand-new ASP.NET Core app that uses Angular 2 / React / Knockout on the client, consider starting with the `aspnetcore-spa` generator. This lets you choose your client-side framework, and generates a starting point that includes applicable features such as Webpack dev middleware, server-side prerendering, and efficient production builds. It's much easier than configuring everything to work together manually.
2220

23-
#### `Microsoft.AspNetCore.ReactServices`
21+
See: [getting started with the `aspnetcore-spa` generator](http://blog.stevensanderson.com/2016/05/02/angular2-react-knockout-apps-on-aspnet-core/).
2422

25-
This package provides similar facilities for React applications on ASP.NET.
23+
## Adding to existing applications
2624

27-
This includes **server-side prerendering** to support "universal" (sometimes called "isomorphic") single-page applications as described above. A sample is included in this repo.
25+
If you have an existing ASP.NET Core application, or if you just want to use the underlying JavaScriptServices packages directly, you can install these packages using NuGet and NPM:
2826

29-
We are open to adding other client+server features that will make React developers more productive on ASP.NET. Please let us know if you have specific feature proposals.
27+
* `Microsoft.AspNetCore.NodeServices`
28+
* This provides a fast and robust way for .NET code to run JavaScript on the server inside a Node.js runtime.
29+
* Most applications developers don't need to use this directly, but you can do so if you want to implement your own functionality that involves calling Node.js code from .NET at runtime.
30+
* Find [documentation and usage examples here](https://github.com/aspnet/JavaScriptServices/tree/master/src/Microsoft.AspNetCore.NodeServices#microsoftaspnetcorenodeservices).
31+
* `Microsoft.AspNetCore.SpaServices`
32+
* This provides infrastructure that's generally useful when building Single Page Applications (SPAs) with technologies such as Angular 2 or React (such as server-side prerendering and webpack middleware). Internally, it uses the `NodeServices` package to implement its features.
33+
* Find [documentation and usage examples here](https://github.com/aspnet/JavaScriptServices/tree/master/src/Microsoft.AspNetCore.SpaServices#microsoftaspnetcorespaservices).
34+
* `Microsoft.AspNetCore.AngularServices`
35+
* This builds on the `SpaServices` package and includes features specific to Angular 2. Currently, this includes validation helpers and a *cache priming* feature, which let you pre-evaluate ajax requests on the server so that client-side code doesn't need to make network calls once it's loaded.
36+
* The code is [here](https://github.com/aspnet/JavaScriptServices/tree/master/src/Microsoft.AspNetCore.AngularServices), and you'll find a usage example for [the validation helper here](https://github.com/aspnet/JavaScriptServices/blob/master/samples/angular/MusicStore/wwwroot/ng-app/components/admin/album-edit/album-edit.ts), and for the [cache priming here](https://github.com/aspnet/JavaScriptServices/blob/master/samples/angular/MusicStore/Views/Home/Index.cshtml#L7-8). Full docs are to be written.
3037

31-
#### *Your favourite JavaScript framework goes here*
38+
At some point, if we have React-specific features, they will go into a package called `Microsoft.AspNetCore.ReactServices`. Presently there's no need for any such package, because the functionality we want is already included in `SpaServices` without having to be specific to React. Nothing extra is currently needed.
3239

33-
Although we have finite resources and are currently focused on adding Angular 2 and React support, the architecture here is designed so that you can build your own server-side support for other client-side libraries and frameworks.
40+
If you want to build a helper library for some other SPA framework, you can do so by taking a dependency on `Microsoft.AspNetCore.SpaServices` and wrapping its functionality in whatever way is most useful for your SPA framework.
3441

35-
The underlying `Microsoft.AspNetCore.NodeServices` package is a general-purpose way for ASP.NET applications (or .NET applications more generally) to interoperate with code running inside Node.js. That's how `AngularServices`/`ReactServices` server-side rendering works - those packages transparently spin up Node.js instances that can perform the server-side rendering. Any code that runs inside Node can efficiently be invoked from .NET via this package, which takes care of starting and stopping Node instances and manages the communication between .NET and Node.
42+
## Samples and templates
3643

37-
## Using AngularServices/ReactServices in your own projects
44+
Inside this repo, the `templates` directory contains the application starting points that the `aspnetcore-spa` generator emits. If you want, you can clone this repo and run those applications directly. But it's easier to [use the Yeoman tool to run the generator](http://blog.stevensanderson.com/2016/05/02/angular2-react-knockout-apps-on-aspnet-core/).
3845

39-
Currently it's a little early for production use in real projects, because for example AngularServices uses [angular-universal](https://github.com/angular/universal), which is still in prerelease. Some important features are either not implemented or are not yet stable. The React support is more solid.
46+
Also in this repo, the `samples` directory contains examples of using the JavaScript services family of packages with Angular 2 and React, plus examples of standalone `NodeServices` usage for runtime code transpilation and image processing.
4047

41-
If you're a keen early-adopter type, you can infer usage from the samples. Let us know how you get on :)
48+
**To run the samples:**
4249

43-
## Trying the samples
50+
* Clone this repo
51+
* Change directory to the same you want to run (e.g., `cd samples/angular/MusicStore`)
52+
* Restore dependencies (run `dotnet restore` and `npm install`)
53+
* Run the application (`dotnet run`)
54+
* Browse to [http://localhost:5000](http://localhost:5000)
4455

45-
To get started,
56+
## Contributing
4657

47-
1. Ensure you have [installed the latest stable version of .NET Core](https://www.microsoft.com/net). The packages are built to work with .NET Core version RC2 or later. [Installers](https://www.microsoft.com/net/download) are available for **Windows**, **OS X**, **Linux**.
48-
2. Ensure you have [installed a recent version of Node.js](https://nodejs.org/en/). To check this works, open a console prompt, and type `node -v`. It should print a version number.
49-
3. Clone this repository:
58+
If you're interested in contributing to the various packages, samples, and project templates in this repo, that's great! You can run the code in this repo just by:
5059

51-
```
52-
git clone https://github.com/aspnet/JavaScriptServices.git
53-
```
60+
* Cloning the repo
61+
* Running `dotnet restore` at the repo root dir
62+
* Going to whatever sample or template you want to run (e.g., `cd templates/Angular2Spa`)
63+
* Restoring NPM dependencies (run `npm install`)
64+
* Launching it (`dotnet run`)
5465

55-
**Using Visual Studio on Windows**
56-
57-
1. Open the solution file, `JavaScriptServices.sln`, in Visual Studio.
58-
2. Wait for it to finish fetching and installing dependencies.
59-
3. If you get the error `'reactivex/rxjs' is not in the npm registry`, then your Visual Studio installation's version of the NPM tool is out of date. You will need to restore NPM dependencies manually from a command prompt (e.g., `cd samples\angular\MusicStore` then `npm install`).
60-
4. Select a sample and run it. For example, right-click on the `MusicStore` project in Solution Explorer and choose `Set as startup project`. Then press `Ctrl+F5` to launch it.
61-
62-
Note that to run the React example, you'll also need to run `webpack` from the `samples\react\ReactGrid` directory (having first installed webpack if you don't yet have it - `npm install -g webpack`).
63-
64-
**Using dotnet on Windows/Mac/Linux**
65-
66-
1. In the solution root directory (`JavaScriptServices` - i.e., the directory that contains `JavaScriptServices.sln`), restore the .NET dependencies:
67-
68-
```
69-
dotnet restore
70-
```
71-
72-
2. Change directory to whichever sample you want to run, then restore the Node dependencies. For example:
73-
74-
```
75-
cd samples/angular/MusicStore/
76-
npm install
77-
```
78-
79-
3. Where applicable, build the project. For example, the Angular example uses Gulp, so you'll need to execute `gulp`, whereas the React example uses Webpack, so you'll need to execute `webpack`. The ES2015 example does not need to be built.
80-
81-
If you don't already have it, install the applicable build tool first (e.g., `npm install -g webpack`).
82-
83-
4. Run the project (and wait until it displays the message `Application started`)
84-
85-
```
86-
dotnet run
87-
```
88-
89-
5. Browse to [`http://localhost:5000/`](http://localhost:5000/)
66+
If you're planning to submit a pull request, and if it's more than a trivial fix (e.g., for a typo), it's usually a good idea first to file an issue describing what you're proposing to do and how it will work. Then you can find out if it's likely that such a pull request will be accepted, and how it fits into wider ongoing plans.

0 commit comments

Comments
 (0)