Jump to content

How to make useful native apps?


Zola

Recommended Posts

Hey all

 

I have been building sites for a long time and I am pretty confident in modern frameworks like Bootstrap etc. I have played about with JQuery Mobile and UI. I know how to make mobile sites from a front end side. I understand that I can upload my site to PhoneGap and turn it into a native app.

 

However, I would love to know how to make useful apps that dont just display static text. E.g. using things like Google Places API.

 

I know how to make mobile sites easily enough that display info. I just don't really understand how to link that up with dynamic data from APIs etc.  How to feed that content back to the user.

For a vasic example, say I wanted to have a simple app that had a search box. You enter 'PIZZA' into it and it comes back with a result of all local pizza spots. How would I do that?

 

If someone could point me in the right direction for where I could experiment with this I would be really grateful .

 

Link to comment
Share on other sites

First I will take some time and try to explain api's as best I can by my experience and knowledge about them.

Everything I mention can be further researched.

 

REST : Representational state transfer

(my simple definition)

Uses url or uri over http web

The data set to be retrieved could use the url,uri or any query parameter and or their values to access a particular data set.

Can use GET, PUT, POST, or DELETE http methods

Do local server actions with them or send out a response to a client or server.

You can literally return any type of response you want, some popular ones used in api's would be json,xml and html

The format of the response can also be determined by a url parameter in the query, such as format=json,format=xml,format=html

 

XML-RPC :

(very old)

remote procedure call using xml to encode and http transport

 

SOAP :

(very basic summary)

soap evolved from xml-rpc

xml based

Has an envelope for defining the message structure and how to process it.

Encoding rules to determine each instance of application data types.

A method to handle procedure calls and responses.

Uses HTTP, SMTP, TCP, UDP, and JMS transport protocols.

 

 

Create full documentation of your api, your clients need to know how to access your api, what the parameters mean and also any options.

If you need to have access keys take a look at oauth

 

A lot of sites that supply an api have information how to obtain and show data.

such as:

https://developers.google.com/youtube/code

https://www.flickr.com/services/api/

 

Some will have example scripts in a few coding languages.

They could even have different resposes such as json,xml,html.

Select what you need your particular project that suits your needs.

 

Besides an api, you could also make scripts that can grab from their meta tags, opengraph or oembed per website url.

 

It's also possible to grab from the rss feed data, but over my years have found there is too much malformed xml in them.

There is also an issue must detect if is rss 1 or 2, blah, was a nice idea, but not everyone did it nor correct or similar.

(coming from a guy that made his own feed aggregator and feedreaders)

But if you were interested in feed related take a look at simplepie or magpie

 

Connect to a website:

Is various ways to connect to websites.

This all varies on the type of data and complexity of what are trying to send or retrieve.

 

curl would be my preference over all of them, you have lots more control over everything.

A simple way to connect would be using file_get_contents()

For xml can use simplexml_load_file() , I prefer to use curl for connection and responses, then simplexml_load_string() to create an object

 

Once you get the raw data, you need to access the items you want.

This would be called parsing.

 

json

simplexml

dom

simplehtmldom

preg_match() and preg_match_all()

 

 

Once you have the data you can either output data to a client or save to your database.

Now follow normal website and search methods.

 

 

As for your question:

 

For a basic example, say I wanted to have a simple app that had a search box. You enter 'PIZZA' into it and it comes back with a result of all local pizza spots. How would I do that?

 

 

If the api supports query parameters, you would pass your search terms into there...return or display that particular response.

 

 

If you want, you can play with my video search api's.

Currently they are public requiring no key.

In the future they will be domain restricted and public key required.

 

I will explain it all, provide codes how to connect and retrieve the data.

 

Dynavid Video Search using a REST api

 

List of parameters and their options:

 

parameter: [ s ]

value: [ word | word +word | +word +word | +word +word] many multiple words accepted

default: [ returns latest videos ]

description: [ search term keywords - uses advanced search in fulltext boolean mode, supports multiple words using spaces ability to include/exclude by using +/- ]

 

parameter: [ size ]

value: [ 100 to 1280 ]

default: [ 400 ]

description: [ video embed size - optional sizing for video in only html format mode ]

 

parameter: [ startrow ]

value: [ 0 to undetermined ]

default: [ 0 ]

description: [ determines what row to start from in database ]

 

parameter: [ max ]

value: [ 1 to 50 ]

default: [ 10 ]

description: [ maximum number of results shown in data set ]

 

parameter: [ display ]

value: [ id | title ]

default: [ id ]

description: [ group the order of results different ways ]

 

parameter: [ order ]

value: [ asc | desc ]

default: [ desc ]

description: [ direction of the results ascending or descending order ]

 

parameter: [ format ]

value: [ json | xml | html ]

default: [ json ]

description: [ output response format ]

 

3 links same data showing different formats

 

json response: To me this is best method and always have clean data

http://dynainternet.com/dynavid/search/index.php?s=documentary&startrow=0&max=5&display=id&order=desc&format=json

 

xml response: xml tree with tags and encoded data

http://dynainternet.com/dynavid/search/index.php?s=documentary&startrow=0&max=5&display=id&order=desc&format=xml

 

html response: for direct display or iframing

http://dynainternet.com/dynavid/search/index.php?s=documentary&startrow=0&max=5&display=id&order=desc&format=html

 

We will use the html format and show how can manipulate the parameters

 

search horror movie

http://dynainternet.com/dynavid/search/index.php?s=horror+movie&size=400&startrow=0&max=5&display=id&order=desc&format=html

 

change the video size

http://dynainternet.com/dynavid/search/index.php?s=+horror++movie&size=800&startrow=0&max=5&display=id&order=desc&format=html

 

start at database row 1000

http://dynainternet.com/dynavid/search/index.php?s=+horror++movie&size=400&startrow=1000&max=5&display=id&order=desc&format=html

 

show 20 results data set

http://dynainternet.com/dynavid/search/index.php?s=+horror++movie&size=400&startrow=0&max=20&display=id&order=desc&format=html

 

group by title

http://dynainternet.com/dynavid/search/index.php?s=+horror++movie&size=400&startrow=0&max=5&display=title&order=desc&format=html

 

show ascending order grouped by title

http://dynainternet.com/dynavid/search/index.php?s=+horror++movie&size=400&startrow=0&max=5&display=title&order=asc&format=html

 

 

For xml parsing.....due to the complexity and websites using different namespaces,parent,children objects and so on, we'll skip that in this post.

 

connect simplexml, retrieve xml data, convert to json and show array

<?php
$url  = "http://dynainternet.com/dynavid/search/index.php?s=horror+movie&size=400&startrow=0&max=5&display=id&order=desc&format=xml";

$data = simplexml_load_file($url);
if ($data) {
   
    $array = array();
   
    $array = json_decode(json_encode($data), TRUE);
   
    var_dump($array);
   
} else {
   
    echo "No data";
   
}
?>

file_get_contents, retrieve json data and show array

curl results will be similar

<?php

$url = "http://dynainternet.com/dynavid/search/index.php?s=horror+movie&size=400&startrow=0&max=5&display=id&order=desc&format=json";

$data = file_get_contents($url);

if ($data) {
    $array = array();
    
    $array = json_decode(json_encode($data),true);
    
    var_dump($array);
    
} else {
    
    echo "No data";
    
}

?> 

As for my particular api, lets say if wanted to just grab all the video urls and display them as a hyperlink

<?php
$url  = "http://dynainternet.com/dynavid/search/index.php?s=horror+movie&size=400&startrow=0&max=5&display=id&order=desc&format=xml";

$data = simplexml_load_file($url);
if ($data) {
   
    $array = array();
   
    $array = json_decode(json_encode($data), TRUE);
   
    //var_dump($array['url']);
	
	foreach($array['url'] as $video_url){
	    $video_url = urldecode($video_url);
	    echo "<a href ='".$video_url."'>".$video_url."</a><br />";
	}
   
} else {
   
    echo "No data";
   
}
?>

connect using simplexml and directly access the objects

<?php
$url  = "http://dynainternet.com/dynavid/search/index.php?s=horror+movie&size=400&startrow=0&max=5&display=id&order=desc&format=xml";

$data = simplexml_load_file($url);

if ($data) {
   
	//var_dump($data);
	$href_array = array();
	
    foreach($data->url as $href){
        $href_array[] = urldecode($href);
    }
	
	echo '<pre>';
	print_r($href_array);
	echo '</pre>';
   
} else {
   
    echo "No data";
   
}
?>

For more specific questions related to a certain website and their api feel free to ask questions.

 

If your interest is in making your own api, can help with that as well.

Edited by QuickOldCar
Link to comment
Share on other sites

This thread is more than a year old. Please don't revive it unless you have something important to add.

Join the conversation

You can post now and register later. If you have an account, sign in now to post with your account.

Guest
Reply to this topic...

×   Pasted as rich text.   Restore formatting

  Only 75 emoji are allowed.

×   Your link has been automatically embedded.   Display as a link instead

×   Your previous content has been restored.   Clear editor

×   You cannot paste images directly. Upload or insert images from URL.

×
×
  • Create New...

Important Information

We have placed cookies on your device to help make this website better. You can adjust your cookie settings, otherwise we'll assume you're okay to continue.