Wordpress to other source rest calls with username / password - javascript

I have been asked to create some custom content on a wordpress site, basically just some web app stuff (html/css/js), but leveraging data from another source via restcalls. There is a service account un/pwd required, and I am wondering what is best practice/approach in terms of the cross site calls with this un? The wire is encrypted but I certainly don't want to store the creds on the client (wordpress admin stuff). I am assuming there is a mechanism to store such on the 'back-end', filesystem, but I am not even sure such access exists? How you get to this....I have gone through the wordpress admin board and haven't found anything that provides access to the filesystem/php files, etc. Perhaps I am not looking in the right place or after the wrong bits?
I have googled but am such a noob with wordpress I am not even sure I have the right approach in mind; any help/advice is greatly appreciated.
EDIT: so if curl is the standard approach for this type of thing, where/how am I able to access the filesystem/php? Is there a specific place this type if thing lives or a convention of where it is placed? Just help with some 101 direction please.

First things first, you will need to develop a plugin for WordPress to properly hook into everything and play nice with everyone else. There are many tutorials for getting started. Here's one that integrates with an API
If you have to store things to make your plugin integrate with this third party, you should use the Options API that WP provides to you, with the information set from a settings page. Please don't hardcode that into a file somewhere in the code. (I'll also mention if you need something more powerful than the plugin options, you can add custom tables)
Now we have code running on WordPress with the information it needs, now it needs to do something. To pull the information from this third party, we can use PHP cURL.
Last, depending on how we want this information to end up being consumed by the user. We can do something simply such as just fetching/injecting the data during a regular WP page load on our custom page. Or we could be fancier and set up a WP REST API endpoint that re-serves the information we got from the 3rd party. Shortcodes? Widgets? Custom Templates? Filter Hooks? There is a lot of ways to present our final interface to the user.


Can I use Google sheets as a small database for my apps?

I have a personal finances spreadsheet on my Google Drive.
For some practice and ease of use, I wanted to make a desktop and mobile app to manipulate it:
add an expense
list my expenses
filter the expenses
Is there a way to do this?
Since it is something so small, I'm trying to avoid anything that needs a dedicated server that I would need to set up or needing to rent any services because it's just a ease of use project and not a "must-have".
I've been searching a lot but most of the time I get confused with responses from 2-3 years ago.
So I found a way, using this video:
Basically using Google App Script you can make some post and get requests, which for me is a step in the right direction. Just needed to think outside of the box a little and I got a simple way to send post requests to create or update, and get requests to read, for now I also use get to delete but this just seems wrong, might change later.
Also I've searched and started doing a PWA (progressive web app) to be the interface, just so I can make it with a single code base and work with almost any device, using pure js, html and css, the only "non-pure" thing is Onsen Ui for the GUI.
You can use an NPMJS package such as google-spreadsheet to work with the Google APIs and manipulate your spreadsheet; the issue for you with trying to build the app without your own server is the need to securely store your Google Account credentials (you don't want this being publicly accessible).
If you could compromise and use a read-only solution, a package such as tabletop might suffice as you don't need to bother with any back-end work; I doubt this would be ideal for you though. You will need to host the application regardless if you want to be able to access it through the world wide web.
Alternatively, you could run the application locally if you would be happy with only being able to use the app that way. Hope it helps and sorry for the rambling!

Programmatically Create New HTML Page based on Template and User Input

I am working on a project/idea, my use case is for my significant other's blog/craft/recipe website. I want to create a personalized service that uses Firebase to host, and I want people (like my significant other) who have no coding/html/firebase experience to be able to upload new pages when they please (this will be done on the backend with firebase's hosting API, and on the front end with a customized UI and form).
I have most of this worked out, but I have a remaining question that I have been unable to find a direct answer on:
What is the best way to create a new html file, based on a template, just with new information gathered from the above mentioned form?
For instance: Given a recipe website, where each recipe has its own page and route. The form above would, theoretically gather all information needed to name this page, and gather all information needed to add to this page to make it complete.
I would imagine that I would need to have a template html page and copy then add information to it, upload and serve via Firebase API, etc.
Is there a specific templating engine that assists with this already? I am having a hard time trying to extend the existing templating engines that I know about into this use case.
TL;DR - I know this is a long-winded question, but in the end, I am looking for the best, most efficient way to programmatically create a new HTML file that will be based off of a given template, add custom information, and upload/serve via the firebase API - using Node/Google Cloud Functions, of course.
I do NOT need any code written for me, just looking to be pointed in the right direction, as I have been researching this for about a month prior to asking here, and this has been my last resort - I am just frustrated because I know there is a way to do this, but have been unable to find what I need.

Creating a Notification Icon with Dojo 1.9

I want to create a notification icon with Dojo, but I'm not sure where to start.
The icon has to be similar to those found on Facebook and Whatsapp, showing how many new messages/notifications you have.
I've been looking in the Dojo reference, but couldn't find a good widget to use. Maybe I'm missing something obvious, but I might as well ask it here.
Googling hasn't been of much use unfortunately.
As far as I know there's no widget that automatically does the stuff for you. This problem is far too specific to provide a general widget for it. You also have to think about several things before you can start.
Do you want to use WebSockets? The web is generally made for pulling content, if you want to push your notifications from your server to your client, then you will need to look at WebSockets. A good tutorial to use them can be found on Sitepen.
If you don't want to use websockets (you're not able to create a websocket server or you have some other reasons) then you will probably have to use a simple "REST service" and obtain the amount of notifications from it. This means you're script won't be "live", so you will need to pull the content from the webservice every X seconds/minutes. This means you need a normal AJAX request which can be done with the dojo/request/script module.
If you need to time this AJAX request, you can use the dojox/timing module.
This is only the "logic" part, the user interface (icon + # notifications) can be made by yourself with plain HTML and CSS.
What about dojox/mobile/Badge:
From comment:
"Maybe you can find something in the DojoX library" -
off course you will find much.
I would recommend
see http://dojotoolkit.org/features/1.6/dojo-websocket

Create a plugin to add my website functionalities on another website

I have a website A with a database and a search engine of some object, user can create account on my website then add comment for these objects.
I need to create an api with something like a plugin, it will result on having the seach engine on another website B.
I have planned to do like fb or twitter plugins : the dev who want to use my api will just need to add a line of js, and a line of html on website B, then it will load the plugin. But I'm wondering how to organize it.
Here it what I've guessed : I create a page on my website A, put the search engin on it. I create a js that will load this page whithin an iframe, on the dev's page (website B), under the div he added to have my plugin. Then I implement OAuth 2 (with a provider and so, so people can do post requests to alter my db), and people who is one the website B will have the ability to post comment on the objects of the search engine on website B.
Actually it seems to be the same as fb comment plugin process, but it seem too complicated to do all that stuff. Is it the right way? Can anyone detail the problems that I should face during implementation?
You need to develop a decent API which can return search result in JSON (and XML if you want to please everyone). That already would offer other developer the ability to use your site functionalities, that's mostly back end work tho. So they can develop their own widget.
To develop your own widget as a search widget you don't need that much, you just need either a set target (maybe a required element) or/and an initialization method (more flexibility for the dev) to which you pass a target.
Bind the search button, grab terms search, call your API and when you get your result display them or/and execute a custom callback pass the result as an argument, flexibility)
If you do your javascript well you can create a little API there too which facilitate the usage of your API via javascript. And then even easily port it to a jQuery plugin or something similar.
When serving JSON always remember to set your headers for your API to allow for crossdomain or go for jsonp instead.
Your question implies an architectural direction, but the requirements are too broad for such a choice. I would narrow down your requirements first. OAuth 2.0 could potentially help satisfy your needs, but ask yourself at least the following:
What user data needs to be protected?
What 3rd-party data access is needed? What functionality?
If you go with OAuth 2.0, are you prepared to follow a spec which is still changing? Are you willing to be the authentication provider?
What server-side languages/platforms are acceptable?
What other security considerations are important to you? (Such as social sharing, level of 3rd-party app trust...)
How much are you willing to rely on 3rd-party tools? Or write your own?
I agree that modeling your design off FB or Twitter or Google is not a bad idea, as they have done this sort of thing.
You might have a look at the new book Getting Started with OAuth 2.0.
Here are two simple ways of making custom search available to users.
The simplest option is to do what Google does - the search on your site would follow a simple, well defined API - so that
returns a list of results in HTML.
Then you'd tell your users to include a snippet of HTML:
<form action="http://www.mysite.com/search" method="get">
<input name="q" type="text" value="Search">
That would do, though at this juncture you may want to improve things with better search options, a javascript wrapper for the search form, a JSON or XML format for the data returned, security, a better worked out API that takes all these into account.
Another way is to use javascript and provide the data with a callback facility, so the URL:
will return a javascript file containing JSON data and a call to "someHandle" when it is loaded. The developer using your API have to write their own way of making the request and the handler. Bear in mind that because of XSS, the queries would probably come from your partners' servers. The simplest is probably to make your own search offer simple and well-documented so others can exploit it.
OAuth 2 could be helpful just if you would allow the website B to make POST request to the website A in background.
Instead if you want allow the users that visit the website B to post a comment then the iframe with a form that point to the website A is enough.
The easier bet, yet not necessarily the wisest, is to create some JS which calls on your website using JSONP.
iFrames are not W3C standard, try avoiding them if possible. Code a Javascript with some events that will do some JSONP calls into your own server and return the results in Javascript accordingly, so it would be able to interact with the page.

Widgets in Rails

I have a business that I outsourced all of the tech for. Its essentially a widget on an external site, with a management panel on our domain selecting whats shown on the widget. Lets say its a manual "relevant news" widget.
I think I can code the rails part, but how would I do the widgets part? Can someone point me in the right direction? The widget would need to be JavaScript and copy/pastable.
(More context, having to use the old system thats in PHP, and it breaks my heart having to ask the outsourcers to help me with every little thing, so I'm looking to rebuild it)
EDIT: how much of this is still valid? Its posted from 07 - http://www.igvita.com/2007/06/05/creating-javascript-widgets-in-rails/
you could create a json api using https://github.com/fabrik42/acts_as_api (imho, this is the easiest way to create an api)
and then create your widget in pure javascript or jquery.
If you need to authenticate, you'll need to send an api key with your requests, and also on your server side check the request.domain with the api key you have given that domains webmaster.