Cloud Is In Three Of These Roles. React Is In One.
Five roles, five coloured boxes, same size, same weight, five or six icons each. Front-end, Back-end, Full Stack, DevOps, Data Engineer. The caption asks the right question – which tech role are you planning for? – and the card looks like five equally-sized answers.
Do one thing with it that it does not ask you to do: count how many boxes each skill appears in.
Cloud is in three of the five. Full Stack, DevOps, Data Engineer. SQL is in two – Back-end and Data Engineer – and arguably three, since Full Stack lists “Database”. Docker is in two: Back-end and DevOps. Git is in two: Front-end and Back-end.
And everything else appears exactly once. React, once. Terraform, once. Spark, once. Spring Boot, once. Kubernetes, once.
That count is the most useful thing on the card and nobody prints it, because the grid cannot. It tells you which skills travel and which ones commit you – and if you have not decided which of the five you want yet, which is most people reading a card like this, that is the only sorting that matters.
The card this post is about
Watch the original reel: “Popular tech roles & key skills to learn”
Five roles, footed “Roles and tools vary by company and change over time. Use this as a guide, not a rule.” The tables below reproduce every box as printed.
What travels, and what locks you in
Here is the whole card re-sorted by count rather than by role. Read the last column.
Diagram: counted by how many roles each skill serves
| Appears in | Skill | Which roles | What that means for you |
|---|---|---|---|
| 3 of 5 | Cloud | Full Stack, DevOps, Data Engineer | The single most transferable thing on the card. Learn it and three of the five doors stay open |
| 2 of 5 | SQL (3 if you count “Database”) | Back-end, Data Engineer | Cheap to learn, hard to outgrow. Almost nothing you build later will not touch it |
| 2 of 5 | Docker | Back-end, DevOps | The bridge between writing code and running it. Learning it moves you toward two roles at once |
| 2 of 5 | Git | Front-end, Back-end | Really 5 of 5. The card prints it twice because it ran out of room, not because DevOps and Data skip it |
| 1 of 5 | HTML, CSS, JavaScript, TypeScript, React | Front-end only | A real path, and a committing one. These five are the deepest single-role stack on the card |
| 1 of 5 | Java, Spring Boot, APIs | Back-end only | One opinionated choice. Back-end could as easily be Node, Python, Go or C#. See the caveats |
| 1 of 5 | Kubernetes, CI/CD, Linux, Terraform | DevOps only | The most self-contained box. Little of it helps you if you later switch to front-end |
| 1 of 5 | Python, Spark, ETL, Data Warehouse | Data Engineer only | Python is the exception here – it travels far beyond this box in the real world, even though the card uses it once |
The practical reading is simple. If you already know which role you want, start in your box. If you do not – and the caption’s own question suggests most readers do not – start at the top of that table and work down. Cloud, SQL, Docker and Git cost you a few weeks and cost you nothing in optionality, because every one of them is still useful whichever box you end up in.
React costs you the same few weeks and only pays off in one box. That is not an argument against React. It is an argument about order.
The five boxes, and what each list really is
Column 2 is the card’s own content, unedited. The interesting column is the third one, because the five boxes are not all the same kind of list.
| Role (card’s own box) | The skills, as printed | What kind of list it is | Our note – checked 9 October 2026 |
|---|---|---|---|
| 1. Front-end Developer | HTML · CSS · JavaScript · TypeScript (optional) · React · Git | A stack you climb in order | The only “optional” on the whole card is here. Everything else across all five boxes is printed as equally required, which cannot be true. React is one of several front-end frameworks – the card picks it without saying it is a pick |
| 2. Back-end Developer | Java · Spring Boot · SQL · APIs · Docker · Git | One language choice, then its ecosystem | Java + Spring Boot is one opinionated route presented as “the” back end. Node, Python, Go, C# and PHP all lead to the same job. Note “APIs” is a concept, not a technology, sitting among five technologies |
| 3. Full Stack Developer | Front-end · Back-end · Database · Cloud · Deploy | A pointer, not a skill list | Four of these five are categories, not technologies – and two of them are boxes 1 and 2. This box is the other two boxes plus deployment. Same rectangle, roughly double the work |
| 4. DevOps Engineer | Docker · Kubernetes · CI/CD · Linux · Cloud · Terraform | A coherent, self-contained discipline | The tightest box on the card – every entry genuinely belongs and they build on each other. Also the box that shares least with boxes 1 and 2 |
| 5. Data Engineer | Python · SQL · Spark · ETL · Data Warehouse · Cloud | Pipelines, not analysis | “ETL” and “Data Warehouse” are concepts rather than products, like “APIs” above. Worth knowing this box is data engineering, not data science – no statistics, no modelling, no notebooks |
Box three is the other two boxes
This deserves its own section because it is the box most people point at.
Boxes 1, 2, 4 and 5 list technologies – things you install, open and type into. HTML, Java, Kubernetes, Spark. Box 3 lists Front-end, Back-end, Database, Cloud, Deploy. Four of those five are categories, and two of them are literally the names of boxes 1 and 2.
So the card is accidentally telling the truth: full stack is not a sixth path. It is boxes 1 and 2, plus deployment. That is roughly twice the material of either one.
And the format hides it completely. Five rectangles, identical size, identical icon count, stacked down the page as peers. Nothing in the picture can say “this one is twice as long as the one above it”, so the picture says they are the same. A beginner reading it as a menu will reasonably conclude that full stack is one choice among five of equal cost, which is the single most expensive misreading available on this card.
This is the same thing we found looking at a front-end and back-end map where the two columns did not read the same way – one was a ladder you climb in order, the other was a single choice that filled in three boxes by itself. Equal-looking panels almost never contain equal amounts of work.
So what do you actually learn first?
Take the counting seriously and a sequence falls out. It is not the sequence the card implies – which is “pick a box, start at its left edge” – and it costs you nothing if you change your mind in month three.
| Order | What you learn | Why here | Which doors it keeps open | The point of no return |
|---|---|---|---|---|
| 1 | Git | Every box uses it. The card prints it twice and should have printed it five times | All five | None. Nobody has ever regretted this |
| 2 | SQL | Two boxes name it, a third calls it “Database”. Learnable in a fortnight | Back-end, Data, Full Stack | None |
| 3 | One language, properly – Python or JavaScript | You need somewhere to put the logic. Both of these appear on the card and both travel widely | Python → Data, Back-end. JavaScript → Front-end, Back-end | Small. The second language always costs far less than the first |
| 4 | Docker, then Cloud | Docker is in two boxes, Cloud is in three. Together they are the most transferable pair on the card | Back-end, DevOps, Data, Full Stack | None |
| 5 | Now pick a box | By this point you have met enough of the work to choose on evidence rather than on a card | — | This is the commitment. React, Terraform and Spark each pay off in exactly one box |
The whole point of that order is step five. You defer the committing decision until you have actually touched the work, and you pay nothing for the delay, because steps one to four were going to be useful whichever box you landed in.
Compare that with the card’s implied order – choose a box on day one from five pictures, then learn six things specific to it. If you choose wrong, four of those six do not transfer. We made the same argument about picking a language: the question is not which to learn first, it is what you want to have built.
Four honest caveats
The footer is the best sentence on the card. “Roles and tools vary by company and change over time. Use this as a guide, not a rule.” That is exactly right, and it pre-empts most of what we could say. Our quarrel is not with the card’s honesty – it is with what five equal rectangles communicate regardless of the text underneath them.
We counted the card, not the industry. Cloud appearing three times is a fact about this picture. In real job descriptions Git appears in all five roles, Linux shows up far beyond DevOps, and Python turns up in back-end work constantly. The counting method is sound; the underlying data is one card. Treat it as a strong hint, not a survey.
The role boxes are one company’s shape. Java and Spring Boot are a perfectly good back end and so are five other stacks. React is one of several front-end frameworks. “Data Engineer” here means pipelines, not analysis – someone wanting to do modelling and statistics is looking at a sixth box that is not on the card. The footer says as much.
And this is a 2026 card about skills, written while the floor is moving. AI assistants have made the syntax of all five boxes dramatically cheaper and have not touched the architecture of any of them. That changes what “learn React” costs, not what knowing when to use it is worth – the same split we worked through in a post on what a difficulty tier is actually measuring.
The one-line version
Cloud is in three of the five boxes. SQL, Docker and Git are in two. Everything else is in one. That count is a learning order, and it is free, and the card contains it without printing it.
So if you know which role you want, start in your box. If you do not, start with what appears in the most boxes – Git, SQL, a language, Docker, Cloud – and make the committing choice in month three, on evidence, instead of in minute one, on a picture.
And remember what box three actually says. Full Stack lists “Front-end” and “Back-end” as two of its five items, which means it is not a fifth of the card – it is two-fifths of the card in one rectangle. Five equal boxes, and one of them contains two of the others.
Learning a lot does not make anyone good. Doing a lot does. Five boxes of logos is a map; the first thing you build with Git and SQL is a mile.
If you want to be held to that, we run a free challenge at BANI Academy. There is no barrier to entry – you commit a small fee that is refunded when you finish, and the only requirement is that you actually do the work for the length of the challenge.
Which box were you planning on – and had you noticed how much of it overlaps with the box next to it? Tell us in the comments under the original reel.
More on building a channel for a global audience at mmoyoutube.com.
