Creating CFMobile Application using AngularJS

In my previous blog articles I had explained how to create CFMobile applications using JQuery, Bootstrap/JQueryMobile. Here are links to sample (CFMobileExpenseTracker) applications using the two UI frameworks –

I wanted to create the same application using AngularJS. It had been on my ‘to learn’ list for sometime now. So I spent the last weekend learning it. If you already know concepts of MVC and Dependency Injection, then understanding AngularJS is not difficult. The well documented tutorials also helped.

I decided to re-write CFMobileExpenseTracker using AngularJS and JQueryMobile. Since AngularJS provides very easy way to manipulate DOM, you really don’t need JQuery. But I had to include it in the application anyway because JQueryMobile depends on it. I also used JQuery for basic event handling.

Earlier in my application I had used client side custom tag (expenseList.cfm) to display expense items by calling JQuery APIs to modify DOM and update UI. I could get rid of this custom tag entirely after using AngularJS, because of templating features  and automatic synchronisation between model and view provided by Angular JS.

Here are the screen shots of the application –
2014_04_24_image12014_04_24_image2

Though I said that I re-wrote the application, it was not a complete re-write. I could reuse CFCs and made small modifications to index_include.cfm. I added a new JS file (angular_app.js) to crate AngularJS application and controllers – Continue reading “Creating CFMobile Application using AngularJS”

CFMobile Example – Accessing remote data from mobile application

So far I have posted CFMobile examples that were mostly standalone applications (except a photo application that uploaded image to server). However many mobile applications may need to interact with server, for example to show data from a remote database, to modify data or for many other purposes.

CFMobile features in ColdFusion Splendor make accessing remote CF server very easy. I will demonstrate this using a simple example – I will build a mobile app that displays employee records fetched from a remote CF server. The client side (cfclient) code calls a CFC on the server side which fetches data and returns result to the calling page. You will see that creating and accessing a server side CFC is as easy as it is in a completely server side CFML code – you don’t need to worry about writing code to make AJAX calls. cfclient does that for you transparently. I should mention here that this feature to call server CFCs from cfclient is not limited to mobile application, you can even use it for any web application.

Here is a screenshot of the application –

2014_03_25_image5

Continue reading “CFMobile Example – Accessing remote data from mobile application”

CFMobile Example – Record and playback audio using ColdFusion Splendor

In this post I am going to show how easy it is to record audio and play it back in a mobile application using ColdFusion Splendor. If you haven’t already, you can download it from Adobe Labs.

I have tried to keep the application simple. There are two buttons, Record and Play. When you click Record button, the recording starts and the Stop button is displayed. Speak into the phone microphone to record your voice. When done, click Stop button. You can play back the audio by clicking Play button. You can also stop playback any time by clicking Stop button.

Here are the screen shots –

2013_03_18_screen1 2014_03_18_screen2

Continue reading “CFMobile Example – Record and playback audio using ColdFusion Splendor”

ColdFusion Thunder – It's all new IDE

Though ColdFusion Thunder is the next version of ColdFusion Builder (the last version was 2.0.1), it is like a new IDE because it’s a major re-write. Past versions of ColdFusion Builder were built on top of Aptana. I had noted some of the challenges in implementing ColdFusion Builder a couple of years back, when CFB 2.0.1 was released.

ColdFusion Builder (till version 2.0.1) used a very old version of Aptana. Aptana later re-wrote and improved their IDE and released it as Aptana Studio 3.  The integration points in Aptana Studio were changed to such an extent that integrating CFB in it would have meant re-writing it. So we decided not to base ColdFusion Thunder on Aptana and implemented many features that Aptana had contributed earlier – most notably editors for HTML, JavaScript, CSS and XML. This also meant CFML editor had to be re-written because it was based on Aptana APIs to integrate HTML, CSS and JS editors in it.

The task was huge and we, in the ColdFusion team, had been working very hard during the past two years to – first build all (or most) the features of CFB 2.0.1 in Thunder, and then to add some more features. If you have used ColdFusion Builder in the past, then you will see great performance improvements in all the editors in Thunder. Specifically you should see difference when editing large files. The memory footprint is also improved.

Here are some of the new/improved features in Thunder –  Continue reading “ColdFusion Thunder – It's all new IDE”

CFMobile Example – Using Geolocation APIs in ColdFusion Splendor

I was going to cover a use-case of taking picture in a mobile app and uploading it to ColdFusion Server in this post, but I found some issues in packaging an app that used Geolocation APIs when helping someone and thought that I would cover geolocation first.

This sample application is very simple – it gets your current location and displays a marker at that location on the Goole Map APIs. Here is how the application looks – Continue reading “CFMobile Example – Using Geolocation APIs in ColdFusion Splendor”

Creating database mobile application with ColdFusion Splendor

In my previous post, Simplify Mobile Application Development Using ColdFusion, I posted a video that showed how easy it is to create mobile application with CFMobile features of ColdFusion Splendor (Server) and ColdFusion Thunder (IDE). In that video I created a simple app called ‘Simple Expense Tracker’. But the code was not optimal, because the main purpose of the video was to show you features of CFMoible. I also mentioned that I will post a better example of the same app.

So In this post I will show you how to create a database application, where user interface code is separated from the data access code. I will also use JQuery for DOM access and Bootstrap for UI. Continue reading “Creating database mobile application with ColdFusion Splendor”

CFSummit2013 – Day1 and cfclient

The day 1 of CFSummit2013 was great. It started with Ben Forta’s keynote. It was, as expected, excellent. He talked about the history of CF, how it’s goal is still the same (productivity) and which features have worked really well and which ones did not work. It was followed by Rakshith’s demos of some of the new features in the next release of ColdFusion (code named Splendor). He touched upon language enhancements, improvements in PDF generation and Mobile features. My demos of mobile features followed Rakshith’s demos. Unfortunately by the time I walked up to the stage to present demos, we had almost ran out of time. So I had to rush through my demos. I had planned to show a demo of debugging mobile application running on a device using ColdFusion Builder, but could not do so. I was told that there were a few issues with audio and display screen during the keynote.

Adobe had set up a table where CF developers could meet and talk to CF team members. Many attendees came there and showed interest in the mobile work flow that we had presented. I also attended Simon Free’s session on Mobile development features in Splendor. He did an excellent job of explaining what cfclient is and some of its features. In the limited time that we had in keynote, we probably could not explain what cfclient was, but I think after Simon’s session people got pretty good idea of what it is. I am looking forward to the second part of Simon’s talk today.

There were many tweets yesterday about cfclient and how it is trying to replace JavaScript. I want to make it clear that it is not true. I can understand that some of the confusion could be because there is no build of Splendor publicly available to try out these features and you will have to base your opinions on what you see in the conference and what other people are taking about it. Having worked closely on mobile features, both on the server and CF Builder, I will try to address some of the concerns about mobile features in Splendor. Continue reading “CFSummit2013 – Day1 and cfclient”

My Experience of building UI of CFSummit2013 mobile app

I am back to writing blog after a gap of nearly two months. Past few weeks had been very busy working on new features of ColdFusion and creating a mobile app for CFSummit2013 . I along with my colleagues Asha and Rakshith had been working on this app for nearly a month, though not necessarily full time. There were two main reasons for building the app 1. to use mobile features of next ColdFusion releases to provide feedback and catch bugs 2. to create a useful app for the attendees of CFSummit.

I don’t know if attendees would find the app useful (I certainly hope so), but we were able to provide a lot of valuable feedback on ColdFusion mobile features and catch many bugs. The application took more time than it should have, because the mobile features of ColdFusion were still under developement. We would hit a bug and would have to wait (if it was a blocking issue) till it got fixed. In many case we did try to work around issues. But the whole process took a lot more time.

But this post is not about mobile features of ColdFusion and how they were used in the CFSummit app. I am going to talk about my experience in creating HTML5 UI for this app, the issues we faced and lessons learnt. Some of the UI issues are still unresolved.

Along with new mobile features of ColdFusion, this app is developed using JQuery, Bootstrap3, PathJS, JQuery Raty, Cordova (PhoneGap) and PhoneGap Build.

Continue reading “My Experience of building UI of CFSummit2013 mobile app”

Presenting a webinar on ColdFusion Builder – ColdFusion Developer Week

I am presenting a webinar on ColdFusion Builder on Wednesday, 6th June, as part of the ColdFusion Developer Week. I am planning to cover following topics –

  • Setting up project
  • Configuring ColdFusion server
  • Many editor features
  • Debugging
  • FTP & Synchronization
  • Extending ColdFusion Builder by writing extensions

Continue reading “Presenting a webinar on ColdFusion Builder – ColdFusion Developer Week”

Challenges in implementing ColdFusion Builder

ColdFusion 10 and ColdFusion Builder 2.0.1 released this week, on 14th May. My article on What’s new in ColdFusion Builder 2.0.1 is published on the Adobe Developer Connection. I have been working on ColdFusion Builder for close to 3.5 years now and the release of updater this week has put me in a mood to reflect on challenges we have faced so far.
Continue reading “Challenges in implementing ColdFusion Builder”

Social