Welcome to our ultimate video guide on turning spreadsheets into apps. This video series will cover everything you need to learn to create web applications using your Excel files, from importing the file online to deploying dynamic forms and reports to your website.

SUMMARIZED VIDEO TRANSCRIPT

This tutorial will complete the development of your application by deploying it to a website.

While the sample template used in this video was created using HTML, you don’t need any background in front-end web development to implement your apps. Caspio is also compatible with many website builders out on the market today. Services like WordPress, Weebly, Yola and Squarespace all have drag-and-drop user interfaces that eliminate the need to code.

The only thing left to do now is embed your Caspio DataPages.

Deploying Your Reps Web Portal

Assuming you already have your HTML pages ready, go to your list of DataPages inside the Caspio Application Platform. Focus first on the three interfaces you’ve built inside the Reps table.

How to Convert Excel to a Web App | Part 5: Deploying Your App

DEPLOYMENT 1: mysales.html

Simply hover your cursor on the DataPage container of My Sales and click Deploy, then click Enabled in the resulting window to update the Deployment Status. A list of five deployment methods will be available with their respective deploy codes:

How to Convert Excel to a Web App | Part 5: Deploying Your App
  1. Embed – This is the most popular deployment method. You only need to copy the auto-generated JavaScript and paste it on either an html page, or an embed block in most website builders.

  2. URL – This is the quickest way to share a DataPage. The auto-generated URL link can be bookmarked on any web browser and sent to other users without needing to build a website.

  3. Frame – This is an alternative option to the Embed method. Note that a DataPage deployed in a Frame or iFrame does not interact with its container page, so this wouldn’t be the best approach when passing parameters between DataPages.

  4. .NET – This is the preferred method when deploying into Sharepoint, ASPX, C# and VB.Net pages.

  5. WordPress – This method is used only with the Caspio Plugin for WordPress. In case you are deploying on wordpress.com sites, note that they do not allow JavaScript, Frame or iFrame code.

Use the Embed method for now and copy the deploy code. Then go to your HTML files, find the web page you’ll be deploying on (mysales.html for this tutorial), paste the code in the appropriate section, then save and publish your website.

How to Convert Excel to a Web App | Part 5: Deploying Your App

Test your deployed DataPage by going to your website and hitting refresh. You should see your authentication form prompting you to log in as a rep. Use your sample account for Max to gain access (Username: max@rep.com, Password: maxw) and see the fully functional interface fitted nicely on the template screen.

DEPLOYMENT 2: new_sale.html

To deploy your next DataPage, go back to your list of DataPages in the Caspio App and follow the same procedure. Only this time, embed your deploy code on the HTML file (new_sale.html) that should contain the Add New Sale web form.

How to Convert Excel to a Web App | Part 5: Deploying Your App

Again, upon refreshing the webpage, you’ll see how the form is seamlessly embedded.

DEPLOYMENT 3: Company Sales

The last DataPage you’ll be deploying as part of your sales rep web portal is Company Sales. You should already be familiar with the pattern at this point so go ahead and embed the deploy code onto your third HTML file (company_sales.html).

How to Convert Excel to a Web App | Part 5: Deploying Your App

Your webpage should appear upon hitting refresh.

With all the DataPages you’ve built for your sales reps live for everyone to access, your authorized users can start adding new sales, viewing company sales and reviewing their own sales performance.

Deploying Your Admin Web Portal

The next three DataPages you’ll deploy will be from your Admin folder. You’ll still be following the same procedure so there shouldn’t be any difficulty when you implement the following:

DEPLOYMENT 4: new_rep.html

Copy the Embed deploy code for Add New Rep and paste it on your designated HTML page (new_rep.html). Then test your webpage after saving and publishing to see if the form interfaced well with your html template. Use your sample admin account (Username: john@admin.com, Password: test) to gain access.

How to Convert Excel to a Web App | Part 5: Deploying Your App

DEPLOYMENT 5: manage_reps.html

Next, copy the deploy code for View/Manage Reps and paste it on your designated HTML page (manage_reps.html). Then once again, test your webpage after saving and publishing. Hit the Search button when the search form appears to check if all the reps from your database are displayed on screen. Feel free to explore the Edit and View Details links as well.

How to Convert Excel to a Web App | Part 5: Deploying Your App

DEPLOYMENT 6: manage_sales.html

Finally, for this section, copy the deploy code for View/Manage Sales and paste it on your designated HTML page (manage_sales.html). Upon hitting refresh on your website after publishing your html, you should see a search form appear. Clicking the Search button will fetch all the sales data grouped by reps and broken down by product.

How to Convert Excel to a Web App | Part 5: Deploying Your App
Deploying Your Admin Dashboard

The last three DataPages you’ll be deploying will all be embedded on one webpage to create your administrator dashboard. The layout will be two charts on top and a pivot table at the bottom.

DEPLOYMENT 7: dashboard.html

After setting up your dashboard html page (dashboard.html) to display the final DataPages correctly on screen, copy and paste all three deploy codes for Total Sales by Month (left-hand side), Top Performers (right-hand side) and Sales Pivot (bottom).

How to Convert Excel to a Web App | Part 5: Deploying Your App

Upon publishing your dashboard webpage and hitting refresh, notice that the width of your pivot table exceeds the html template of this tutorial. Fixing this phenomenon boils down to adjusting the DataPage from Caspio and limiting the information being displayed or expanding your html template to fit your current DataPage inside.

This concludes the deployment of all your admin tabs. Your administrators can access them anytime in the navigation menu, similar to your reps portal in the first section.

Watch More Ultimate Video Guides!

Now that you’ve learned how to deploy your Excel-based application to a website, you’re ready to build other custom applications for your business.

Try building patient portals, document repositories, help desk systems and many more. Going from Excel to web is just the tip of the iceberg.

You can also explore other ultimate video guides that teach you how to build a custom CRM, knowledge base, dashboard and more. Feel free to refer to these guides during your project development.

Thank you for watching!

Next Steps

DOWNLOAD FREE REPORT
See why Forrester ranks Caspio a 'Leader' in low-code platforms for business developers in this 2019 report.
REQUEST FREE CONSULTATION
Got a vision for an application? Get free consultation to see how we can help you achieve it.
SCHEDULE A DEMO
Choose the most convenient date and time for you to get a demo from our team.