(Just an opinion of a simple guy who's not even a front-end developer himself)
- Learn to use a Unix (Linux/Mac) terminal.
- I have some development experience on both Windows and Unix-based machines and as far as I can tell, it is much easier to start learning programming on a Unix-based OS such as Ubuntu or Mac OS. Installation of the necessary tools is much easier as there are also much more resources to be found on the web, making it easier to onboard for a non-expert user.
- In the next step, I will assume a Unix-based OS usage. Sorry for all Windows lovers :(
- Here's a course on learning to use the command line.
- Learn HTML5.
- Learn CSS4.
- w3schools
- Mozilla the go-to place for web developers.
- Udemy: HTML5 + CSS3 paid course.
- CSS4 selectors - CSS3 is a prerequisite.
- Learn Javascript.
- w3schools
- Mozilla
- A random medium article with 50 useful resources to learn JavaScript from - because there are people who understand this topic much more than I do.
- A random medium article promoting a free course on the higher level Javascript syntax (ES6+), don't be scared if you don't know what ES6 stands for.
- Know what software registry is - npm. And leverage its power through a package manager:
- PRO tip: if you want to be serious about using javascript, you sould install nvm, a Node version manager, it will automatically ship with npm. It makes it possible to switch between multiple Node versions. Don't worry if you don't know why is it useful, yet. Just believe me, it's a good stuff.
- Learn React.js
- Okay, here we need some explanation. React.js is a front-end javascript framework, you might wanna choose something different like Vue.js or Angular. I would personally go for React. Some people would say, you should learn React Native because it is something that will soon be used on the web instead of React.js. However, I think it is easier to learn React.js first.
- At this point, you should learn how to read documentations. So, the best resource to learn React.js is to read its documentation. And yes, you should also read the advanced as well as the reference sections.
- But again, for those whose attention span is shorter, I really recommend this Udemy course.
create-react-appis your best buddy. It bootstraps a completely working initial react app with working webpack cinfiguration that is initially even hidden for you so that you don't have to care about it at all. However, you can anytime useyarn ejectto get the webpack config files in order to do fine-grained changes and suit the app for your specific needs.
- Learn Webpack 4.
- This is a necessary tools for a front-end developer in 2018. You'd better know what bundling stands for.
- Learn the concepts first, read the documentation.
- Then you're ready to start using the concepts in real projects.
- Learn Git.
- This is certainly one of the most important tools for any developer. I don't even know why I put it so far in the list. This tool makes collaboration on projects so much easier. But even if you work on projects alone, it is extremely useful.
- Mandatory reading: Pro Git - the book.
- GitHub is your best friend.
- Github is an online distribution and collaboration channel for open-source (but also private non open-source) projects.