How To Kick SaaS
  • Introduction
  • Forward
  • Who & How
  • The business of SaaS
    • The Business of SaaS
    • Basic Lessons of Saas
    • The Process
    • Parts of a SaaS
  • Validating You SaaS
    • Validating Your SaaS
    • What happens when you don't validate
    • The SaaS Validation Process
      • Why are you doing this?
      • Should you do this?
      • Competition Analysis
      • Buyer Analysis
      • Sales & Distribution
      • Time & Money
      • The Secret Sauce
      • Buyer Categorization By Sales Method
      • The Advisory Approach
    • Validation Success
  • SaaS Build Process
    • SaaS Build Lessons
    • Planning & Costing
      • The Costing Process
      • The Estimate
      • The Scope of Work
      • Information Architecture Development
      • Working Numbers
      • The Project Plan
    • Build Team Roles
      • What To Expect From Your SaaS Development Team
      • Build Teams
      • The Project Manager
      • Information Architect
      • UX Designer
      • Developers
      • Quality Assurance
    • Standard Tools
      • Project Management Tools in SaaS Development
      • Development Environment & Dependencies
      • Remote Development Environments
      • Code Repositories in SaaS Development
      • Monitoring Your SaaS
    • Steps to Developing a SaaS
      • What to expect in SaaS development
      • Systems Setup
      • Creative
      • Project Planning
      • SaaS User Experience (UX)
      • Concept Design
        • SaaS UX Design Case Study
      • Content Development
      • FrontEnd Development
      • BackEnd Development
      • Quality Assurance (QA)
      • Alpha Testing
      • Beta Testing
      • Launching Your SaaS
      • Continuous Integration
    • Things to know and expect
      • You MUST learn at least the basics of Project Management
      • Things you do and do not know
      • How to tell if your development team is working
      • Good, Cheap, Fast. Choose Two.
      • Positivity is Key in Management
      • Storytime: The Story of a Ton of Lost Users and Money!
      • Development is iterative
      • Development Time Increases As Complexity Increases
      • Storytime: Don't Send Me Shit
      • Story Time: The Best of the Best
      • Sunk Costs
    • Your SaaS MVP Pre-Development Build Checklist
  • Appraisement: Pricing Your SaaS
    • Appraisement: SaaS Pricing
    • SaaS Pricing Metrics
    • SaaS Pricing Metrics Glossary
    • Science of Pricing
    • What You Need To Know About Your Customers
    • How To Price Your SaaS
    • Customer Types Case Study
    • Storytime With Brennan
    • Pricing Page: The Most Valuable Page On Your Website
      • Pricing Page Examples
  • Acquisition: Gaining SaaS Users
    • Acquisition: Getting SaaS Users
    • SaaS Traction Lessons
    • Acquiring your first users
    • Getting ready for growth
    • Organic Search Marketing
      • Content Marketing Is An Investment
      • Step 1: Keyword Research
      • Step 2: Content Planning
      • Step 3: Writing, Formatting, & Beyond
    • Marketing Automation in SaaS
      • Marketing Automation Basics
      • Storytime: Learning about marketing automation the hard way
      • Lead Scoring, Tagging, & Triggers
      • Marketing Automation Systems
    • Lifetime Deals
    • Outbound Campaigns
    • Affiliates & Partnerships for SaaS Businesses
    • Narrowing Your Message With Adaptive Design
    • Social Media Marketing
      • Social Media Retargeting
      • Testing your social media ads
      • Social Media Ad Tricks
    • Pay Per Click (PPC)
    • SaaS Software Checklist
    • Email Marketing
    • The Marketing Website
  • Activiation
    • Activation
    • Getting Personal
    • Stalking Your Users
    • Onboarding
    • Training Webinars
    • Onboarding Emails
    • New User Tour
    • Setup Checklist
  • Attrition: Supporting Your Community and Growing Your Business
    • Supporting Your SaaS Customers
    • SaaS Community Building
    • Chatbots
    • Events
    • Swag
    • Education
    • The Knowledge Base
  • NOTES
    • NOTES
    • The best growth hacks no one wants you to know
Powered by GitBook
On this page
  • Front-End Development
  • Front-End Developer Tasks
  • Starting up Front-End development
  • What the front-end developer needs to do their job:
  • Saving Time
  1. SaaS Build Process
  2. Steps to Developing a SaaS

FrontEnd Development

PreviousContent DevelopmentNextBackEnd Development

Last updated 6 years ago

Front-End Development

Front-end development generally refers to the coding of the systems you see. This means the code that delivers the content from the back-end systems to the user. The front-end developer takes the designs that were done and turns them into views.

Very often, especially nowadays, there is overlap between front-end and back-end for front-end developers because in order to see the data in a meaningful way the front-end developers benefit from being able to tap into the data to deliver information.

Front-End Developer Tasks

What this often means for SaaS development is that your front-end developer can take the designs your designer did and turn them into something you can click through and load as a web page, even if there is no functionality behind them.

The front-end developer could make the view of a calculator, but when the user clicks on the buttons, nothing would happen. In reality, they could very often do more than this, but it's a good example.

Starting up Front-End development

When your designs are done, it’s time to give them to your front-end developer. This developer can work in parallel with back-end development, but since the book has to be written linearly, we’re starting here.

What the front-end developer needs to do their job:

  • The Information Architecture - with explanations of features, pages, elements, etc.

  • Content - this is the text that goes on the page. Remember, web pages are built around content, not content around design!

  • Wireframes and/or Flows - so they can see what the page should look like

  • Style guide - so they know what different features should always look like and have consistency.

  • Project Plan - This is a set of deadlines and explanations of who will have what done when that the other team members need to progress. Remember, developers are optimists! Give them deadlines, but plan on them missing the deadlines by at least 20%. Project deadlines are set up as part of the Project Plan. More on this in the .

  • Management - With multiple team members doing different kinds of jobs and relying on one another, even the most experienced and responsible developer benefits greatly from help getting what they need from other team members and coordinating timelines so they are not waiting.

  • Regular Meetings & Communication - Even if everything is planned perfectly, there will be questions and things will change.

Saving Time

The more information a front-end developer has, the less they will come back to you with questions. This is where the flows, designs, and information architecture come in. The front-end developer will take these pieces of information and develop pages and views from this information and deliver them to you for review and revisions.

PROTIP: At each step down the process, the cost of making changes goes up. So get as much as possible finalized before coding begins. Changes during coding can crush an MVP build budget!

To make a front-end code change often takes a lot longer than making a change in a graphics editing system, like the one your UX designer is working with. So do all your designs there before getting into coding. In addition, making logic changes have far reaching effects, so make sure you’re happy with the system the front-end developer is doing BEFORE you hand it over to the back-end developer.

Managing your team section