Is it possible to use an Angular 2 Dart frontend with a Node.js backend?

Issue

I am planning out the tools I will use in my web app. I would like to use Node.js as a server backend because it has a module that would be particularly useful to me. However, I would also like to use Angular 2 (Dart) with Polymer.dart in the frontend. Excuse me if the answer should be obvious, but how will it work to combine these two parts of my app seamlessly (and without conversion tools), as is commonly done in the MEAN stack, since Dart is not directly compatible with JS?

There aren’t any tutorials or resources currently available that demonstrate this combination. It seems to me the more common use case is to have Dart also act as a server backend.

Solution

How to serve a Dart client application

The client and server can be two distinct applications that are not bound to each other at all. The only connection that is required is, that the server can interpret the requests sent by the client and that the client can interpret the responses.

The built Dart client application is like static HTML and can be served by any HTTP server. I don’t know Node.js, but I assume it has a directory where it serves static content from. This is where you place the build output of your Dart client application.

Communication between Dart client and Node.js server

For client and server to be able to communicate, Dart needs to send requests in the form the server expects. You can use REST, WebSocket, Ajax with JSON body or protocol buffers.
An advantage of using the same language on client and server is, that model classes that are serialized to or deserialized from the wire protocol format and the serialization/deserialization code can be shared between client and server. That’s not possible in this case. The Dart team is working in generating JS and TS from Dart which might solve this eventually. If you use Protocol Buffers this also doesn’t apply because you can generate the code for both languages from the same proto files.

Development requirements

For development you have to consider that you “need” two servers. The Node.js server that is the actual server for you application and also pub serve for fast change and reload cycles (to avoid building to JS after each change).
This is usually done by a proxy (can be Nginx for example or a custom Dart script using the shelf and shelf_proxy package) that forwards requests for Dart source files to pub serve and Rest/Ajax/WebSocket requests to your Node.js server.

Answered By – Günter Zöchbauer

Answer Checked By – Willingham (FlutterFixes Volunteer)

Leave a Reply

Your email address will not be published. Required fields are marked *