So i want to develop a simple web application, which will basically be a basic form which on submission will allow to make an external api request. So are there any application designers that can allow to do that with minimalistic code. Appian for example has an interface/application designer that lets you drag and drop a UI interface and build a workflow, make api calls externally or to a database. So like that are there any other apps that allow to do something similar (make api calls/build ui easily/store in databse)? Any other suggestions are also welcome!
It heavily depends on the API as well as the kind of task you´re trying to achieve.
Here´s just a few examples and considerations. (All the below supposes that we´re talking about Web-Based APIs).
If the API requires authentication of some sort and the user authenticates himself: A simple HTTP file with JavaScript to send the request will do the job
If the API requires authentication but you authenticate for all the users: You will need a backend application that does the API request since you need something secure where you can put your Auth-Details for the API. Classic PHP or NodeJS in combination with a served HTTP file for the form itself would work without any JavaScript (depends on the API definitions)
If the API does not require authentication maybe a simple HTML form would work
If you want to write to a database you can have a look at something like https://directus.io/. They allow building a database with a UI and they automatically generate a Web-API which you can then feed by your forms. If the end-user is known to you Directus actually allows users to log in and fill the database with forms that you can visually design but this is rather for employees entering data into an internal database than customers submitting their contact data to you
From my personal experience, all the UI-Tools that promise to integrate with REST APIs make it really hard to do so since every API is different and there is no real standard for them.
Related
I'm currently working on an analytics webapp with a react frontend and node (express) backend.
Describing the functionality in a nutshell:
A user will be able to login on the website, search for a YouTube username and then the YouTube API is called, the data will be stored in a mysql db via my express API and also the data will be used to calucalte some statistics which afterwards are displayed in a dashboard.
Now I was wondering if I should:
Call the YouTube API from the frontend, i.e. inside my react code, do the calculations display them and and then store it in the DB via my express API.
Or, from the react app call an endpoint in my express API that will then call the YouTube API, store the data in the DB and then pass on the data to my react app.
Are there any best practices or up-/downsides to either approach?
When answering questions like these, it's important to remember that the client-side is different for each and every user that visits your website, their internet speed, their GPU & CPU power, etc., but the server is most commonly held in a stable container and much more powerful than a client.
The proper way would be the following:
1. Obtain a search query from a client
Meaning you should get the user's search query from an input, or any other form of control (text area, checkbox, etc.), this way client is doing the least business logic, as it should. The client should always focus more on UI / UX rather than business logic.
2. Send query to the server
Let the server use the query you've just obtained from client, call the youtube api from the server (either explicitly using Axios, or find a node.js youtube library), and do all the necessary calculation on the backend
3. Send processed data to the client
Let client receive the data in the form which is ready for use (iterations, mappings, etc.) - again separating concerns, server - business logic, client - UI / UX
Now to be fair, the example you have will most commonly be done all on the client-side, since it is not as computationally heavy as other enterprise examples, but this is a good rule to follow for big projects, and no one would really complain if you did it this way, since it would be the proper way.
How do I correctly handle the login/authentication scenario for an Azure web app in my VS2015 web performance test?
I created an XML file as a data source for the WAAD username and password. I bind the username and password to the Form Post Parameters: login and passwd respectively at request: https://login.microsoftonline.com/xxxx/login
But when I run the test, the Web Browser tab shows this error:
We can't sign you in
Your browser is currently set to block JavaScript. You need to allow
JavaScript to use this service.
To learn how to allow JavaScript or to find out whether your browser
supports JavaScript, check the online help in your web browser.
I also get a number of errors like this:
The value of the ExpectedResponseUrl property
Validation xxxx.azurewebsites.net/xxxx/docs/xxxx.aspx does
not equal the actual response URL
login.microsoftonline.com/xxxx/wsfed. QueryString
parameters were ignored.
Any idea how I can successfully log in to the Azure web app via the web performance test?
There are several methods of login and authentication that can be used. Just binding values to form post parameters may not be sufficient or correct. You will find the login form has hidden session identities that must be passed as well as the login data. I find that recording a test two times using as nearly as possible the same inputs and doing the same activities helps. These two tests can then be compared to find the dynamic data that needs to be handled.
In a comment the questioner added "I noticed these parameters, n1-43 are different but I have no idea what they represent. How do I handle them?". I can have no idea what they represent as I do not know the website you are testing. You could ask the website developers. Or, better, treat them as dynamic data. Find where the values come from, save them into context variables and use them as needed. This is basic web test development. Here and here are two good articles on what to do.
The message about JavaScript not being supported can be ignored. Visual Studio web tests do not support JavaScript or any other "active" parts of a web page, they only support the html part. Your job as a tester is to simulate what the JavaScript does for the specific user journeys you are testing. That simulation is generally just filling in the correct values (via context parameters) in the recorded requests.
Unexpected response urls can be due to earlier failures, such as teh login not working. I suggest not worrying about them until all of the other test problems are solved. Then, if you need help ask another new question.
Is it possible to use google apps script in my HTML? I want to be able to write to a spreadsheet from a form in purely Javascript from an external framework such as Node.js.
https://developers.google.com/apps-script/
Google Apps Script's syntax is Javascript, however it is a unique server-side framework that does not behave as a library to applications outside of the Apps Script servers. (No, you won't be able to use Google Apps Script in your node.js app.)
However, that doesn't mean that your node.js app (or any other app on the web) can't interact with your spreadsheet. For instance, your app could authenticate as you using the OAuth API, then access the spreadsheet through the Google Drive API. For an example of this, see Accessing Google Spreadsheets from Node.js
Alternatively, you could roll your own spreadsheet API in Google Apps Script, to support read / write of your sheet via HTTP requests from your node.js app. There are plenty of examples of that, for example Insert new rows into Google Spreadsheet via cURL/PHP - HOW?.
Sure you can. You can use HtmlService to create your web form, then send the submission data to your Spreadsheet with server functions.
Nowadays you could use the Google Apps Script API to call your Google Apps Script code from other platforms like Node.js, actually the official docs include a quickstart for Node.js.
You can you use HtmlService, but maybe can be helpfull to read the Google Hosted Libraries https://developers.google.com/speed/libraries/
To use a Javascrtip library inside GAS, I recommend JQuery.
But Maybe, you can use Node.js inside your external website and make a AJAX Request (get or post) to a GAS and return from GAS this:
ContentService.createTextOutput(e.parameter.callback + "("+Utilities.jsonStringify(JSONDATA)+")").setMimeType(ContentService.MimeType.JSON);
After that, process it inside your AJAX request...
Mogsad is right that you might be better of with Google Drive API to interact with your Spreadsheet!
...But depending on your exact need you might have some possible interaction between external service and google apps scrip using Content service Google Dev link.
Content Service can send back several information upon GET request (ATOM, CSV, ICAL, JAVASCRIPT, JSON, RSS, TEXT, VCARD, XML). By playing around with url parameters you can get information out and in a spreadsheet, send an email, trigger some action etc!.
But that is far from a real external library and direct interaction with server side functions!
I read in an article that odata can be used for different combination of clients/servers.
Say I would like to develop a web application where i store data(say information about all mobile products on market) using mongoDB and use python as backend with Bottle framework to access data through browser as GET.
Then i decide to extend web app as android app. i can extend it to android without any code change on server side.
My doubt is does using odata here helps in any way? Say if i want to extend it to other clients?
Yes, you are right, you don't need to change even a single line of code on the server side if you change a client app. OData defines many conventions for the communications between the client and the server. such as:
What the URL looks like if you want to query some data
http://services.odata.org/V4/OData/OData.svc/Products?$filter=ID gt 2&$select=ID,Name,Rating,Price&$orderby=Price desc
Which http method should be used to Create/Retrieve/Update/Delete an entity
Generally speaking, Post for Create, Get for Retrieve, Patch/Put for Update, Delete for Delete.
What the payload looks like.
How to invoke a function/action
As long as the requests conform to these conventions, the server side always returns the predictable responsese regardless whether the clients is a browser or a mobile device.
I also find the examples for the odata:
https://aspnet.codeplex.com/SourceControl/latest#Samples/WebApi/OData/v4/ .
Hope this helps you.
Parse is a Backend-as-Service platform that offers RESTful API for data storage and query. It seems very appealing for front-end or mobile developer and allows them to focus on business logic without worry about those troublesome back-end technologies.
The RESTful endpoint looks something like this:
https://api.parse.com/1/classes/GameScore
If I want to use this on my site, say awesomehtmlsite.com, wouldn't the request be blocked by cross domain restrictions? Same would hold true for the Javascript API.
Can someone explain to me how I can utilize the RESTful API or the Javascript API?
Responses to calls to the Parse javascript API include the following header:
Access-Control-Allow-Origin:*
This allows it to be used cross-domain. You should just be able to follow the JavaScript guide/API that Parse provides, without worrying about cross-domain issues.