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.
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:
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)
I’d throw away almost all of that and introduce TDD, CI/CD, SOLID, refactoring, design patterns, test automation and cloud architecture.
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?
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
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.
You don't really need that much for a minimalist to build prototypes.
Yes, I just threw out an incomplete idea.
Postman is good, thanks!
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.
Git cannot be your first lecture, they will throw themselves through the window.
Lol
clone, add, commit, push, and pull should be enough for starters I think :D
checkout branch, status and lastly merging which you can do it with UI.
Hahahaha
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.
Good points, thank you!
Throw out React and anything to do with it. Put semantic HTML back
Care to elaborate?
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.
They already had HTML/CSS in their webdesign course last semester
For minimum viable, throw away the bottom 2/3rds of the map, just after Package Managers... (just keep the top third).
Why you think the bottom 2/3 are not needed? :)
Because I have 32 years of experience :). I call bs on the industry.
Rich, please!!123
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.
Have you seen the schema like this but for business/system analysts?
Sadly no.
Only these: roadmap.sh/roadmaps