How to POST/PUT simple data to endpoints in BreezeJS - angularjs

I'm developing a SPA in angular with BreezeJS, I could configure the client to get the data from an typical RESTful API with no special support for Breeze capabilities (Metadata is writen by hand). Now I'm struggling to create/update entities, since my server endpoints expect a simple structure, but BreezeJS saveChanges sends an array like the one described in this question
What I need is to change the data my app sends to the server from this
// Current saveBundle
{"entities": [
{ id:4,
label: "text",
description: "longer text"...,
"entityAspect": {"entityTypeName": ...}},
]}
to this:
{
id:4,
label: "text",
description: "longer text"...,
}
Is there a method or property I can override or something simple, I've been reading something about extending or writing my own dataservice adapter, but I'm lost in those waters. I'm thinking on putting some validations to parse that object from the API server in laravel, but that is not an easy way since there's a lot of code laid on already and the intention is to be generic so other clients (Breeze-less ones) consume the API.
Thank you in advance

Take a look at the Breeze REST Adapter for Azure Mobile or the Breeze REST Adapter for Sharepoint. You should be able to convert one of them to meet your needs.
See the Todo-Zumo sample to see how the adapter is used.

Related

Pattern for consolidating API calls while maintaining loose coupling?

Single-page apps often make several API calls on first load. Something like a dashboard might: load user information, load main content, load sidebar content, etc.
Letting individual components worry about making these requests is easy but increases load times since you have n components making n requests.
One approach is to consolidate under a single API endpoint all of the calls made by any one page. So now the dashboard page no longer makes n calls to n different endpoints but 1 call to the newly-introduced /dashboard endpoint.
This solution comes at the cost of couples serverside logic with client logic, which seems like a bad idea.
Another approach would be to limit this coupling to the client by consolidating all API calls to a single component which then could batch up all the queries, wait for the response, decompose it into its parts, and then distribute those results to the corresponding components. This approach seems better than the above, though there's still coupling.
Question: is there a well-established pattern (or a popular library) for addressing this problem? I imagine that every large application runs into this problem at some point, yet I can't find any information on the subject.
I don't know how large your application is but since you mentioned"every large application runs into this problem at some point" I think GraphQL is what you need.
GraphQL was developed internally by Facebook in 2012 before being publicly released in 2015. It basically provides a new approach to developing web APIs and has been contrasted with REST and other web service architectures. GraphQL supports read, write (they call it mutation), and subscribe to changes to data - realtime updates.
A little bit of history on why Facebook built GraphQL: In 2012, Facebook was working on their mobile application for Android and iOS. They had to make changes in their existing REST services to make it working for their mobile platforms as well considering data fetching on mobile devices with low network bandwidth. In order to resolve this issue, they started to work on GraphQL so they could still use their existing services for mobile platform as well.
There are so many advantages using GraphQL but one of them is what you are exactly looking for: Get many API’s response in single request
Also fo the front-end if you are using React, you can use Relay The production-ready GraphQL client for React by Facebook. Also there is another client GraphQL framework called Apollo
Here is just an example how the query is sent and how you will get the response based on requested query
request:
{
orders {
id
productsList {
product {
name
price
}
quantity
}
totalAmount
}
header {
id
isReadOnly
...
}
.....
}
Response:
{
"data": {
"orders": [
{
"id": 1,
"productsList": [
{
"product": {
"name": "productName",
"price": 20.55
},
"quantity": 100
}
],
"totalAmount": 80
}
]
"header": {
"id": 1,
"isReadOnly": false,
...
}
}
}

How to implement "client" type action in IBM Watson Assistant client?

I'm working on IBM Watson Assistant service to build AI chatbot and currently I have building client side UI for that, So as per IBM's documentation they supports various actions to trigger external business logic using functions. I assume that "client" type action can help me to trigger some javascript function but I cannot see any working example on google. So please help me to implement "client" type action in my html/javascript client.
Check the question in this posting - https://developer.ibm.com/answers/questions/477020/help-with-custom-actions-for-ibm-watson-assistant/
There are two parts to client side actions. The first is in the dialog which signals that an action is required, and where the result of the action should be placed. Client side actions require you to have an orchestration layer. Which means that you are in control of both the dialog flow and the orchestration layer that is reacting. It is up to you how you get them to coordinate. You are not obliged to follow any pattern. The easiest way is to use the Context. The dialog sets a context variable eg. 'PleaseDoSomething', the application sees it and does something.
The documented Client Action construct is a specification that puts a structure to this process; Allows other orchestration layers to make sense of the action; Allows you to switch to Cloud Functions relatively easily.
If use the Client Action construct.
then the dialog json will look something like:
{
"output": {
"text": {
"values": [
"Hang on I need to look that up."
],
"selection_policy": "sequential"
},
"actions": [
{
"name": "fetchBalance",
"type": "client",
"result_variable": "balance"
}
]
}
}
Your orchestration layer looks for 'Actions', runs 'fetchBalance' and puts the result in the context field 'balance'.

How to have sample dataset on AWS ElasticSearch or other service provider for SearchKitManager()?

I am trying to use SearchKit and I want to know how to set up an ElasticSearch instance indexed with sample movie dataset.
Tried using:
AWS ElasticSearch Service. But don't have an actual dataset to upload through bulk API. The one that I have doesn't have indexing.
Sample data:
[
{
"movie_title":"Avatar ",
"director_name":"James Cameron",
"actor_1_name":"CCH Pounder",
"actor_2_name":"Joel David Moore",
"genres":"Action|Adventure|Fantasy|Sci-Fi",
"language":"English",
"country":"USA",
"content_rating":"PG-13",
"budget":"237000000",
"title_year":"2009",
"plot_keywords":"avatar|future|marine|native|paraplegic",
"movie_imdb_link":"http://www.imdb.com/title/tt0499549/?ref_=fn_tt_tt_1"
},
...
]
Tried using appbase.io ready made movie-dataset. But I am not sure how to connect it with SearchKitManager().
Would really appreciate any help.
you may want to try ReactiveSearch - it's an alternative to SearchKit from appbase.io (I work there) that's actively maintained. It supports direct use of appbase.io apps.
Re: SearchKitManager(), I am not sure if that may work as we don't support cluster level routes.

Request data to an angular-meteor application

I am currently developing an application which has a collection in mongo of tv channels.
The app is growing quite nicely but I was requested to create an external app or page with a different domain just to show the list of updated channels (before channel and current channel and new releases etc)
What I did was create a simple angular app without a server, just pure angular, and I was wondering how am I able to make an http request to get the list/collection of the main application that has the list/collection of the channels.
this is the scheme for channels:
meteor:PRIMARY> db.channels.find().pretty()
{
"_id" : "2WzykFxP3LpNvh4hq",
"logo" : "images/alineacion/ultimate/tbn.svg",
"before" : 104,
"number" : 105,
"category" : [
"Ultimate"
],
"edit" : false,
"name" : "tbn"
}
QUESTION
How can I make an http request to get the list/collection of channels from a different angular application to an angular-meteor app so I'm able to list the channels?
There are previous questions about this, and if you are bound to the idea of http call for data access, I would recommend reviewing them. I started here: How to expose a RESTful Web Service using Meteor; this had a link to a github which linked to another github: https://github.com/xcv58/meteor-collectionapi.
Atmosphere also has packages to simplify creation of REST API on your meteor app: https://atmospherejs.com/simple/rest for example. An Atmosphere package is a bit easier to integrate than other source in my opinion.
Finally, I would recommend looking at DDP for your angular app - this allows your app to interact with the Meteor app you have already built by collections and methods which you have exposed.
https://github.com/afuggini/angular-ddp seems to address your specific (angular) case; I have used https://www.npmjs.com/package/ddp-client in a react-native app.

breeze with asp.net web api, reporitories and UoW

I just started using breeze.js, it looks wonderful, but there is something that makes me confused. I am a newbie, so I am sorry if my question is dumb, or does not make sense:)
In server side, I have some repositories and UoW, I am trying to create REST Service. But I want to consume this service from mobile devices like Android, IOS and also from my SPA (Thanks to John Papa for HotTowel).
My confusion is if I arrange my UoW according to Breeze like using EFContextProvider or saving changes by using
public SaveResult SaveChanges(JObject saveBundle)
{
return _contextProvider.SaveChanges(saveBundle);
}
instead of using
public void Commit()
{
//System.Diagnostics.Debug.WriteLine("Committed");
DbContext.SaveChanges();
}
1)Am I still going to be able to use my UoW methods (like savechanges) from my non-breeze controllers?
and
2)Am I still going to be able to use the Rest service from native applications in mobile devices(that does not use breezejs).
1) No you cant use breeze contextProvider.SaveChanges() in your other controllers.
contextProvider.SaveChanges(JObject saveBundle)
breeze server side expects saveBundle to be a json data created by breeze client side js.
2) Create any other webapi controller for REST with its own repository. You can't work with breeze's repository saveChanges without breeze client side js.
UPDATE:
Breeze is raising so fast, they now have a BreezeSharp project. It can be integrated into your .net application. See Jay Traband answer saving changes to breeze web api from c#
#Didar is correct to observe that the JObject saveBundle is specific to the POST body sent by a Breeze client using the Web API out-of-the-box data service adapters.
I want to let you know that a Breeze client saveChanges method call can update a conventional RESTy service with separate PUT/POST/DELETE/PATCH methods if that's what you want to do. You'll have to change the client-side "data service adapter" to one that understands your server API ... or more likely write one that matches the peculiarities of your API.
Writing a custom data service adapter not a newbie task to be sure. We'll be showing how to do it soon ... but it won't be a newbie task ... more an intermediate's task.
My point is that it is there to be done, it isn't hard, and you can take comfort that it will be within your capacity to write by the time you need it.
FWIW, none of the code you're showing actually conforms to repository or UOW patterns IMO. You're showing perfectly serviceable starter code ... code that gets you up and running with a minimum of fuss.
Once you get going, you'd refactor so that references to contextProvider are no longer in your controllers. They'd be wrapped in a repository or unit-of-work component of some sort.
That's a story for another day.

Resources