How to implement a weather API in cordova - javascript

I have to create an android weather app with cordova using data from openweathermap.
The thing is I install cordova and I get to the "hello world", but I have no idea how to get data from openweather.
I create the project in cordova, then I can edit that hello world as it was a web page using html, and css.
But how do I make it to search for places and get data from openweathermap?
I have registered in openweathermap, got my own key, but don't know how to use it.
Don't even know what sohld I study to learn how to do it.
I think I should make a request to the openweather API, then openweather will reply with the weather data in json format, then I should get that data to my website/cordova app.
But how?
Thank you
Been looking for tutorials, but none I found explain what I want.
They use Ionic or react, stuff I don't know how to use.
I would like to keep it simple, just look for the city, and get the weather displayed, to know how it is done.

TL;DR - You are going to be making GET requests to the server
Ok so, what you're looking for is the ability to fetch the weather data from the API server and display it on your component template somehow. What you need is the HTTPClientModule that comes with angular (and therefore with Ionic if you are using Angular as your frontend framework, v4 works with Vue and React as well).
I know this is rough for a lot of new developers so I'll make it as simple as possible for you, import the HTTPClientModule inside your app module so you can use it globally. Then, the best practice is to place all API calls(which is how you'll fetch the weather data with your key) inside a service. Create a GET request to the URI endpoint associated with the data you require and voila, you have your data.
From there, go to your page's typescript file and import the service and declare it in the class constructor. From there, you can make a function that subscribes (since Angular ships with RxJS) to the service function that fetches your data and saves it to a variable.
If you want to pass that onto your component view, well I'm sure you have interpolation figured out. Don't forget to use the async pipe since you are fetching asynchronous data.

Related

Live database fetch using Laravel and React

I'm new to React and still learning Laravel, and I was wondering how can I live fetch data from the database using the Laravel Controllers. I want to use React too but I really don't see his utility there.
From my searches, I found an Ajax method, but I really want to use just Laravel and React to do so. Is it possible?
Like displaying the new users directly from the database without refreshing the whole page? I'm using Mysql to manage my database.
First of all, You need to set up laravel sanctum to get the authenticated data.
But if you don't want the authenticated data. You can just use a fetching library like axios to fetch data from the laravel. You need to add the cors (which is localhost:3000) in app.cors.php file of laravel root directory.
But if you are using reacjs with laravel like with intertia.js (which I prefere btw), You don't need the cors, laravel will work out of the box....

Dynamic Data in Shopify Blog Page

I want to write an API, i.e. hosted at www.api.mywebsite.com (not affiliated with Shopify) and then have a shopify blog post that queries that API and displays that data using javascript.
I know how to do the API potion, but can I and if so how do I do the second part where I use JS to query and display data?
Simple! Add an App Proxy to your App. With that, you setup an end point to call in your App. On the blog page you can send an Ajax GET with an ID to your App, which can then get dynamic content ready for you to use. You can either format the response as Liquid or as JSON as two examples. Send back Liquid, and Shopify renders it for you. Send back JSON and you can stamp out your data in a template.
And best of all it is a secure callback to your App that you know came from Shopify, so you have no hassles or security problems. Look in your App for Extensions, and enable Online Store, where you can tinker with the Proxy.

How to sync database and angular component?

I am trying to fetch data continuously from mongo database.
It needs refresh the page in order to get latest data.
My question, Is there any way to put angular service and component which will check & fetch data in real time?
Some of the way which i found in internet such as :
Call the service in setInterval after few seconds.
or, Use of third party fireloop.
But really i don't want these strategy.
Could someone guide me how & where to proceed to achieve real time functionality ?
I am using anuglar v4 and mongodb v3.
Thanks.

Calling a django api from react for sign in page

I have built a react application which has a login page. I am done with the frontend of login page using react. Now the other person from my team has build a backend api on django. I want to call that api from my react code now. How should I do it? Do I need to learn something specific? I have searched in internet and all of the sources we to make serve react and django from same project. I have a React project with me and a separate api developed by someone else. Please guide me through this. I am pretty new to this.
No, you dont have to learn something new. You need to just make an ajax call to the API endpoint from within your react application to fetch or send the data needed and handle the response.
Also keep in mind to setup the ajax to send the CSRF token as shown in the docs.

Use list.js in Meteor with data published from the server to the client

I'm currently working on a meteor-Application where I want to use the list.js-JavaScript Library with Meteor.
The use-Case is that I have some data in my MongoDB on the server which I publish to the client. This data should now be rendered in a list and list.js should make it searchable.
The data is published to the client (after a short delay I get the data in the view). But it seems that the list.js-Library is run before the data hits the client. The console says that the array which is searchable only consists of "undefined".
What I've tried now is to use Template.rendered where I put my code of list.js in. But Template.rendered gets fired when the template is rendered, not when the data is receiving the client.
It seems that the data arrives too late to be grabbed by list.js.
Is there something I can do so that list.js will start when the data successfully arrived at the client? Is there something like Data.received?
Thanks in advance!
Unfortunately, that is not the meteor-way to do it. Once you get it working you will see that it lacks performance and proper reactivity.
You should instead look into using meteor's excellent reactivity and do it using template helpers, that way it will be reactive and you can scale it without performance issues.
I found a good answer to your question in the Unofficial Meteor FAQ
That describes how to know when your subscription is ready (reactive data).

Categories

Resources