Adam L Barrett PRO
Adam L Barrett is a JavaScript and Front-End consultant, a contributor to open source, and avid bike-shedder.
Front to Back
adamlbarrett.bsky.social
BigAB
Never Back to Front
Software Development
Big Companies and Small
PEBCAK
Front to Back
Never Back to Front
Never
Back
to Front
AWS Console
Submit to whom?
The button with the text "submit", though a known design anti-pattern, is so common that people have no problem with it, but it is still a good example of how thinking of the implementation works its way forward to the User Experience
So how do we do this?
(the whole front-to-back thing)
Ask yourself...
- What can the user see?
- What can the user do?
What can the user see?
Where can I get the info I need?
What can the user do?
What are all the different interactions?
UI Events
User Interactions
System Actions
❓
{}class Cart {
addProduct(product, quantity = 1) {/*...*/}
removeProduct(product) {/*...*/}
changeQuantity(product, quantity) {/*...*/}
addPromotionCode(code) {/*...*/}
subscribe(callback) {/*...*/}
get data() {/*...*/}
}
What can the user see?
What can the user do?
What data do I need?
What actions can I take?
What data do they need?
When designing modules try and remember the 80/20 rule of design. Cover the most common actions with direct functions or methods, but possible allow for more complicated actions too
What actions can they take?
export function addCourseToSchedule {
/*..*/
}
export function beginCourse {
/*..*/
}
export function abandonCourse {
/*..*/
}
export function singUpForWaitingList {
/*..*/
}
Behaviour Driven Development
(BDD)
Documentation Driven Development
(DDD)
What data do they need?
What actions can they take?
- List of Houses
- Available Filters
- Agent info
- change filters
- see house details
- contact agent
Your REST APIs don't have to mirror your DB tables....
Think before coding...
Front-To-Back
- Consumer First Thinking
- What data do you need?
- What actions can you take?
Front to Back
adamlbarrett.bsky.social
BigAB
Never Back to Front
Front to Back, Never Back to Front
By Adam L Barrett
Front to Back, Never Back to Front
When you're just starting out, often web dev classes and tutorials start with "design a schema". This one, tiny mistake may be the root cause of billions of dollars lost, time wasted, and unnecessary complexity embedded in countless applications The problem: coding "back-to-front" Let me show you how the simple idea of coding "front-to-back" can reduce complexity, increase security, and help keep your codebase performant and maintainable
