DEV Community

K
K

Posted on

MVD: The Minimal Viable Developer

A few weeks ago I wrote that I will be teaching designers frontend development at a university this year.

I asked for your opinions on how to teach frontend development in 2020, and the answers were good but also fairly widespread.

I think, the problem was mostly, that frontend development is a wide field and becoming a proficient developer in any field requires months, if not years of time investment.

I invested that time and IT and development are now my main source of income, but I also think that anyone could use some dev skills even if they don't make it their main job.

Designers, marketers, business administrators, you name it.

These people already spend most of their time getting good at the core skills, they don't have years to become a full-blown developer.

So my idea was to define a skill set for The Minimal Viable Developer.

By no means is this a finished idea, I'm just throwing this out to get your opinions in hopes to improve it.

These MVDs could come in different flavors and the one I'll start with is the Frontend MVD.

An FMVD should be able to create frontend software that has prototype quality. Something that works and could be improved upon by a regular frontend developer or by the FMVD if they become more skilled in the future. So it shouldn't be perfect, but it should also not be a complete disaster of copy-pasted StackOverflow answers :D

I thought a stripped-down version of the Frontend Developer Roadmap would be a good start.

Roadmap

To fire up the discussion: What would you throw out?

I think, all the non-purple stuff could go right away, which removes almost half of that roadmap.

Sometimes they list multiple points with purple marks, I don't know if it's better to use the simplest solution here (for example Parcel instead of Webpack) or the most mainstream (npm instead of yarn), etc.

Would also be worth considering if some CSS things could be left out. Wouldn't Grid and Flexbox be enough for starters?

So this is what my version would look like:

Stripped-down Roadmap

On the other hand: What would you add?

This roadmap is rather technology-heavy, some concepts (DRY, KISS, SOLID) could be a good idea.

Anyway, I'm curious what you think :)

Top comments (23)

Collapse
 
drm317 profile image
Daniel Marlow

I’d throw away almost all of that and introduce TDD, CI/CD, SOLID, refactoring, design patterns, test automation and cloud architecture.

Collapse
 
kayis profile image
K

Sounds good.

If you think about a usual small-ish project, what are the things you do from start to finish?

I mean, obviously the three steps are "planning/designing - implementing - maintaining" that are iterated over multiple times in the lifecycle of a project, but what do you do in these phases?

Collapse
 
drm317 profile image
Daniel Marlow

Planning
Prototyping, exploratory testing (A/B etc), UX, customer feedback and analytics.

Implementing
Clean coding, TDD, CI/CD, test automation, refactoring

Maintaining
Refactoring, logging, alerting, analytics, automation

Collapse
 
steelwolf180 profile image
Max Ong Zong Bao

Funny there is nothing in working or using with design software like Sketch, Figma, Invision, Adobe XD.

I think these might make more sense for MFD.

  • git
  • HTML
  • CSS
    • CSS3
    • CSS Grid
  • JavaScript
    • ES6
    • Typescript
  • Using templates like creativetim
    • bootstrap v4
    • frontend web technology
  • APIs
    • API basics
    • OpenAPI 3
    • Postman
    • GraphQL

You don't really need that much for a minimalist to build prototypes.

Collapse
 
kayis profile image
K

Yes, I just threw out an incomplete idea.

Postman is good, thanks!

Collapse
 
steelwolf180 profile image
Max Ong Zong Bao

I would suggest the use of UI/UX design software to build and test out the initial front end before development can be started.

Most or all contain some form of developer handoff with design systems.

That provide you the ground work to just customise the various components.

Collapse
 
diek profile image
diek

Git cannot be your first lecture, they will throw themselves through the window.

Collapse
 
kayis profile image
K

Lol

clone, add, commit, push, and pull should be enough for starters I think :D

Thread Thread
 
steelwolf180 profile image
Max Ong Zong Bao

checkout branch, status and lastly merging which you can do it with UI.

Collapse
 
steelwolf180 profile image
Max Ong Zong Bao

Hahahaha

Collapse
 
kaykleinvogel profile image
Kay Kleinvogel • Edited

This is my opinion for the frontend part.
As you'd like to have developers who can create MVPs I'd stop right after git. With this they have all the coding basics they'll need. I'm always surprised just how much web development you can get done with just HTML, CSS and vanilla JS (so no JS-frameworks like angular, react, vue).

But I wouldn't start with coding right away. Let them play with design tools like XD, Sketch or Figma. There they can learn how to design interfaces without the confusion of code. It also allows them to make clickable prototypes super fast (which is an awesome feeling when you see everything come together). This is also the right place to introduce them to basic design concepts like alignment, typography, contrast, color theory, ...
Those concepts might be a little bit more than "MVP" but alignment is still important in this stage.

Then you can start with the coding and all the things that are mentioned here like TDD, CI/CD, ...


So for me, the "perfect" plan would be.

  1. Design Basics
  2. building an interactive prototype with a design tool
  3. code the prototype (from Step 2)
  4. user testing and feedback
Collapse
 
kayis profile image
K

Good points, thank you!

Collapse
 
jonrandy profile image
Jon Randy 🎖️

Throw out React and anything to do with it. Put semantic HTML back

Collapse
 
kayis profile image
K

Care to elaborate?

Collapse
 
niorad profile image
Antonio Radovcic

Without knowing very much about the course you're going to teach, I assume it's one semester, once a week? If yes, that's how my (very good) web-design-class at Design-Uni was, and it only taught HTML & CSS. Seeing your second chart it feels like a lot to tackle in one semester. From the gut I'd only do the middle part. HTML/CSS/JS and everything that's attached looks very good. The rest, maybe in one day just quickly explained for the curious.

Collapse
 
kayis profile image
K

They already had HTML/CSS in their webdesign course last semester

Collapse
 
kucerarichard profile image
Rich Kucera

For minimum viable, throw away the bottom 2/3rds of the map, just after Package Managers... (just keep the top third).

Collapse
 
kayis profile image
K

Why you think the bottom 2/3 are not needed? :)

Collapse
 
kucerarichard profile image
Rich Kucera

Because I have 32 years of experience :). I call bs on the industry.

Thread Thread
 
kayis profile image
K

Rich, please!!123

Thread Thread
 
kucerarichard profile image
Rich Kucera

Ok ok... it’s just that I find of all the sh*t that floats downstream to maintainers after the authors of the mischief have moved on to other prospects those heaps laden with best practices are the most pungent.

Collapse
 
pafnut profile image
Pafnut

Have you seen the schema like this but for business/system analysts?

Collapse
 
kayis profile image
K

Sadly no.

Only these: roadmap.sh/roadmaps