Templates vs. boilerplates vs. tools

It can be overwhelming to start building software, especially with so many hipster developer frameworks out there. Since this site grades me on time and revenue, my process begins with identifying the technical needs of the product and then building a re-usable boilerplate "launch starter" that handles the basic workings of the app (these starters are available to our community members).

When I decide to test an idea, I first figure out whether the project needs to be coded or could be built much faster without it. Far too many developers jump into their comfort zone in a code editor without first thinking about what the project requirements actually are. For around 60% of my projects, I opt for a code-free approach. As code-free tools are now getting more powerful, here’s part of my thinking for deciding if code is needed:

• Have I thoroughly tested the idea with a landing page or through conversations with my email list? If not, always code-free first.
• Does the app rely heavily on third-party data/APIs? If so, better to code it.
• Does the app require a native mobile experience? If so, code.
• Is speed and performance critical to user adoption? If not, go code-free (this is subjective, but for real-time apps, I turn to Javascript)
  
  

Code-Free

For simple web apps, mockups, and prototypes, I use the following:

• Bubble: When I need to get a project done in a weekend, I always turn to Bubble. While it has a bit of a learning curve, it’s the most flexible and powerful code-free tool out there. An app on Bubble has it’s own hosted database, workflows and design panel, although getting nice-looking, responsive design is a little tricky with it.
• Carrd: when I need a well-designed landing page, Caard is the best tool for the job. It integrates with forms and even payments, making it an excellent option for quick static launch pages to collect payments/pre-orders. If you need more functionality or want to display database entries, Airtable has become a powerful tool with its ability to collect form data and embed databases on a website. With two Carrd pages linked by Airtable, you could take in form data and display it in the next. This approach is limited, but if you’re looking to validate your idea, the simpler, the better.
• Other tools that are part of my workflow: Dropsource, Thunkable, Webflow

Code

When testing out an idea requires complex app logic, heavy use of a third-party API/CMS, or needs to be lightning fast, I turn to these tools to build:

• Create React App: For single page apps or any application where server-side rendering is overkill, I turn to CRA. It's the fastest way to start coding in React, and if your app outgrows the boilerplate, you can safely eject from the framework to further customize.
• Next.js: The perfect Javascript framework that gets out of your way when you need it to, but simplifies some of the sticking points for getting a project out the door (Webpack, Babel, etc.). Next harnesses the power of server-side rendering and automatic code-splitting to keep your page loading speed blazing fast and the Google gods appeased.
• Gastby (What this site uses): For static sites with CMS backends, Gatsby is amazing. Page speed and a rich plugin ecosystem are its two biggest pros, and the cons list is shrinking by the day. Gatsby's source plugins are also a great way to get familiar with GraphQL and concepts like lazy loading for images.
• Netlify: As a hosting service, it’s a no-brainer. It links up to a Github project for continuous deployment and has a great deploy preview feature for those fun times your local testing goes awry. Recently with the addition of Lambda functions (what powers the judging tool on this site), less and less server-side code is needed.
• Other random tools in my development framework: styled-components, VS Code, Travis CI, Apollo Client