How to learn layout with the transition to the front-end?

Question

css

Good afternoon Toaster residents.
Quite recently I started studying layout, watched various video courses, and now I'm doing practice. I make layouts according to the complexity. Due to the constant development of technology, I don’t want to waste time on something that may not be useful, but due to inexperience, you need to understand what is worth learning first and what should be postponed for later. My question is directed to people who have gone through this path and have experience.
In what sequence is it better to study this direction (first layout, and then the transition to the front-end)?
If it doesn't make it difficult, please write the sequence of studying technologies, languages, etc., which one thinks is more correct.
Thank you.
PS If it will not be difficult for anyone to help with the layout, on the literacy of the code, please write back.

Answer 1

HTML5&CSS3 is the first thing to learn anyway. Html Book is a good option for a beginner, but still ideally off. website of the consortium with documentation www.w3.org
I think it is important for a good coder and front-end developer to understand the "kitchen".
There is not a bad book, I personally really like it, John Duckett "HTML and CSS" . The book is not cheap, but personally helped me a lot in learning the basics.
Further, again, in my opinion, at least at the level of syntax - to study JavaScript. I'm not talking about the JQuery library yet. But it is, in fact, important. Book - Ber Biro, Yehuda Katz "Detailed Guide to Advanced JavaScript" .
In terms of experience, it’s probably clear here, to make up and make up again, as you solve certain tasks, the skill grows, so to speak. The ability to search for the answer in Google is also an important skill.
A good way to study someone else's code and look for an explanation for this or that action. Best of all, the code of those sites that are really well made ..
After layout, you can check your code on the validator of. consortium website. You just need to insert a link there to your site and it analyzes.
On YouTube, there are video tutorials in many areas. Of the coolest in my opinion, Sorax
In general, patience and desire to deal with layout and front-end. Good luck )

Answer 2

There are 2 options for the development of the front-ender:
1. as a layout designer - here on the 1st plan html + css and a little jquery
2. as a programmer - a more paid job; 1st place - javascript and various js-frameworks, layout may not have to be dealt with in this position
What to learn:
1. layout designer - htmlbook.ru and MCSS\BEM
2. front-end programmer - learn.javascript.ru

Answer 3

From personal experience:
1. Start with layout - the entry threshold is lower.
Study the theory, be sure to consolidate with a lot of practice. Having laid out several large layouts for the portfolio, actively look for work. At this stage, there is nothing better than full-time work. At first there will be a lot of questions, errors, problems, but progress will go as quickly as possible.
Where to study?
Theory: developer.mozilla.org , htmlbook.ru , learn.javascript.ru/css-for-js
It's convenient to try to typeset in the sandbox (I like codepen.io ).
Practice: interactive courses htmlacademy.ru (most can be taken for free).
These guys haveintensive site development from scratch. Passed it.
If you can afford it, I highly recommend it. Really grow in a month. Plus, you will have webinar recordings and free access to all subsequent intensives.
I can share the promo code "344a1a5b" (without quotes) - a discount of 800 rubles.
2. Continue learning JS.
Theory: learn.javascript.ru .
Practice: stepik.org , htmlacademy.ru has a little .
Intensives: I took JS intensives at learn.javascript.ru and htmlacademy.ru .
I liked htmlacademy better: a well-developed course interface, interactive exercises, the project is suitable for a portfolio, and the constant help of a mentor.
3. Further study the framework(s) : React, Angular, Vue.

Answer 4

• HTML, CSS ( courses for beginners here )
  
• JavaScript, jQuery (you can use these sites wisdomweb , courses on youtube )
  
• An excellent guide to HTML and CSS at htmlbook.ru
  
• I also recommend that you simultaneously learn to type blindly, an excellent simulator " Solo on the keyboard " in 2 months you can learn to confidently type blindly in Russian and English layouts. Learn technical English.
  
• In the future, study less, sass, bootstrap , work with git Fundamentals of php, mysql, work with popular cms: Drupal, Joomla, WordPress, etc.
  
• A text editor is also important, use one that is quick and convenient to work with. You can read about Sublime Text , including useful plugins.
  

Answer 5

Learn how to work with HTML5 objects and learn how to code competently in native JS.
After that, use the libraries as needed.
Use the jQuery library ONLY! after you master native coding more or less.

Answer 6

Due to the constant development of technology, you do not want to waste time on something that may not be useful.

Well, here the main factor is whether this technology is a "crutch". For example, the same animation in jQuery - now there are native ways to set animations using css, and also animation api, if I'm not mistaken in the name, is being developed .. Although some things are still better to do using jquery animation .. Or many chips were developed for IE, but did not take root in the modern web. Usually the manuals for these cases directly say - it only works in IE .. Although many of the originally purely IE features have entered HTML5. In general, it’s better to overdo it than not do it, I swear))