In this article, I will outline how I tested out an idea for a product(websitestash.com) by creating a fully functional web app using WordPress and a handful of plugins and a theme.
I look after websites for several clients, and I always like to look at them quickly to check that everything looks like it should. I couldn’t find a tool that did this, so this is where the idea for the app came from, and I figured why not try and build it as it’s not very complicated.
Here is the idea as I wrote it in my idealist.
list the websites you look after in a grid and use iframes to display the websites, add admin links also.
How will the app work?
A user would have a dashboard to view their websites and be able to add, edit and delete the websites. The users would also need to be able to sign up and login etc.
I know it’s not trendy and not the <INSERT THE LATEST TRENDY WEB FRAMEWORK HERE> but I have used WordPress a lot for client projects and figured it would fit the bill perfectly for this quick project. The reasons for the this are, It comes with user management out of the box, Comes with plenty of plugins to add functionality quickly and as a developer, I can use themes to get a start with the design.
Below I will outline the WordPress Plugins and Theme I used.
The theme I used was The Beaver Builder Theme, The reason for using this theme was I was using the Beaver Builder Plugin, and the two work great together. I went for a straightforward minimalistic design because the product is pretty simple and I didn’t want to be slowed down by design.
The theme can be found here
Beaver Builder is a page builder plugin for WordPress which is great for laying out pages visually with rows and columns and modules for content(images, text blocks, post lists etc.). I used this to layout out all the pages, and it saved me a ton of time by not having to start the design in a design program and then come back and code up the pages.
The plugin can be found here
An extension for Beaver Builder that allows you to customise the post modules posts with custom HTML as well as extend beaver builder layouts into themes.
The plugin can be found here
wp user frontend pro:
wp user frontend pro allowed me to add the functionality for front-end forms for adding and editing websites as well as the login forms. This stopped the user seeing anything of the WordPress backend or even know that the site was built on WordPress in any way.
The Pro Version can be found here
CB Change Mail Sender:
A simple plugin that changes the email sender name from WordPress to whatever you want.
WPUF login redirect:
A plugin that redirects users to their dashboard page after the login.
There were also a bunch of other plugins for Security, backups and stats and development but as they don’t help with the app’s functionality, I haven’t listed them.
What I had to code:
I had to register a custom post type(I could have used a plugin for that, but I thought it was overkill) for the websites so wrote the code for that in the themes functions file.
I did have to write a little custom PHP code as I needed the post’s module from Beaver builder to show only website posts for the currently logged in user.
All in all the app does what I wanted it to do, Ok it’s not the next Trello or Drip, but that wasn’t the point in building this. I wanted to be able to build the idea out and see if it was useful, with a minimal investment.
The total time for me to develop website stash was 4 hours and 15 minutes.
What did the exercise do for me?
Well, I have a tool I can use daily to monitor my client websites and proved that you could take a relatively simple idea to product pretty quickly using just WordPress.
There was also another great outcome from this, and that was I shipped something. I think all too often we can get stuck in the idea phase and not commit to building products. After building this, I have become a lot more productive in general and am already working on my next project (hint it will include WordPress but with Firebase and webix).
You can check out the final product at websitestash.com
THE BOOTSTRAPPED FOUNDERS CLUB
The Bootstrapped Founders club is a private members club for founders who are bootstrapping their products to chat and network with like-minded people.