Application Craft - Learning Center
This page contains videos and links to the reference manual to help you learn Application Craft as quickly as possible. You can also learn the product by trial and error although that tried and tested way will take you about 4 times as long. So we hope you can overcome your natural resistance to tutorials and help.
API Cheat Sheet
The
Cheat Sheet page is a great page to bookmark and have running while you are coding.
Update History
Update History
Download Apps shown in Tutorials
At the top the sections below, are links to download the apps shown in the tutorials.(Not all apps are currently available, but check back later)
Getting Started
|
|
|
Logging into the Console [1:28] (24 Oct 2011)
A quick stroll around the 'Console', where you collaborate with other users on all Content and other stuff.
|
|
|
|
Creating a new App [1:08] (24 Oct 2011)
This shows how to create a new Mobile or Web Content site. It quickly looks at how you can share and permission your content.
|
|
|
|
Overview [4:30] (24 Oct 2011)
The IDE is where developers spend most of their time. We explain the some of the key concepts of the Application Craft IDE.
|
|
|
|
App Pages - Page navigation, standard and popup pages [1:35] (24 Oct 2011)
Your Apps will normally have several pages. We offer two types of pages - standard pages and popup pages are popup dialogs that can be displayed modally over the current page.
|
|
|
|
Repeating Widgets across multiple pages [1:00] (26 Oct 2011)
If you use header and footer bars in your Apps you will often find that you want to repeat these across multiple pages rather than copying them. You can include or exclude these widgets on some or all pages.
|
|
|
|
Switching between Apps seamlessly & the Global Data Store [2:17] (25 Oct 2011)
An AC App should not become too large ideally. If you have a large application, the solution is to break it down into a series of smaller Apps and then switch seamlessly between them. The Global Data Store allows you pass data between them.
|
|
|
|
Embedding one App inside another [3:02] (25 Oct 2011)
Building modular applications that can be seamlessly embedded inside other Apps is very powerful and efficient. You can pass data between a parent and child App as well.
|
|
|
|
Time Saving Tips & Tricks [3:48] (24 Oct 2011)
There are several small tips and tricks that can save you a lot of time. Using several browser tabs, version control, multi-selection techniques, copy & pasting between Apps, alignment and parent container selection.
|
Everyone absolutely needs to get to grips with this section. If you are at all interested in Responsive Design, Adaptive Layout or, more simply put, a UI that can resize nicely depending on browser or display size, then taking the time to learn these techniques is absolutely worth it.
|
|
|
An overview of Responsive Design [1:20] (29 Sep 2011)
Watch this video first to get a clear idea of what you can do with advanced layout techniques.
|
|
|
|
The Importance of Containers [3:42] (03 Oct 2011)
Mastering the use of Containers lies at the heart of all good UI designs.
|
|
|
|
The 'Sizes' property explained [2:27] (03 Oct 2011)
This controls the way widgets dynamically resize based on the size of the browser or device size.
|
|
|
|
Layout Modes [2:47] (03 Oct 2011)
Layout Modes (Absolute, Vertical and Horizontal) are another vital concept. You cannot build Responsive Apps without fully understanding them.
|
|
|
|
Widget Alignment [2:36] (03 Oct 2011)
Aligning Widgets and Containers in different ways.
|
|
|
|
Using Tables in Adaptive Layout [3:10] (03 Oct 2011)
Tables are often very useful for certain types of content. On the whole, though, Containers are better for most parts of responsive design.
|
|
|
|
Adaptive Rules [5:50] (03 Oct 2011)
This is the last but critical part of Responsive Design. You can define dialog based rules that modify appearance based on browser or screen display size.
|
|
|
|
Embedding in a Web Page [2:16] (25 Oct 2011)
You can embed any App in a web page. Whether a simple HTML page, a table cell within an HTML page, a portal or any other content where you can include a short piece of HTML. You can also pass parameters from the hosting page into the App.
|
|
|
|
Deploying a Native Mobile App [2:22] (24 Oct 2011)
This actually uses Phonegap:Build but we have integrated tightly using their API and so this shows how you build your Mobile Native Apps with just a single button press.
|
For anything other than static content, you will want to add intelligence to your Apps. In Application Craft this is simply done using Javascript. We have made this far easier than usual by providing not only the entire visual framework but also a great Client API that makes accessing your App Widgets and also back end features really easy. It aims to reduce the amount of code to at least 30% and sometimes as much as little as 5% when compared other languages and frameworks.
API Cheat Sheet
This is a
really useful page that you will probably want to bookmark and have open while you are writing app code
|
|
|
App & Widget Events [2:24] (25 Oct 2011)
Events lie at the heart of coding up an Application Craft App. You will find a rich set of events for the App, a Page and each individual Widget.
|
|
|
|
The Code Explorer and Editor [2:03] (25 Oct 2011)
The Code Explorer allows you to clearly structure, manage and find your events and functions. You can see your App's private code, system public code as well as server-side javascript code. This version of the Code Editor will be available shortly.
|
|
|
|
The Application Craft Client API [2:01] (25 Oct 2011)
This Client API is one of the key ingredients in the system that saves you an awful lot of coding time. It aims to help you avoid complex code to extremely simple script, saving you development time, increasing code legibility and reducing maintenance.
|
|
|
|
Debugging your Apps [1:35] (25 Oct 2011)
Because everything about Application Craft is pure Javascript, you can use your browser's standard debugging tools.
|
|
|
|
Client and Server Side Javascript []
Because Application Craft is not just an IDE but an entire platform, we can provide some very powerful scripting capabilties while maintaining simplicity. Using our IDE you can create private and public scripts that run on the server.
|
|
|
|
Customizing the Error Handling [2:30] (25 Oct 2011)
Application Craft will handle any errors automatically by default and will display a standard error box. However, you can write your own custom event handler and use a popup page to handle the visual side.
|
|
|
|
AJAX functions, timeouts and data population [3:13] (26 Oct 2011)
Some of your Apps will want to comunicate with Web Services & APIs. We offer Client API methods dramatically simplify this process and to get data retrieved from APIs quickly and easily into widgets.
|
IMPORTANT : Anyone wanting to build more than basic apps HAS to watch all of these. The setValue() and getValue() methods are staples. The populateWidget() and setData() functions allow you to load data efficiently from AJAX calls and other sources.
|
|
|
The Basics - Reading and Writing Widget Data [3:08] (26 Nov 2011)
You will spend a lot of time reading and writing data to and from widgets. This covers the most common uses such as labels, text fields and lists.
|
|
|
|
Populating List Widgets with the Item Dialog [3:09] (30 Nov 2011)
You will probably use these quite a lot for your mobile and desktop apps. They can be populated manually from the IDE, dynamically using a Data View and also from Javascript.
|
|
|
|
Populating List Widgets with Javascript [5:15] (26 Nov 2011)
You will probably use these quite a lot for your mobile and desktop apps. They can be populated manually from the IDE, dynamically using a Data View and also from Javascript.
|
|
|
|
Repeater Container Overview [5:04] (26 Nov 2011)
The Repeater Container is a real workhorse widget. It allows list/table data to be displayed with total freedom, unlike a Grid Widget. This is worth getting to know well and also the tips and tricks that speed up performance.
|
|
|
|
Populating a Repeater with Javascript [2:56] (30 Nov 2011)
Data Views allow you to pull in data from any Query (see Integration) without writing any code.
|
|
|
|
Populating Chart Widgets [5:04] (05 Dec 2011)
Populating Charts can be done directly using Data Views (see Integration section) or using Javascript, which is what we cover in this video.
|
This section contains information about mobile specific topics. The actual App building process is near identical to any other type of App, but there are a few more things relating to testing, building and deploying that are worth knowing.
|
|
|
Designing a Mobile UI [2:57] (26 Oct 2011)
UI/UX (User Interface / User Experience) is one of the most important aspects of designing a mobile application. We won't try to teach you the finer points of these as they are more design related than technical. However, getting the technical basics right is important and this video explains this.
|
|
|
|
Client API Functions and the Phonegap API [2:44] (26 Oct 2011)
Find out about helper functions such for seeing if your app is online or running as a web app or native app. And if you want to access the device hardware.
|
|
|
|
Ripple Emulator [3:03] (26 Oct 2011)
This is a really nice Emulator that lets you test your App directly from the Application Craft IDE. This means that you don't have to compile a native app at all for most device features. So, once you do compile, you have got rid of most issues where testing and iterating is simplest and quickest.
|
|
|
|
Phonegap:Build [2:47] (26 Oct 2011)
If you want to experience the easiest way of building a Native App, then this video shows you how to create a Phonegap:Build account and then build Native Apps for up to 7 device platforms with a single click from the Application Craft Console.
|
|
|
|
Deploying Mobile Apps [1:18] (26 Oct 2011)
Your Mobile Apps can be deployed as Web Apps, Native Apps and even both! This explains the high level concepts and how to do it.
|
|
|
|
The switchApp() debugging trick [2:22] (26 Oct 2011)
This clever trick lets you build an App skeleton and quickly deploy it. Once deployed you can modify your App as much as you like in the IDE, press save and then, on your mobile device, you can trigger the new App to be downloaded and executed instantly. This can potentially save you hours of compiling and deploying (and you can multiply that by the number of platforms you want to test on).
|
|
|
|
The Weinre Debugger []
This is a really cool Phonegap add-on from Patrick Mueller. This lets your device send debug information to your desktop browser in real time.
|
|
|
|
App Store Provisioning []
Once you have built Native Mobile Apps, you will want to distribute them. We explain the basics of how this is done.
|
Application Craft is able to pull data from different data sources (Integration Agents) that are able to query data. Currently, we offer Integration Agents that support Apps as well as most of the well common databases. You can also add your own Integration Agents. All data that comes from an Integration Agent is available to an App in a standard fashion. This data can then be used by Widgets with little or no code.
|
|
|
An Overview [4:51] (05 Dec 2011)
Watch this to get a general idea of how our Integration support works.
|
|
|
|
Setting up a Connection [2:20] (05 Dec 2011)
These are rather like Connections and Queries within any regular database. The Console allows you to configure these directly.
|
|
|
|
Querying Apps [4:57] (05 Dec 2011)
You can define Queries on Apps without having to define any Connections. You can also JOIN several Apps using a simple dialog.
|
|
|
|
Querying external Databases [3:03] (05 Dec 2011)
Building a Query that connects to external databases (mySQL, Postgres, Oracle, SQL-Server etc.) is straightforward and also allows you to define JOINs with our simple dialog.
|
|
|
|
Data Views [2:18] (05 Dec 2011)
Data Views are defined within your Apps. It tells your App which Console Queries are required by your App. These Views are then available as a property of any widgets that can accept external data.
|
|
|
|
Configuring Data Section Properties & Expression Editor [5:47] (05 Dec 2011)
Now that your Data Views are defined, you can populate widgets direct from a Data View, in many cases without need to add a line of code. More complex situations will require mixing in a little Javascript, as shown in a later video. This shows you the use of the Expression Editor, an important feature.
|
|
|
|
Automated & Javascript Drill Down [4:59] (05 Dec 2011)
You can specify automatic drill-down actions that can be triggered when a users clicks on a widget. Learn how a Widget can 'broadcast' a drill-down event and how others can be set to 'listen' to these events. We also show how to achieve the same thing using a smattering of Javascript.
|
|
|
|
Javascript, Filtering, and other tips and tricks [6:11]
There are some advanced things you can do with Queries and Data Views. This section makes you aware of these in case you need them in the future.
|
WARNING: Until we release Server Side Javascript (end of January 2012) you should consider apps that use AC App Data Storage inherently insecure and relatively easy for someone to hack into. Once Server Side Javascript is available, these security issues will be fully addressed.
Application Craft can be used purely for building front-ends to independent back-end APIs. However, if you are building a Data Centric application, then you should consider our Data Storage features. There is no database configuration, you just define your storage as App and Widget properties. And, you can build relational Apps that can link on any field.
|
|
|
Data Storage Introduction [3:05] (19 Dec 2011)
We explain the principles of Application Craft's Data Storage engine. We've created an ugly but functional application that condenses the Data Storage functionality into a simpl(ish) use case.
|
|
|
|
Enabling Data Storage for an App [4:11] (19 Dec 2011)
By default, Apps do not store data. If you want storage, you just switch the property on and set a couple of extra parameters for integrity checking and summary Instance (record) naming. Individual fields within your App can then be set to store data.
|
|
|
|
Relational Apps - Strategy and Relationship Definition [1:31] (19 Dec 2011)
This video shows you how you think about Relational Apps and how to define different types of relationships between them. AC also allows you to define arbitrary relationships between any Apps using Javscript as shown in a later video.
|
|
|
|
Querying Data From an App [2:05] (19 Dec 2011)
This shows how you can define Queries from the Application Craft Console. Queries can be used to populate reports and widgets in other apps. You can also create printed reports that access these queries.
|
|
|
|
How Complex Data is Stored [3:23] (19 Dec 2011)
If your Apps have only regular fields, then life is simple and your App's data can be thought of as a regular table. However, if your Apps has 'multiple response' or 'grid' type data widgets then things are a little more complex. You need to be aware of how data is stored and how to query this data.
|
|
|
|
Deleting App Data Instances [1:01] (19 Dec 2011)
When you are building Apps you will often want to clean out your App data. You can do this from the Console or also from javascript code.
|
|
|
|
Containers Explained [4:25] (19 Dec 2011)
A Panel Container is associated with a Data View (see Data Integration section). This is very important for displaying data from a foreign App or from any Query that should be mapped to multiple fields in the running App. It allows you to get data with a single operation and then lets Application Craft map the returned data into individual Widgets.
|
|
|
|
Integrity Checking [4:18] (19 Dec 2011)
See how you enable Required Field and Uniqueness integrity checking for your App data.
|
|
|
|
Relational Apps - Automatic Method [2:41] (19 Dec 2011)
If you have defined the relationship between two Apps within the IDE, then when you add an App Instance of a related App, the actual relationships is automatically created.
|
|
|
|
Relational Apps - Manual Method [4:52] (19 Dec 2011)
At any point, you can define (or remove) a relationship between any two Instances of any Apps using Javascript. This allows for really powerful functions to be created without having to set up your own relationship tables.
|
|
|
|
Querying Related Apps using JOINs [2:13] (19 Dec 2011)
You can define easily define Queries between different Apps in the Console.
|
|
|
|
Creating, Updating, Deleting Instances using Javascript [4:44] (19 Dec 2011)
At any point, you can define (or remove) a relationship between any two Instances of any Apps. This allows for really powerful functions to be created without having to set up your own relationship tables.
|
|
|
|
Grid Syncing []
The instanceSync() function offers a simple way to load data from a single table query, edit it and then save it back to the App storage. You should only use this for simple tasks with modest amounts of data.
|
There are an awful lot of of extra goodies in Application Craft. This section addresses as many of these as we can. If there are any topics that you would like to see videoed then please say so and we will add them as soon as we can.
|
|
|
Managing Large Lists, Repeater Contents & Data Paging [4:25] (20 Dec 2011)
Here, we discuss some coping strategies for paging larger amounts of data from Data Views. We also cover strategies for displaying large amounts of data in Repeater Containers, which can be slow on mobile devices especially.
|
|
|
|
The New Google Maps Widget []
In December 2011 we are introducing the new Google Maps Widget (from February 2012, will require the Starter Subscription). This really encapsulates what AC is about. It is designed make mapping and Geocoding features such as Markers, Lines, Areas, Geocoding Lookup, Reverse Geocoding, Adsense and most of the other features incredibly easy to use.
|
|
|
|
Workflow []
Available to users of the Pro Support Package (and above) Workflow allows you to share App Instances (records) between users, groups and roles. It also provides support for notifications, reminders and assignments. All of this allows your Apps to automate business processes and approvals etc.
|
|
|
|
Google Analytics []
If you have a Google Analytics account and you want your App to be able to log data within GA, then Application Craft makes this extremely simple. There is both Page property and API support for this.
|
|
|
|
User Parameters []
The Console has support for custom 'User Parameters'. This allows the AC back end to store parameter data about each individual user that can then be queried by your Apps. A good example of this is an Employee ID that you could then use to automatically filter data on a query. Add your Employee parameters into the Console and you are good to go.
|
|
|
|
Authentication []
Our back-end support user management not just for developers but also for users of your Apps. Our Authentication support includes both Widgets and API methods that make the features such as signup, signin and forgotten passwords far easier than doing it from the ground up.
|
Update History
27 December 2011
21 December 2011
20 December 2011
19 December 2011
09 Decemeber 2011
05 Dec 2011
30 Nov 2011
26 Nov 2011
26 Oct 2011
25 Oct 2011
24 Oct 2011
03 Oct 2011
29 Sep 2011
Video