Monday, August 19, 2013

Creating an SQLite Driven app for Windows 8 with PhoneGap/ Cordova

A few of us out there might have seen how easy getting an app done is with Cordova for Windows 8.

It's setup is probably the easiest of the lot.

However, while this is true, it lacks the documentation level the other platforms have.

Here is a simple way to have SQLite available in your PhoneGap Windows 8 Project.

1. Open your VS(Visual Studio).
2. Tools > Extensions and Updates.
3. Online >Search for SQLite in the search field and Download SQLite for Windows Runtime.
   Visual Studio Extensions dialog
4. Create a Cordova Windows 8 project (Use Cordova 2.9 as there are isues currently with 3.0).
5. Right click project solution and select add reference.
6. Check Add C++ Runtime and SQLite Runtime
Add Reference dialog
7. Download a WinRT Wrapper Library(Yes PhoneGap still works so don't worry)
8. Extract the content of the file downloaded above.
9. Add the  SQLite3Component\SQLite3Component.vcxproj  from project the project your project (File > Add Existing Project > Select above file from the folder you extracted in 8 above)
8. Right Click project solution once again and and select reference
10. Check Add SQLite3Component\SQLite3Component.vcxproj 
11. Right Click WWW/JS folder and add existing file(Select SQLite3JS\js\SQLite3.js from directory in 8).
12. Drag the reference to the JS into your project and get building.

You can test if configuration works with the following code:

var dbPath = Windows.Storage.ApplicationData.current.localFolder.path + '\\db.sqlite';
SQLite3JS.openAsync(dbPath)
.then(function (db) {
  return db.runAsync('CREATE TABLE Item (name TEXT, price REAL, id INT PRIMARY KEY)')
  .then(function () {
    return db.runAsync('INSERT INTO Item (name, price, id) VALUES (?, ?, ?)', ['Mango', 4.6, 123]);
  })
  .then(function () {
    return db.eachAsync('SELECT * FROM Item', function (row) {
      alert('Get a ' + row.name + ' for $' + row.price);
    });
  })
  .then(function () {
    db.close();
  });
});

*I  used alert in place of the original console.log so you can confirm it works within the project.

You can add plugins you create with no problems.

Special Thanks to Tim Huer for instructions on setting up SQLite for Windows 8 and Marcus Ilgner for creating the the SQLite-WinRT Wrapper for Windows 8.

Ismael O. Jimoh

Saturday, August 10, 2013

Cordova/ PhoneGap 3.0 corrections

Hi all,

In my last post, I mentioned that there might have been an error or 2 with the Download instructions in the Cordova Download Page.

After filing a bug report with the developer team, I got to learn that they were in the process of correcting the Command-Line Interface instructions in the documentation and the documentations as a whole.

This has been corrected and I will like to apologize for any confusion I may have caused.

One new feature it offers customers with a build account is submitting your app to build for devices you do not have set up for your current OS or when you want to build an iOS app on a Windows operating system.

The command:  phonegap build ios when entered to your command line would validate your build account first and if you have one would submit a copy of that app for said version to the Build server.

In summary, PhoneGap 3.0, seems to be the beginning of a merger of sorts of Cordova and the PhoneGap Build products.

This being said however, you would have to ensure that plugins and methods/ function calls used in your app would be able to work on all platforms.

Thanks and sorry again for any confusion I might have caused.

Ismael A.O. E. Jimoh

Sunday, July 28, 2013

Document Correction Cordova/ PhoneGap 3.0

Hi All,

The developers at PhoneGap/ Cordova are working now to correct all errors in the correct documentation.

Do submit any errors you find to our issue tracker.

They'll look at it as soon as possible.

Another important thing to note is we strongly advise you ensure plugins you use have been updated recently(less than 4 months old) and conform to the new Plugin standards.

You could always reach the contributors to ask them to update.

Lastly, I will advise you maintain projects that are deep in development at Phonegap/ Cordova 2.9, this ensures most plugins still work, as the changes mentioned above are still working at the said version.

Use the link above to report any issues.

Thanks.

Ismael A. O. E. Jimoh

Wednesday, July 24, 2013

Unofficial Changes to noted on Cordova/ PhoneGap 3.0

Hi All,

Cordova 3.0 was officially released last Friday.

Here are a list of changes and things we'll like you to know:

Installation

1. You would need to install Node.js to install the current version of Cordova(You can't download the file from our download page.)

sudo npm install -g cordova

2. There is currently a mistake in the sample on the download page, please follow the instructions in the PhoneGap Docs instead (The sample is meant for PhoneGap Build instead of Cordova, use the above code instead for installation, and follow instructions in the documentation for creating, building and running your project).

3. You can now create projects using the new command-line features adding platforms you would like to support as you deem fit.

4. You can now compile with command-line just modify/ add you HTML and JavaScript files to the base WWW folder, it will update the codes for the respective supported OS per platform that user added.

5. Various functions that we warned would be depreciated have officially been depreciated.

6. The plugin tag has now been replaced with a feature tag in config.xml. (Note this has not been corrected in the sample codes.

<feature name="NetworkStatus">
        <param name="android-package" value="org.apache.cordova.core.NetworkManager" />
</feature>

instead of

<plugin name="<service_name>" value="<full_name_including_namespace>"/>


7. You would have to add in features you need in your project via command line. This ensures your project size remains small since all unnecessary features are not added. 

8. Upgrading the current Cordova would in future be done via Command Line.

9. To use Plugins, ensure it conforms to the new plugin standards.

Here's what the changes above give you, 

1. A more streamlined app who's size and resources can be better managed.

2. Ease of ensuring your apps have the same code and set-up is instantaneous instead of going to various developer kits to configure and build each project.

3. You can build for all project from one source and test on devices with simple lines of codes.

4. Ease of maintaining your project since all changes made to the base folders content are implemented to each platform folder once user builds.

5. You can always still configure or make changes to each platforms code by editing in your preferred development environment(e.g. Eclipse for Android)

These are the few changes would update as usual.

Thanks for the continuous support.

Friday, July 19, 2013

PhoneGap/ Cordova 3.0 Launched!!!

The much awaited PhoneGap 3.0 is official. 

Head over to: http://phonegap.com/install/ to download.

You learn more about PhoneGap you can get started from: http://docs.phonegap.com/en/3.0.0/index.html

Stay tuned for changes that come with this new release.

One change you should notice right away is the change in installing/ getting started with PhoneGap and also how to create a new project.

I will be updating this blog further as I learn more about the new changes.

Thanks everyone, and special thanks to the developers at the PhoneGap office(Adobe) as well as the contributors.

Changes:

1. CommandLine UI using Node.js introduced and more closely integrated(I know it's been there for some time but it's integration is more important in this release)
2. Getting started Guide would require you looking at Platform Guides and Command-Line interface
3. /*Would be adding more as I find them*/

Thanks for following.

Ismael A. E. Olusola Jimoh

Friday, July 12, 2013

Awaiting PhoneGap 3.0?

Sorry Guys my bad.

Mixed the dates up should be released this Friday rather than last.
---------------------------------------------------------------------------------------------
---------------------------------------------------------------------------------------------

PhoneGap 3.0 is expected sometime today.

Hope you are all anticipating it as well. 

Initial release (3.0.0-rc) should be out today for those in Asia/ Africa, you can check it out most likely much later today or sometime tomorrow.

Thanks all, hope you all like it.

Ismael

Tuesday, July 9, 2013

PhoneGap 3.0 expected to be released this Friday(12 July 2013)

Sorry Guys my bad for the wrong information.

Mixed the dates up. 


It should be released this Friday rather than last.
---------------------------------------------------------------------------------------------
---------------------------------------------------------------------------------------------

Hi All,

PhoneGap/ Cordova 3.0 is expected to be released this Friday.

There would be some major changes this time so I would advise you read through the changes before upgrading your projects.

Have fun and thanks for the continuous support.

Ismael A. O. E.  Jimoh

Thursday, June 27, 2013

PhoneGap 2.9 Announced

Hi All,

PhoneGap 2.9 was officially released 2 days ago. (Sorry for the late announcement)

And in line with their target of streamlining it to a decent size before release 3.0, they have done away with most of the methods that had been depreciated or warned they will be depreciating.

Expect fewer support for some of the older devices also, as they try to focus on optimizing the product to cater to the most popular/ used OS.

Main changes in this release:

  • New InAppBrowser option: (starthidden)
  • Device.name has been removed
  • Fixes so Cordova Project can be deployed on OSX 10.9
  • Bug Fixes.

Head over to Cordova Download to get a taste of this new release.

For those who are not familiar with Cordova/ PhoneGap, you can find the documentation here which would help get you started.

Have fun guys.

Ismael Olusola A. E. Jimoh

Monday, June 24, 2013

Alternative Libraries to jQuery/ jQuery Mobile

jQuery has been a really useful web development platform for most developers out there.

It's packed full with features that makes customizing your web page/ app to a very unique feel a blessing to us developers.

To make matters even better, it's adoption by most people has been phenomenal, now you have sample of how to do this/ that within your finger tips, tutorials on how-to's can be found with a breeze and a large majority of them have been speced for jQuery.

In summary, it not only improves your JavaScript Library, it adds on to it's CSS.

Here is the problem though, jQuery was never optimized for mobile web app development and so moving your wonderfully designed Website to a mobile platform or even the knowledge of designing such intuitive pages to a mobile platform would turn out a very slow, buggy and at most times very unresponsive website.

The Team at jQuery trying to fix this can't be blamed for not trying as they have been working on a mobile version since the era of mobile app development began to become a norm. They pushed out a very slimmed down and More responsive jQuery Mobile(JQM) but at the cost of certain features  and well they did provide some features that are directly related to mobile app in place of some of these to compensate.

Having worked with developing PhoneGap for about a year I noticed something interesting.

JQM is a beast, it swallows as much space in direct relation to it's performance hence if you are not into using more than(> 5) features it offers (note not cosmetic features but rather very important features), I would advise you stay away from it unless you don't mind tweaking JQM to suit your needs.

Here are alternative libraries I believe you might find very useful

1. Zepto.js: is a slimmed down JQM in that it offers so many features thatcan be found in JQM but does so at a fraction of the size of the JQM library at only 8KB. It can be downloaded from Zepto.

2. Snack.js: is a small library but shouldn't be under-estimated by it's size as it's pretty handy for developing complex cross-browser app. This size is achieved by going a different path to JQM.
It can be downloaded from Snack.js

3. $Dom: is a useful libarray using dom objects for animating, traversing pages. The perfect use case for this library is when building responsive websites, which can be viewed on smartphones, tablets and desktops. It can be downloaded from $DOM.js

Hope these help :D.