WebDev/Digital Tutorial 

A Front End Development Course used in 2015, updated up to 2021, 100% free to use 

Course #1: Intro & HTML 

(week 1) 

Introduction to Front End Development 

How the Web works: HTTP, packets, browsers, developer tools, etc. 
What is a web page? How does the browser work? How can I see web page info? 
» Start here: R
​ esilient web design book​ (​ ​mandatory​)​ & H
​ ow does the Web work? 
That resource is relatively large for what we need to get into, so focus on these links: 
» ​Don’t fear the Internet: the basics​ & H
​ ow does the Internet work: Naked Science Scrapbook 
» ​The Odin Project - Web Development 101​ (NEW) 
» ​A packet’s tale: World Science Festival 
» ​HTTP basics​ - part of ​http://cs50.tv/2017/fall/​ + H
​ ow HTTPS works​ (NEW) 
» ​Don’t fear the Internet: browser 
» ​How the Web works for developers: Part 1 – Overview & Front End​ (​mandatory​) 
» ​How the Web works for developers: Part 2 – Servers & Scaling​ (​mandatory​) 

Information architecture basics 

You will need to grasp the basics of a field which has been around much longer than the Web itself, 
but which serves as a base to how we write HTML and how we navigate and search online. It’s a 
complex field, rooted in the craft of librarians of old, that needed to devise smart ways to describe and 
organize information / books, and you will just need to skim through it so you get a good 
understanding of what it means to describe, arrange and provide access to information in general. 
» ​Understanding Information Architecture​ (​mandatory​) 
» Book: I​ nformation Architecture for the WWW​, chapters 1–9. 
» Book: A ​ practical guide to Information Architecture​: all of it.​ (​skim through at least 1 book​) 

Introduction to HTML 
A brief history of HTML 
Knowing the basic evolution of HTML will allow you to appreciate where we are now and how long 
we’ve come since the early days of the Web. 
» Book: H
​ TML5 for Web Designers​, chapter 1, or ​A brief history of markup on A List Apart 

HTML step by step 

There are some great online tutorials for the basics of HTML​ (​mandatory, at least 1-2 – HTML only​)​: 
» ​Learn HTML/CSS: Shay Howe 
» ​CodeSchool Web Path 
» ​Khan Academy Web Programming 
» ​Washington.edu course on HTML 
Notice that most of these (free) tutorials also have a CSS component. You can try going through the 
CSS now to make it easier for you next week, but for now I ​strongly​ recommend you focus on the 
HTML part. That will allow you to get all these tutorials done in time, so you get a firm understanding 
of HTML this week. You’ll need it! You’ll also need: 

A full HTML reference 

» ​Mozilla Developer Network: HTML reference​ (​mandatory​)​ (this site is e
​ xtremely​ valuable!) 
Course #2: CSS & SFX 
(week 2) 

Introduction to CSS 
HTML+CSS tutorials 
The exact same tutorials mentioned in Course #2​ (​mandatory, at least 2 – HTML + CSS​):​  
» ​Learn HTML/CSS: Shay Howe​ / ​CodeSchool Web Path​ / ​Khan Academy Web Programming 
» ​The Odin Project: HTML and CSS​ (NEW) 

CSS+Layout tutorials 
» ​Washington.edu course on CSS 
» ​Learn Layout​ (​mandatory​) 
» HTMLDog: ​Beginner CSS tutorial​, I​ ntermediate CSS tutorial​, A
​ dvanced CSS tutorial 
 

CSS articles, tools and information 

» ​Calculating CSS Specificity​ / ​Specificity calculator​ (​ ​mandatory​) 
» ​The CSS “homepage”​ / ​CSS: Designing for the Web 
» ​Dev.to - explain CSS selectors in plain English 
» ​CSS Zen Garden​ (​mandatory​) 
» ​Solve most of IE’s bugs​ / ​Grid for layout, Flexbox for components​ (NEW) 
» ​An introduction to browser rendering​ (​mandatory​)​ You’ll need C ​ hrome Canary​ to play with this. 
» ​Mozilla Developer Network CSS Info 

A full CSS (and HTML / Accessibility / etc.) reference 

» ​Mozilla Developer Network: CSS reference​ (​mandatory​) 
» ​A complete guide to CSS functions​ (NEW)​ / M
​ odern CSS solutions for old CSS problems​ (​ NEW) 
» ​Relearn CSS layout​ (NEW) 
 

An example (S)CSS standard 

» A living document describing how we aim to write all of our styles: ​SASS Standards​ (​mandatory​) 

Special effects using CSS3 / Fonts (soon to be deprecated) 

As a general rule, from now on you should try to explore every cool site you see, inspecting its CSS and 
element distribution with your favorite browser inspection tool (Firebug for Firefox, the built-in 
inspector from Chrome). Some of them are done right, some of them aren’t, but the point is you need 
a “hacker attitude” in order to steal the interesting parts and become versed in the ways of 
deconstructing someone else’s design in order to find out how it works. 

Effects and tutorials 

» ​Codrops​ (I recommend subscribing to this resource, it’s one of the best) 
» ​CSS-Tricks CSS Snippets 
» ​Magic animations​ / ​Hover effects​ / ​Hovers​ / E
​ ffekts​ / ​Box​ / ​Advanced animations​ (NEW) 
» ​CanIUse​ – Use this to check in what browsers are some features supported, e.g. ​CSS Grid 
» ​CSS3 gradient generator​ – Use this to generate gradients of any kind for CSS backgrounds 

Icon fonts 
» ​Why IconFonts are great​ / Iconfont generator: I​ coMoon​ / Iconfont kit: ​FontAwesome 
Course #3: Your first project – a quiz 
(weeks 3-4) 

Tools of the trade: WebStorm, GIT, FTP 

Until now, you’ve been exploring front end development mostly in browser-based applications. Now 
it’s time for the real deal. We’ll set up your GIT account so you have full source control (while also 
teaching you how it works). We’ll then set up your IDE (ideally, WebStorm) so you have full access to 
its numerous helpful features, and get you acquainted with some of them. For people taking this 
course from home / their spare time, obvious alternatives will be explained. 

Version Control clients & services  IDEs 

» ​GitHub​ / ​SourceTree​ / ​Tortoise SVN  »V
​ isual Studio Code​ (free and surprisingly good) 
»W​ ebStorm​ (paid) / ​Sublime​ or B
​ rackets​ (free) 
Using Version Control 
»O ​ nline editors (for testing only) 
» ​GIT for beginners 
» ​GIT (GitHub + SourceTree) tutorial  FTP clients 
» ​GIT with WebStorm  »F
​ ileZilla 
» ​Using the terminal​ (NEW)  »T​ otal Commander​ / C
​ oreFTP 

Semantics, Standards & Validation for HTML/CSS 

Standards & Validation 
Standards! Highly important, even though a page “works without them”. The truth is, it doesn’t, not 
in the way we want it to: extensible, easy to debug, with a much lowered bug threshold than a 
non-standards-compliant version. Please read through all these materials carefully, because this is 
one of the most important things you need to grasp at this stage. 
» ​Washington Edu lesson in Standards 
» ​What are web standards and why should I use them?​ (​mandatory​) 
» Book: D
​ esigning with web standards​, all of it. 
» ​W3C HTML Validator​ / W​ 3C CSS Validator 
» Washington.edu courses on: W ​ eb Standards and Accessible Design​ + ​Quality Control 
» ​Why Semantic Search is important​, from Ahrefs (NEW) 

Semantics 
» ​Let’s talk about semantics​ / ​Pursuing semantic value​ (​mandatory​) 
» ​Introduction to the semantic web​ / ​Semantic code: What? Why? How? 
» ​HTML5 semantics from Smashing Magazine 
» ​Diving into HTML5 
» ​Microformats primer - Sitepoint​ (​mandatory​) 
» ​Google Structured Data Intro​ (​mandatory​) + ​Google Structured Data Examples​ (​mandatory​) 
» ​Get started with Microformats​ & ​Microformats v2 

Mobile-first Responsive Design (​everything​ is ​mandatory​) 

» Book: R ​ esponsive web design​, all. Plus ​Ethan Marcotte’s articles on A List Apart​. Mostly ​this one​! 
» Book: M ​ obile first​, all of it. Plus ​Luke Wroblewski’s interesting presentations​. Most of them... 
» ​Scaling User Interfaces​ / ​Creating a mobile-first responsive web design​ / R ​ esponsive Design is… 
» ​RWD Tutorials​ / B ​ uilding a better responsive website 
» A f​ ull list of devices and their resolutions​ / ​Device agnostic breakpoints​ / ​State of the Web 
N
​ atural responsive web design breakpoints​ / ​Re-thinking breakpoints in responsive design 
» ​I have no idea what the hell I am doing 
Course #4: Real world problems 
(​midterm exam​ + weeks 5-7) 

Accessibility 
» ​Accessibility link list from WASP 
» ​W3C Accessibility Standards 
» ​Accessible forms​ (all levels) + ​Sign-in form best practices​ (NEW) 
» ​Easy checks: a fast review of web accessibility​ (​mandatory​) 
» ​Introduction to ARIA​ (NEW) 
» ​Website accessibility report generator 
» ​Just Ask: Integrating Accessibility Throughout Design​ (​mandatory​) 
» ​Other accessibility tools 
» ​How a CSS framework can enforce accessibility 
» ​Derek Featherstone Web Accessibility primer 
» ​13 days of Accessibility by Sparkbox 
» ​Official Web Content Accessibility Guidelines documentation 
» The new 2020 ​US Government Digital Design System​ that includes accessibility principles 
» ​A very nifty tabindex enhancing primer for navigation​ (NEW) 

Usability / UX (aka Advanced Common Sense) 

» Book: D ​ on’t make me think​, all of it.​ (​mandatory​) 
» ​Jacob Nielsen’s Usability 101​ (​mandatory​) 
» ​Jacob Nielsen’s 10 Rules of Thumb for Usability​ (​mandatory​) 
» If you have time, explore more of ​NNGroup’s excellent articles​, since they’re the best out there. 
» ​Usability basics from Usability.org 
» ​Making the web more inclusive and usable from Usability.com.ua 
» ​Principles of website usability 
» ​25 point usability checklist​ / Y
​ et another checklist 
» ​Laws of UX​ (NEW) / U ​ X Knowledge Base​ (NEW) / ​How to make sense of any mess​ (NEW) / ​List​ (new) 
» One of the best and easiest to understand indexes of studies on usability: (NEW) 
g
​ ov.co.uk​ and their ​Design Principles​ are great reads! Also, ​Nielsen Norman Group’s heuristics​. 

I have a design. Now what? (Photoshop 101) 

We will now learn how to transform a Photoshop document into an HTML layout. That means you will 
need to grasp a basic understanding of Photoshop tools for selecting, measuring and properties, 
which will then help you structure your HTML and define your CSS styles. 
Please note that in all these tutorials you’ll find mistakes. And you’ll notice them only if you’ve paid 
close attention to the standards, semantics, usability and accessibility notions presented so far. When 
you do, please correct them as you see fit, or ask me whether something is correct or not. 
» ​PSD to HTML tutorial​ (​mandatory​) 
» ​PSD​ to H
​ TML​ video series p ​ art 0​, p
​ art 1​, p
​ art 2​, ​part 3​, p
​ art 4​, p
​ art 5​, p
​ art 6​, p
​ art 7​ (​mandatory​) 
» ​PSD to HTML​ Tuts+ Video 
» ​PSD to HTML​ Tuts+ Text 
» PSD to HTML: C ​ ode a clean business website design 
» PSD to HTML: B ​ uild a sleek portfolio site from scratch 
Please note that we’ll be doing a quick demo of how to turn a Photoshop layout into a fully-fledged 
HTML + CSS site during this course, in our first workshop. 
 
By the way, here’s a ​Photoshop Shortcuts Cheat sheet​. 
   
Course #5: Your final project 
(weeks 8-10 + ​final exam​) 

SASS magic 
CSS is powerful, but not dynamic. To make it dynamic, you need SASS. 
» ​Official SASS guide​ (​mandatory​) 
» ​Learn SASS in 20 min​ (​mandatory​) 
» ​Getting started with SASS 
» ​A List Apart: Getting started with SASS​ (​mandatory​) 
» ​The beginner’s guide to SASS​ & ​SASS CodeSchool tutorial 

Templating basics 
Until now, we’ve looked at static HTML and CSS projects and how to develop a working site. Now we’ll 
take that to the next level, by exploring how to transform a static structure into a real, dynamic 
website, with real information stored in a database and dynamic structures for iterating, searching 
and navigating the site. 
These are all example templating engines or languages. None (except Angular) are mandatory, but 
you should read through at least a couple of them to understand the basic principles. 
» ​Handlebars​ (JS) 
» ​Mustache​ (JS) 
» ​Angular Templating​ + T​ utorial​ + ​Another tutorial​ (JS)​ (​mandatory​) 
» ​Smarty​ (PHP) 
» ​Getting started in Wordpress templating​ (PHP) 
» ​http://www.hongkiat.com/blog/angularjs-tutorials-screencast/​ (AngularJS) - There are links to 
various tutorials here. Going through them all (which, most importantly, means reading them all 
then taking in the examples) will insure you have some basic working knowledge of what AngularJS is 
and how it works. 
» ​A comprehensive list of most web templating engines​ (for comparison) 

Example workflow standards 

For future reference, here they are linked directly: 
» ​GIT Guidelines​ / ​HTML Guidelines​ / ​CSS / SCSS Standards​ / ​JavaScript / ES6 Style Guides​ / ​React / 
JSX Style Guides 

Entire websites & tutorials built from scratch using HTML, 

CSS and JS 
● Use ​these ideas​ with extreme prejudice! :) 
● Scrimba​ can be a very useful and diverse approach to learning, but it costs $21 / month. (NEW) 
● A new platform offering project ideas - h ​ ttps://www.frontendmentor.io/​ (NEW) 
● 50 (mini) projects in 50 days - ​https://50projects50days.com/​ from ​Florin Ion​ and B​ rad 
Traversy​ (€10 discounted, €100 full price) (NEW) + ​IdeasGrab​ (NEW) 
● COMPLETE front end tutorial: 1​ 2HR+ YouTube Coding Bootcamp 2021! by Ania Kubów​ (NEW) 
● Several roadmaps for becoming a “complete” front end (+ back end + devops etc.) developer: 
WebDevSimplified Front End​ + ​WDS Backend​, L ​ earnCode Academy​, ​Roadmap.sh​, T
​ raversy 
Media​, etc. (NEW) 
 
 
   
Additional resources 
For those of you that have reached this point and still want to know more,​ I congratulate you​! That 
means you really like the Web, development and what it all means, and therefore you deserve to know 
where to get the best information about how you can become a good front end developer. Here goes: 

Book links 
If you’ve gotten this far and have wondered how you can get a hold of the digital books mentioned in 
this course, please a
​ sk me​ how to get the licensed archive (or buy the books!).​ Pass is​:​ e
​ v3rym@trix 

Must-follow, general resources 

 
»T
​ he EveryMatrix Site Building Workshops​ & ​canalul meu​ RO 
A list of recordings we made in the hopes to disseminate some of the technical and non-technical 
knowledge required to build websites, from design to programming, from architecture to marketing 
and beyond. It’s still a budding resource, since we’ve only just begun holding the workshops, but it’s a 
great place to start learning the basics and advanced information needed to be a pro. 
 
»h
​ ttp://alistapart.com/​ - start w
​ ith this article​ then t​ his 
A List Apart transformed many of us into great front end developers. It’s one of the oldest (est. 1997) 
and most highly appreciated sites offering information for web professionals. It contains in-depth 
articles in a vast array of areas, ranging from cognitive psychology to design, from HTML techniques 
to JavaScript programming, from novelties in CSS styling to usability and accessibility issues, and so 
on. Here’s a ​list of topics​, just pick your favorite and be amazed! 
 
»h
​ ttp://www.nngroup.com/ 
The Nielsen Norman Group is one of the best usability and user research companies in the world, 
offering regular reports on what makes the Web (not) usable. 
 
»h
​ ttps://developer.mozilla.org/ 
The Mozilla Developer Network is one of the best sources of information and reference sites when it 
comes to HTML, CSS and JS. It’s your go-to dictionary and basic information repository, use at will. 

Other resources 
» ​https://www.smashingmagazine.com/​ – Web development magazine 
» ​https://tympanus.net/codrops/​ – Examples of CSS techniques 
» ​https://css-weekly.com/​ – A weekly newsletter on CSS techniques and news 
» ​https://webdesignledger.com/​ – A resources and articles list 
» ​https://offlinefirst.org/​ – A very good list of articles related to making websites resilient 
» ​https://www.uie.com/​ – A user experience and design resource list 
» ​https://responsivewebdesign.com/podcast/​ – A (finished) podcast about RWD 
» ​https://moz.com/beginners-guide-to-seo​ – An SEO primer + ​The Ahrefs Blog​ (great SEO insight) 
» ​https://research.hackerrank.com/developer-skills/2020/​ – What skills are most useful? 
» ​https://practicaltypography.com/typography-in-ten-minutes.html​ – Typography primer 
» ​https://frontendfoc.us/​ – THE best newsletter with front end news and articles 
» ​https://frontendmasters.com/courses/web-development-v2/​ - Full development tutorial 
» ​https://www.youtube.com/watch?v=0pThnRneDjw​ – overview of everything you need to learn 
» A f​ ull history of the Web​, if you’re curious. 
Feelin’ advanced, are we? 
If you’ve reached this far into the tutorial, you must REALLY want something more on the table, to 
keep things interesting and to keep those neurons firing up with new information. I commend you for 
the curiosity and the drive to learn more, so here’s a well deserved reward. You should really start 
learning about programming in general, and its two pillars: A ​ lgorithmics​ and B
​ est Practices​ (NEW). 
You can find out more about algorithms (in Romanian) on this excellent site: ​InfoArena​ (NEW), and 
also on ​LeetCode​ (NEW) and H​ ackerRank​ (NEW) which have gamified ways to test your algorithms. 

Crash course in b
​ rain surgery​ JavaScript 
● FreeCodeCamp.org step by step beginners’ guide to JavaScript 
● JavaScript 30: build 30 things in 30 days with 30 JS tutorials​ (NEW) 
● Practical JavaScript on WatchAndCode​ & T ​ he modern JavaScript Tutorial at JavaScript.info 
● The Odin Project: JavaScript​ (NEW) & T​ he Odin Project: Node.JS​ (NEW) 
● How to code in Javascript at DigitalOcean​ (stolen from ​this Medium article​) 

JavaScript in depth 
First, remember the M ​ DN docs​. There are plenty of really good resources that provide fantastic 
learning experiences and examples in this field, since it’s one of the very popular languages to learn 
nowadays. Our own ​acadEMy on JavaScript has the full curriculum here​. We’ll continue with a list of 
resources based on t​ his fantastic GitHub list​ and other findings: 
● You Don't Know JS  ● The Principles of Object-Oriented 
● Frontend Masters courses by Kyle  JavaScript by Nicholas C. Zakas 
Simpson  ● AST Explorer 
● @mpjme​'s stream  ● CodeWars 
● Learning JavaScript Design Patterns by  ● JavaScript: Understanding the Weird 
Addy Osmani  Parts 
● JavaScript The Good Parts by Douglas  ● Advanced JavaScript 
Crockford  ● Egghead.IO tutorials on J​ S and derived 
● Eloquent JavaScript by Marijn Haverbeke 
languages​, or on actual ​frameworks​, 
● Effective JavaScript by David Herman 
libraries​, etc 
● Learning Advanced JavaScript by John 
● Dan Abramov’s G ​ itHub for React​ where 
Resig 
you can find all sorts of tutorials and 
● JavaScript Allonge, the "Six" Edition 
startup guides 
● Exploring JS: JavaScript books for 
● Vue.JS’s s​ tartup guide 
programmers by Dr. Axel Rauschmayer 
● JavaScript Objects and Prototypes by Jim  ● React with Redux 
Cooper  ● Vanilla JS DOM Manipulation​ (NEW) 
● Professor Frisby Introduces Composable  ● https://javascript.info/​ (NEW) 
Functional JavaScript  ● Învăț eu, înveți și tu​ (Romanian) (NEW) 
● Functional programming in JavaScript 
● Secrets of the JavaScript Ninja by John 
Resig, Bear Bibeault, and Josip Maras 

Front end performance & optimization 

1. https://github.com/thedaviddias/Front-End-Performance-Checklist 
2. https://www.smashingmagazine.com/2019/07/web-on-50mb-budget/ 
3. Front end games and challenges - h
​ ttps://css-tricks.com/front-end-challenges/ 

Quality Assurance / Manual Testing (NEW) 

A primer on Software Testing / QA​, S
​ oftwareTestingHelp​ and some p
​ aid​ a
​ lternatives​ & ​tests​.   
Everybody loves frameworks: VUE.js (NEW) 
I get it, you’re fed up with generic stuff and want to get on the trend everybody’s in and start learning 
a popular JavaScript framework that will get you ahead in the job race and also be fun along the way. 
My personal recommendation is not React, nor Angular, but Vue. Why? Because it just makes more 
sense, workflow-wise, it has server side rendering as a first class citizen allowing you to serve static 
files to the browser then hydrate them on demand with the JavaScript front end scripts, and keep the 
JS and CSS at a minimum with Nuxt and Tailwind. Tailwind is opinionated and I’m not sure I agree 
with it completely just yet, but it does have super obvious benefits compared to Bootstrap & co. Plus, 
Ștefan​ (who gathered the materials below and whom I trust) likes it very much. 
 
But before we get into it… 

First and foremost 

These two e-books will root you in the necessary ideas for a healthy development career: 
1. The lean web​ by Chris Ferdinandi (bonus: watch t​ his video​) 
2. Resilient web design​ by Jeremy Keith 
...just so you don’t treat every web project you see from now on as one you would solve with Vue.js. 
 
So here goes: 

Vue.js Docs 
1. Guide  2. Style Guide  3. Cookbook 

Nuxt.js Docs 
1. Guide 
2. Guide v2 (Beta) 
3. API 
4. Examples 
5. FAQ - Common development, configuration and deployment questions 

Free Courses 
1. VueMastery Intro to Vue 3​ & ​others@V3  5. Vue.js Components Fundamentals - 
2. Vue3 Time Blocking App  VueSchool.io 
3. Laracasts: Learn Vue 2: Step By Step  6. Nuxt.js Fundamentals - VueSchool.io 
4. Vue.js Fundamentals - VueSchool.io 

Node.js 
1. Node.js Best Practices 

TailwindCSS 
1. Docs  4. Collection - Design with Tailwind CSS 
2. Component Examples  Masterclass on @eggheadio 
3. Screencasts: Designing with Tailwind  5. Tailwind CSS Custom Forms 
CSS 

😝
 
Enjoy your damn framework now! I still think you don’t need it that much unless for very large 
projects with dozens of coordinated people working to build the same platform.   
Getting Hired (NEW) 
» ​The Odin Project: Getting Hired 
» ​36 types of jobs in IT (in Romanian) from my YouTube channel 
» ​Everything you need to know about making your CV (in Romanian) from my YouTube 
» ​Prepare for your technical interview by practicing on Pramp 
 

Being a better programmer (NEW) 

» ​LeetCode 
» ​CodeWars​ (including Katas) 
» ​HackerRank​ (including certifications and practices) 
» ​TopCoder​ (competitive programming) 
» ​CodinGame​ (learn while playing) 
» ​AlgoExpert​ (paid) 
» ​InfoArena​ (Romanian) 
» ​LeetCode 
» ​Pramp​ (practice interviewing) 
» ​The Odin Project 

Chapter to be continued, but scroll down some more for 

extra content! 
 
   
An overview of the paths in Front End Development 
The source, and a lot of tutorial links, can be found ​here​ (2018 edition) and an updated one for 2020 
can be found h
​ ere​, with the actual source of the graph being at ​https://roadmap.sh/ 
 

 
 
Digital Marketing materials (new) 
How about some SEO? 
There are a zillion superb articles and resources for SEO, here are a few good places to start: 
» ​moz.com/beginners-guide-to-seo  »m​ oz.com/blog/google-e-a-t  
» ​moz.com/learn/seo  »y ​ oast.com/wordpress-seo/  
» ​ahrefs.com/blog/learn-seo/  »u ​ itest.com/analysis/  
» ​SearchEngineJournal Best SEO Resources  »2 ​ 0years.withgoogle.com/ 
» ​SearchEngineJournal Become an SEO Expert  »C ​ ontent strategy for startups 
» ​backlinko.com/content-study   »N ​ eil Patel’s SEO Cheat Sheet 
» ​SEOByTheSea Google Ranking Signals  »h ​ ttps://moz.com/beginners-guide-to-seo​ – 
» ​moz.com/google-algorithm-change   An SEO primer + ​The Ahrefs Blog​ (great SEO 
» ​VieoDesign What are LSI keywords  insight) 

Marketing & business strategy 

» ​Blogging for business​ (a free - for now - $800 value course from Ahrefs) (​mandatory​) 
» ​SAAS marketing vlog 
» ​Content Marketing​, a comprehensive guide from Ahrefs 
» ​Marketing examples​ - a great list of strategies and tactics, plus a newsletter to go along with it 

Networking, security and Linux 

» ​NetworkChuck​ - tons of f​ ree tutorials​ and a few paid high quality ones 
» ​TryHackMe​ - cyber security training 
» ​HackTheBox​ - start hacking 
» ​CTF Time 
» ​Pico CTF​ - hack by playing 
» ​Over the Wire​ - wargames 
» YouTube: I​ ppSec​, J​ ohn Hammond​, L​ iveOverflow​, D
​ EFCON​, ​BlackHat 
» Udemy: ​Practical ethical hacking 

Entrepreneurship materials (new) 

» ​https://www.startupschool.org/ 
»  

Final life advice 

1. https://www.selfauthoring.com/ 
2. Un site care oferă un overview destul de interesant al tuturor skill-urilor (similar cu 
infograficul enorm de mai sus, dar în variantă web: h​ ttps://andreasbm.github.io/web-skills/ 
3. @TODO - ​aștept sugestii în comments​ :) 

Shameless self promotion 

Dacă te tentează o carieră în domeniul IT, mi-am făcut recent canal de YouTube în care vorbesc 
despre ce-ar trebui să faci ca să-ți sporești șansele să înveți ce trebuie, să te descurci singur/ă, să fii 
autodidact/ă și să ai posibilitatea să te angajezi în domeniu. Dacă sună bine, înscrie-te la canal, dând 
click pe link-ul ăsta: ​https://www.youtube.com/c/ViorelMocanu?sub_confirmation=1 
 
Succes în carieră!