Web Engineering 🌐

Level 1

Mastery

Learns to write correct HTML and CSS following guidance and training materials

Learns to write correct JavaScript following guidance and training materials

Uses git to manage the development workflow effectivly

Examples

Checkout, Push, Pull, Branch, Diff, Merge, Stash, Rebase, etc.

Uses Chrome, React, and Redux DevTools effectively to increase productivity during development and debugging

Implements simple components

Fixes simple bugs

Asks questions and actions feedback from mentor

Impact

Delivers assigned tasks, working with a more senior team member, and able to take PR feedback to improve their work

Influence

Improves documentation that is incorrect

Communication & Feedback

Provides regular status updates to their mentor/buddy

Points out syntactical improvements in code reviews

Writes PR descriptions that provide basic context for the change

Seeks guidance from other engineers, rather than answers

Leadership

Level 2

Mastery

Writes correct HTML and CSS following accepted best practices

Writes correct JavaScript code following accepted best practices

Follows our JavaScript Coding Conventions & Best Practices; uses language-level primitives correctly

Implements simple components following accepted best practices

Follows React Development Conventions & Best Practices; uses component state and lifecycle methods correctly

Uses appropriate algorithms and data structures to solve problems

Writes Flow types to statically type-check the code at compile-time

Writes automated unit and end-to-end tests following accepted best practices

Deploys web services into staging and production following our deployment guidelines

Assists on the design of new features and components

Solves well-defined tasks within our current developer abstractions

Integrates with backend APIs and handles successful and failed responses properly

Uses shared libraries to reuse existing functionality

Examples

lib.money

lib.api

lib.identity-verification, etc.

Works with users to improve new and existing simple features iteratively

Applies fundamental UX principles to common problems such as forms design

Impact

Delivers assigned tasks that meet expected criteria

Works for the team, focuses on tasks that contribute to team goals

Tries to unblock themselves first before seeking help

Manages their own time effectively, prioritises their workload well, on time for meetings, aware when blocking others and unblocks

Helps the team, does what needs doing

Breaks down small/medium problems into iterative steps

Influence

Proactively raises issues they spot in retrospectives

Communication & Feedback

Proactively communicates to their team what they are working on, why, how it's going and what help they need

Accepts feedback graciously

Gives feedback to peers when asked

Provides helpful and actionable feedback in code reviews in an empathetic manner

Take a look at the levelling up your code reviews talk for some ideas

Writes PR descriptions that provide context and provide rationale for significant decisions

“I decided to X instead of Y here, I also considered Z but for these reasons I went with X”

Leadership

Level 3

Mastery

Writes effective JavaScript by applying fundamental functional and reactive principles and techniques where appropriate and guides others in so doing

Uses uses event streams, immutable data structures, pure functions, functional composition, memoization, etc.

Uses appropriate design patterns to solve problems

Writes effective asynchronous code

Demonstrates solid understanding of the JavaScript runtime; reasons effectively about the runtime behaviour of asynchronous code; uses async/await, generators and Redux-Saga’s to implement asynchronous code

Identifies obvious deficiencies in the development processes and supports activities to improve them

Assists more experiences engineers on the design of larger features

Modifies and improves code outside of the developer abstractions and reasons about the improvements effectively

Implements non-trivial components

Examples

Uses modern CSS features like flex-box, grid, media-queries, selectors, etc.

Uses advanced component patterns higher-order components, render props, controlled components, compound components

Fixes bugs in asynchronous code

Debugs production issues

Explains developer abstractions and how to contribute to them to other engineers

Collaborates with designers and user researchers to create prototypes and to evaluate them

Differentiates between user needs and desires and prioritises accordingly

Impact

Delivers large tasks and solves small scope problems, where a task is defined and a problem is not

Contributes to writing RFCs (Co-authors with more experienced Engineer)

Breaks down large problems into smaller iterative steps across multiple PRs

Influence

Provides valuable input to RFCs from their team

Proactively improves modules, services, systems and codebases they encounter, 'this doesn't make sense, I'm going to do something about it'

Contributes to scaling engineering hiring (e.g. leads calls, does onsite interviews)

Builds simple tools or iterates existing tools for the benefit of all engineers

Communication & Feedback

Transparent about mistakes they've made, early

Proactively gives timely actionable feedback to peers

Proactively seeks feedback from the people around them

Considers the opinions of others before defending their own

Leadership

Onboards / mentors new engineers

Finds learning opportunities for others when reviewing their code and follows it up

“I think this code could be improved by doing X, let’s pair on it and I’ll talk through why X is good for this”

Level 4

Mastery

Writes code that serves as a definitive example for new engineers

Makes contributions to library code or other core parts of the applications

Makes contributions to our development tools and build processes

Writes complex asynchronous and concurrent code

Identifies optimisation opportunities in the development process and contributes to the implementation of proposed solutions

Builds maintainable and flexible components and applications

Leads the refactoring of complex parts of the system

Debugs and fixes complex issues at speed

Identifies and fixes security weaknesses

Identifies and fixes performance bottlenecks in applications

Explains all aspects of the web platform to new engineers

Implements services or libraries that require a deep level of domain knowledge

Puts users first and can manage competing priorities effectively

Impact

Solves ambiguous problems

Leads writing small/medium scope RFCs

Thrown at fires and resolves / contributes heavily to resolving them

Makes pragmatic choices about taking on tech debt

Considers multiple different solutions for solving a problem

Breaks down projects into smaller iterative steps that each deliver value

Influence

Positively influences engineers in the wider org

Maintains documentation on things they know the most, makes it easy for future engineers to interact with systems/code

Clears blockers for junior team members, provides context/guidance, or knows how to escalate

Asks why. Does not take truths for granted unless they understand exactly where they are coming from (especially wrt regulation, compliance, etc)

Drives changes to engineering practices with well-reasoned arguments and a "strong opinion, weakly held" mentality

Shapes the direction of systems designs with less experienced engineers

Breaks down delivery and knowledge silos in their squad

Communication & Feedback

Proactively gives feedback "upwards" and to people they interact with who are not in their team

Transparent in making design and technical decisions

Helps people in non-technical roles understand technical constraints / trade-offs

Shares technical context and direction for less experienced engineers

Gives direct and constructive feedback to other engineers

Leadership

Contributes to maintaining the Monzo culture in their team, helping new joiners

Gets buy-in on technical decision-making and proposed designs

Proactively involves other relevant engineers

Sought out for code reviews

Instils Monzo engineering principles in other engineers

Helps the growth of engineers around them through coaching and mentoring

Helps their squad work together more effectively

Helps facilitate team/squad rituals

Makes improvements to modules/libraries/services and goes out of their way to help others learn from it

“I’ve used RxJava for the first time here, I’m going to do a talk about why I’ve done this, here’s some great blog posts on it”

Level 5

Mastery

Makes major contributions to library code or core parts of the application

Contributes to external technologies or libraries that we depend on

Anticipates platform and project needs, technical debt and common issues intuitively

Develops clear technical solutions from ambiguous requirements

Produces technical designs for large complex projects

Uncovers and fixes tricky bugs that have previously evaded detection

Demonstrates a deep level of knowledge in a specific area

Serves as a technical authority on a technology or an area of the codebase

Reviews technical designs and pull requests for large complex projects

Encourages and supports other engineers to achieve outstanding results

Creates major contributions to our documentation, and creates documents that provide guidelines and best practices to other engineers

Works with technical and non-technical stakeholders to identify high-level requirements and turns them into discrete technical concerns

Impact

Solves the 'hard problem' in a project e.g. Mastercard crypto and sees it through to resolution

Solves larger ambiguous problems

Leads incident resolutions

Makes judgements about when to diverge from the immediate goal to achieve something else

Leading large scale technical infrastructure projects (level 5 would originate or complete, probably)

Leads writing large scope RFCs

Breaks down large long-lasting projects into sensible discrete chunks that compound to achieve a large goal

Helps prioritise and balance short-term and long-term investments, focusing on high impact, high value work

Influence

Represents Monzo at conferences/events

Given as reason for other engineers to join Monzo

Proactively shares knowledge internally

Acts as the 'sole proprietor', in the CEO mindset, their ego/agenda is not a factor in their thinking or decision making

Communication & Feedback

Helps other people develop themselves and regularly gives insightful, useful feedback to those around them.

Talks to non-technical stakeholders on appropriate level of abstraction

Leadership

Instils Monzo engineering principles across a whole squad of engineers

Works with relevant Engineering Managers to help other engineers perform and grow

Fosters effective collaboration in multi-disciplinary squads (backend, mobile, data, design, web)

Delegates technical decisions with low risk and high reversibility

Owns technical decisions with high risk and low reversibility

Contributes to maintaining the Monzo culture in the wider company

Bootstraps new teams

Level 6

Mastery

Makes major contributions to technologies and libraries that we depend on

Uses a risk-based approach and manages technical debt systematically to focus the team’s design and development efforts on the most important problems

Works with business and technology stakeholder to translate difficult business problems into technical designs, thereby ensuring that the organisation derives maximum value from services

Identifies architecturally significant functional and non-functional requirements, identifies conflicts among them, and defines possible trade-offs scenarios

Articulates high-level technical goals, concerns, trade-offs, and decisions to the rest of the company effectively

Facilitates technical decision making in complex and ambiguous situations

Promotes architectural thinking and good engineering practices at scale

Makes improvements that affect important non-functional requirements that have an effect on the entire web-platform

Serves as a technical authority in the wider engineering community

Identifies and explores opportunities for service and business improvement

Impact

Accountable for delivery of large, mission critical engineering projects

Originates or finishes large, horizontal engineering efforts

Influence

Attracts other very senior hires

Engineers around them get better and have a bigger impact, faster

Communication & Feedback

Transparent about feedback they have received and what they are going to do differently

Leadership

Helps groups of squads work together more effectively

Starts things that they cannot finish by themselves

Delegates to make better use of their time