The Beginners’ Guide to Creating a Caspio Web Application
October 28, 2013
If you are new to the Caspio platform and databases in general, you might find creating your first web application a bit intimidating. To give you a jumpstart, we’ve crafted a list of steps — Envision, Plan, and Build — that will help you turn your ideas into reality fast and easily. We’ll be looking at each step as though we were building a real estate property listing application to provide you with some real world context.
Step 1: Envision
Having a clear vision is the essential first step to web-based database application development. The Envision step aims to help you form a clear picture of what you want to create and give you a framework on which to build. Answer the following three questions with as much detail as possible:
- Who will be using the application?
- What actions will each user group be allowed to take?
- What type of data will the application need to manage?
In the case of our real estate listing example, three groups of users would be involved:
- Public users who are searching for properties
- Agents who manage available properties
- App administrators who manage activities undertaken by the previous two groups
Each group of users will interact with the application in different ways — public users, for example, will need to search for properties with different criteria and ask to be contacted if interested; and agents should be able to enter new listings, make changes to existing ones and view incoming inquires. As the app builder, you need to create a list of all user groups and write down the actions each group will be allowed to take.
For example:
- Public Users: search properties, submit inquiries
- Agents: Enter new properties, edit/delete existing properties, manage their own profile
- Admin: Add or remove agents, edit or delete properties, change agent profiles
Step 2: Plan
Simply put, planning means translating the above answers into a high-level implementation plan that can be used to build the actual application.
You should approach the planning stage from the angle of each user group and decide what screens or interfaces they will need in order to accomplish the actions they are allowed to take. In the real estate listing example, agents would need an Input interface to enter new listings, a Search and Edit interface to view and edit existing properties and public users would need a different input interface to submit inquires. Go through your user groups and list all of the interfaces necessary for each user group.
Then consider all the entities in your app. The real estate listing app would have four entities: properties, inquiries, agents, and admins. These entities would be Tables in your app. For each table, consider what fields you need and the type of each field. For example, the Properties table would probably include these fields: Address (Text), Price (Number), Bedrooms (Number), etc.
The next step is to list all the fields that are needed for each interface.
Tip: Make a grid like the example shown below to organize all the information you have collected from the envisioning and planning steps.
User Group | Actions | Data | Table (Entity) | DataPage (Interface) |
---|---|---|---|---|
Public Users | Search properties | State, City, Zip Code, Price, # of Bedrooms, # of Bathrooms | Properties | Search and Report |
Ask to be contacted | Name, Phone, Email Address, Questions | Inquiries | Web Form | |
Agents | Add new properties | Title, Address, City, State, Zip Code, Price, Bedrooms, Bathrooms, Area(Sq Ft), Lot Size(Sq Ft), Description, Photos | Properties | Web Form |
Manage properties | Properties | Search and Report | ||
Update profile | Name, Phone, Website, Email, Password, Image | Agents | Update Form | |
Manage inquires | Name, Phone, Email Address, Questions | Inquiries | Search and Report | |
Admin | Manage properties | Title, Address, City, State, Zip Code, Price, Bedrooms, Bathrooms, Area(Sq Ft), Lot Size(Sq Ft), Description, Photos | Properties | Search and Report |
Add agent | Name, Phone, Website, Email, Password, Image | Agents | Web Form | |
Manage agents | Search and Report | |||
Manage inquiries | Name, Phone, Email, Questions, Status | Inquiries | Search and Report |
Step 3: Build
Now with an actionable plan in hand, you can start creating your first Caspio application. A point-and-click app builder will guide you through each step. You may notice that entities and interfaces are listed under Table and DataPage in the above grid, both of which are the key concepts of the Caspio platform:
- Tables: Tables are used to hold different data. Start building your applications by creating a table for each entity.
- DataPages: DataPages serve as the interfaces between your data and different user groups. Once you have created all the Tables, determine the number and type of DataPages needed to implement each user group’s functions.
- Authentication: Apply password protection to your non-public DataPages to protect them from unauthorized access. Create a different authentication for each of your user groups and apply it to the DataPages of that group to allow/restrict access to different functions.
In our real estate listing scenario, we need four tables (Properties, Inquires, Agents and Admins) and multiple DataPages to perform desired functionalities for each user group.
Customize the look and feel of each DataPage the way you want by applying one of the built-in styles, or make a new one to match your own website color scheme.
Once you have successfully created your DataPages, you can preview them inside Caspio. When you are satisfied with what you have, you can deploy them on your website, blog or any web property, using a variety of deployment methods to suit your specific needs. For most users the Standard Embedded Deployment method provides the most professional outcome and seamless integration with websites.
Check out the Instant Apps Gallery to see an example of the finished real estate listing app.
Tip: This same approach can apply to all sorts of applications, be they complex CRM systems, lead generation forms, or task management systems. Once you understand the basics of Caspio, endless possibilities will be at your fingertips.
Feel free to leave a comment below and let us know what you think about the approach, or share any questions that you may have. For more app-building tips and best practices, subscribe to our monthly newsletters.