Артем Марочканич

Я для себя выработал такой алгоритм:
Если мне надо изучить технологию
1) Выбираю по отзывам чтиво: книгу или документацию
2) Читаю ее, не вдумываясь, просто чтобы прочесть и ориентироваться потом что там, примерно, где написано
3) Теоретическое обучение продолжать смысла нет, делаю работу по этой технологии, заглядывая в книгу или документацию, "гугля" отдельные моменты
4) Практика и еще раз практика, решение множества конкретных задач - есть единственный путь к профессионализму...

Нужно знать css синтаксис, различия между display:inline, display:inline-block, display: block, display: flex-box. Так же нужно понимать что такое общий поток эллементов, что происходит когда вы ставите на элемент float:left/right, position:absolute/fixed/relative и т.д. Естественно просто знать что это все и для чего. Те же флексбоксы досканально знать не обязательно, достаточно знать только то, какие проблемы оно решает.

А все остальное - это так... украшательства. Даже не особо стоит вдаваться в нюансы как это все в разных браузерах работает, это проще в процессе постигать.

Знание этого всего больше относятся к DOM и тому, как с ним работать, так что и в изучении JS должно хоть сколько нибудь помочь.

У нас в Icons8 вся команда удаленная, в разных городах, и мы не встречаемся в оффлайне. Вот что нам показывают ребята и на что мы обращаем внимание:

1. Рассказ о себе хорошим русским языком. Это универсальный совет на все случаи жизни: все можно рассказать и объяснить, и если вы не можете договориться с работодателем на этом этапе, то это — красный флажок. Дальше будет хуже.

2. Скриншоты систем. Важен общий уровень продукта: насколько он интересен технически, насколько профессионально выполнен дизайн? Этот шаг можно пропустить, если интерфейс плохой: это будет лучше, чем страшные скриншоты с объяснением "дизайнера нам не выделили, делали сами как умели".

3. Ссылка на гихаб - вероятно, вам будет интереснее работать с заказчиком, который знает, что такое гит :) И наоборот, вот такое лучше не показывать:



4. Вопросы к работодателю. Лучше, если они будут открытыми (предполагающими развернуты ответ) и по теме программирования (а не "кто оплачивает комиссию 12 рублей за перевод зарплаты" — это мелочи).

Лучший вопрос, который мне доводилось услышать: "как у вас построена работа".

ПС: Вот пример нашей вакансии brainstorage.me/jobs/8613 и вот — отличный ответ:

HTML (XHTML, HTML4, HTML5) - обязательно (внимание на HTML5)
CSS (2.1, CSS3, etc.) - обязательно (внимание на все версии)
JavaScript / Ajax - обязательно, классика
jQuery - обязательно, классика
Popular Frameworks (HTML5 Boilerplate, Twitter Bootstrap, etc.) - первый удобный шаблон для html5 проекта, не более, второе уже классический шаблон для адаптивной верстки
Modernizr - библиотека для определения браузеров, клиентов, девайсов - прочитать, усвоить, применять по необходимости что-то определить
OOCSS / BEM / SMACSS (Modular coding methodologies) - способы удобного написания стилей, прочитать, усвоить, применять по необходимости
CSS Grids - не знаю что автор имел ввиду - видимо CSS-сетки, просто надо знать
CSS Frameworks / Resets - ничего сложного технологии обнуления стилей и опять наборы CSS правил с классами типа animate.css
Progressive Enhancement / Graceful Degradation - понятие связанное с кроссбраузерностью и упрощением функционала и отображения в некоторых браузерах
HTML and CSS Specifications (W3C / WHATWG) - чаще проверять код на валидность, это позволяет понять свою ошибки как раз на основе этих спецификаций
UX / Usability - больше для дизайнеров, но тоже пригодится
Website Speed / Performance - плюшки по оптимизации
Developer/Debugging Tools (Chrome Dev Tools, Firebug, etc) - умение ковыряться в консоли, надо знать и применять всегда
YUI Library - по необходимости
Dojo / MooTools / Prototype - изучать и применять по необходимости
Responsive Web Design - надо знать работу с css медиа-запросами
Mobile Web Development - абстрактное понятие связанное с разработкой мобильных веб-приложений
Mobile Web Performance ---
Cross-Browser / Cross-Platform Development - абстрактное понятие связанное с разработкой кроссбраузерных и кроссплатформенных приложений
Document Object Model (DOM) - дом модель - на вводном курсе по js должен знать о ней каждый фронтендер
Cross-Browser Bugs and Inconsistencies (primarily IE6-8) - без комментариев
CSS Pre-Processors (LESS / Sass) - удобные препроцессоры для работы со стилями, рекомендую для упрощения работы с CSS
Version Control (Git / GitHub / CVS / Subversion) - полезный навык, нужный не только фронтендерам, полезен для командной разработки.
HTML5 APIs (Canvas, Geolocation, Video, etc.) - изучать и применять по необходимости
Object-oriented Programming (OOP) - без комментариев
Back-end Templating languages/technologies (PHP, Ruby, .NET, etc) - нужно знать на базовом уровне, что бы понимать как обрабатывать данные на клиенте, возвращенные/отданные сервером, мучать бэкендщика по этому поводу.
Scaffolding, Task Runner tools (Yeoman, Grunt, Bower, etc.) - удобные штуки упрощающие работу
MVC Frameworks (Angular, Backbone, etc.) - изучать и применять по необходимости
MySql - изучать
Accessibility / WAI-ARIA - изучать и применять по необходимости
Microdata / Microformats - изучать и применять по необходимости
HTML5/CSS3 Polyfills - изучать и применять по необходимости
CMS (WordPress, Drupal, Joomla, etc) - изучать и применять по необходимости
Functional Programming - без комментариев, надо знать
Data Formats (e.g. JSON, XML) - надо знать
Internationalization / Localization - абстрактное понятие
Content Strategy - изучать и применять по необходимости
Offline Web Apps - изучать и применять по необходимости
Regular Expressions - надо знать на базовом уровне
.htaccess - изучать и применять по необходимости
SVG - изучать и применять по необходимости
Image Editing Tools (Photoshop, Fireworks, etc.) - надо знать
Web Font Embedding / Licensing - работа со шрифтами
SEO - фронтеднеру надо знать на уровне семантичной вертски
Haml - работа с HTML
CoffeeScript - работа с JS

В целом все эти технологии, понятия и пр. тесно пересекаются друг с другом. Изучая что-то одно невольно изучаешь другое.

PHP бесполезно учить отдельно. Его необходимо учить в связке PHP+JS+HTML+CSS+SQL (или какая-нибудь другая). Отсюда следует, что достигнуть профессионального уровня можно только с помощью практики.

Практического опыта можно набраться двумя способами:
— устроиться на работу в качестве практиканта/ученика;
— самому попытаться реализовать свой сложный проект (результат не важен, главное полученный опыт).

Так же могу посоветовать «разобрать» какой-нибудь фреймворк в плане кода, посмотреть его внутренности, как он устроен, как работает.