The other day, on Twitter, Angie Jones posted a very interesting poll about whether a full stack web developer would start writing a feature on the frontend or the backend.
Fullstack devs, which part of the stack do you typically code first?— Angie Jones (@techgirl1908) August 28, 2020
Interestingly most people responded that they would start on the backend code, which is also my preference. For me, I prefer to mock up the UI quickly on paper to get an idea of what’s needed, then write the backend, then write the frontend.
Either way, I think it’s interesting to see the pros and cons of each approach, so let’s start with the frontend.
Starting on the Frontend
To be clear, we’re talking about writing the HTML/CSS/JS to display your feature on a page.
1. Clarify your ideas
People mentioned being able to clarify the idea for what is needed. When you write the frontend, you will quickly get a very precise idea of exactly what data is going to be needed. This will clarify what database records you need, or what API calls you need, or if you need something new!
2. Deal with frontend uncertainties sooner
The frontend in web development can be a bit of a mess, with various browser differences and a large number of tools/dependencies that might be in use. It can be very useful to get those parts out of the way as quickly as possible.
Starting on the backend
1. Develop in peace
If you have trouble getting started, the backend can be a great place to start. Everything in that sandbox is usually under your control as the developer, so it may be easier to make progress.
2. You can always come back
Again, the generally controlled nature of the backend means that it’s easier to come back to the backend for tweaks if you realize something is missing as you develop the frontend later.
All in all, it’s really not an either-or proposition. Some repliers, like Martin Fowler, mentioned deciding based on where they felt there was the most uncertainty. I practice a version where I mock up the frontend first, then do the backend, then frontend. There’s no hard and fast rule to follow, especially since so much coding is exploratory.