Всем привет! Вы знаете, как создаются программы и информационные сервисы, которыми все мы пользуемся? Какие специалисты нужны, чтобы появился новый Фейсбук, Вайбер, Инстаграм, новый Windows или какая-то крутая видеоигра? За разработкой программного обеспечения (ПО) стои́т целая команда профессионалов — и далеко не все из них умеют программировать. Типичная команда будет включать в себя таких специалистов, как: бизнес-аналитик — проводит анализ бизнес-проблемы, формирует требования к разрабатываемому продукту; PM (Project Manager) — управляет всеми, кто вовлечен в работу над проектом; тимлид (Team Leader) — управляет командой разработчиков; UX/UI дизайнер — создает приятный дизайн приложения (UI) с хорошим пользовательским опытом (UX); разработчики/программисты — занимаются написанием кода, являются ядром команды; QA специалист — тестирует приложение на каждом этапе его разработки для обеспечения высокого качества продукта. Если ПО не предназначено для использования только внутри компании, а нацелено на внешнюю аудиторию, то еще добавляется маркетинг-команда, которая работает с целевыми потребителями: исследует рынок, определяет клиентуру, привлекает ее внимание, подогревает интерес к продукту и многое другое. Таким образом, в IT найдется хорошая работа даже для тех, кто не любит программировать. И сегодня речь пойдет о таком специалисте, как QA. Чуть выше вы уже узнали, что это, фактически, тестировщик, следящий за качеством ПО на каждом этапе его разработки. В чём специфика данной профессии, чем занимаются эти специалисты, насколько легко стать QA инженером и какие технологии должен знать потенциальный претендент на данную должность — это мы и раскроем в нашей статье. Устраивайтесь поудобней, мы начинаем!   Тестировщик, QC Engineer, QA Engineer Очень часто термин “тестировщик” применяется ко всем специалистам, которые так или иначе связаны с проверкой ПО на качество. Тем не менее, в данной сфере существует формальное разделение профессий на три ветви: Tester, QC и QA. Давайте выясним, что означает каждая из них. Тестировщик — специалист, который фокусируется на проведении непосредственных тестов над уже созданным ПО (составление тест-кейсов и баг-репортов, локализация дефектов и другое). Специалист проверяет, все ли работает согласно заявленным требованиям, производит сбор статистических данных и фиксирует их в соответствующих документах. Тестировщик внимательно пользуется разработанным ПО, воспроизводит все возможные действия пользователя, работает с приложением на различных операционных системах, в различных браузерах (если это веб-приложение), на различных мобильных платформах (если это мобильное приложение); помимо ошибок он ищет еще и уязвимости. Что-то вроде техосмотра транспортного средства. Отчеты об ошибках затем направляются разработчикам, которые ответственны за дальнейшее исправление багов. QC (Quality Control) Engineer — специалист, который обеспечивает не только соответствие разрабатываемого ПО заявленным требованиям, но и его соответствие заранее определенным критериям качества продукта в целом. Также, он ответственен за определение готовности продукта к выпуску в продакшн. Цель Quality Control специалиста — формирование объективной картины состояния качества ПО на различных этапах разработки. Можно сказать, что специальность тестировщика является подмножеством специальности QC Engineer. QA (Quality Assurance) Engineer — специалист, который обеспечивает контроль качества разрабатываемого ПО на всех этапах его планирования, проектирования и создания. Работа на этой должности является проактивной и носит превентивный характер, поскольку QA инженер уделяет внимание качеству продукта еще до того, как тот будет создан. Здесь на первый план выходят комплексы мероприятий, процессы и средства обеспечения качества ПО на каждом витке разработки. Непосредственно тестирование системы занимает уже второе место. Главное задание QA — выстроить систему так, чтобы она имела как можно меньше зон, где можно допустить ошибку, соответствовала всем показателям качества, а также была легко тестируема.  Специальность QC Engineer является подмножеством специальности QA Engineer. Чтобы вас не путать, в данной статье мы приравняем понятия “тестировщик” и “QA инженер” в пользу второго. Будем расписывать стек технологий и путь становления именно QA специалиста. Таким образом мы сможем затронуть максимальное количество информации касательно направления тестирования.   Направления QA   Начнем с того, что в QA есть два основных направления — Manual и Automation. Специалисты каждого из них называются мануальный (ручной) тестировщик и тестировщик-автоматизатор, соответственно. Их разница в том, что первый следит за качеством продукта и проводит все тесты вручную, а второй автоматизирует тестирование путем написания скриптов. Automation QA использует определенный язык программирования и фреймворк для того, чтобы создавать программы, которые будут производить тестирование продукта вместо самого специалиста. Такой подход позволяет сократить время на тесты. В обязанности мануального QA инженера входят: анализ и выяснение требований у заказчика либо бизнес-аналитиков; планирование процесса тестирования; написание сценариев тестирования; непосредственно тестирование программного продукта; определение проблемных мест, их документирование; использование систем отслеживания багов (баг-трекинги); обсуждение исправлений с разработчиками, активное взаимодействие с ними; отслеживание жизненного цикла ошибок; повторный тест исправленных дефектов; анализ тестирования; планирование идей по оптимизации качества программного обеспечения; ведение тестовой документации; проверка требований к программному обеспечению; оценка рисков; участие в стенд-апах и других митингах. Тем временем на плечи Automation QA помимо прочего возлагаются такие обязанности, как: написание новых автотестов на основе разработанных вручную; обновление поломанных/устаревших автотестов; прогон автотестов; анализ результатов тестовых прогонов; настройка тестового окружения; ревью кода; оформление автотестовой документации. На самом деле и мануальное, и автоматизированное направление имеют много общих требований, поскольку их фундамент одинаков. Давайте начнем с рассмотрения Manual QA, а затем плавно дополним его инструментами Automation QA.   Стек технологий Manual QA Engineer   Общая теория по IT Если лет 15 назад в тестировщики брали чуть ли не “с улицы”, то сейчас к претендентам с каждым годом выдвигают все больше и больше требований. Так что потенциальный претендент на должность прежде всего обязан хорошо понимать IT индустрию.  Итак, в этот пункт предусматривает такие темы, как: веб-технологии (HTTP, HTTPS, DOM, JSON, cookie, session), клиент-серверная архитектура; базы данных; компьютерные сети; операционные системы (обратить особое внимание на Unix); мелкие подтемы, как, например, системы счисления и т. д. Теория тестирования и тестовая документация Безусловно, любой QA инженер должен знать, с чем он вообще имеет дело. Если на заре разработки тестирование было чем-то интуитивным, то сегодня оно обрело четкие формы, обзавелось своими методиками, инструментарием и специализированным программным обеспечением.  Изучив теорию тестирования, вы сможете ориентироваться в данном направлении, понимать принципы, типы и методы тестирования, тест-дизайна, этапы жизненного цикла ПО; узнаете, как правильно составлять тестовую документацию (тест кейс, баг-репорт, чек-лист и т. д.) и многое другое. Основные темы: Тестирование, основные стандарты ISTQB. SDLC и STLC. Методологии разработки ПО. Требования. Анализ и составление требований. Тестовая документация.  Уровни, типы, методы и виды тестирования. Техники тестирования. Тест-дизайн Баги и баг-трекинговые системы. Системы контроля тестов. Основы программирования + HTML/CSS Основы программирования мануальному QA нужны не для того, чтобы заниматься непосредственным кодингом, а чтобы уметь читать код разработчика и понимать, что в нем происходит. Здесь важен не сам язык программирования, а банальное понимание того, как создаются программы, что такое переменные, функции, методы, классы, какие есть методологии программирования, как они реализуются и т. д. Для изучения основ отлично подойдет C# либо Java. Возможно, сюда стоило бы включить и Python, но он, пожалуй, слишком легкий для изучения и при работе с другими языками вам придется что-то доучивать. C# с Java же более фундаментальны и зная основы одного из них, вы легко сможете разбираться с кодом любых других популярных языков. Фактически, владение основами программирования необходимо для чтения чужого кода и выявления возможных багов прямо на месте. Отдельно выделяем языки верстки HTML и CSS. Если вы будете работать с веб-приложениями (а как показывает практика — проектов много — очередь и до тестирования “веба” рано или поздно дойдет), то вам будет полезно знать, из чего состоит FrontEnd часть веб-приложения. Также, вы будете работать с инструментами разработчика в браузере и там тоже надо будет взаимодействовать с HTML/CSS кодом. Правила оформления документации. Модель CMMI Если вспоминать три специальности, о которых мы говорили вначале (QA, QC и тестировщик), то этот пункт для тестировщика как такового является ненужным. Но вот для QA инженера он является неотъемлемым. В процессе проектирования ПО, слежения за его качеством необходимо производить соответствующее документирование. Чтобы делать это правильно, надо знать стандарты оформления подобных документов. Важно уделить внимание серии ISO 9000. CMM / CMMI — это набор методологий (моделей) совершенствования процессов разработки ПО. Знание CMMI позволяет QA инженеру грамотно оценивать проект и планировать необходимые процессы по обеспечению качества.  SQL SQL — язык запросов, который используется для взаимодействия с данными в реляционных базах данных. Тестировщику он пригодится для того, чтобы выполнять бэкенд-тестирование для проверки тестовых данных, вставки, удаления, обновления их значений в БД. Сказать точный уровень владения SQL нелегко, поскольку все зависит от сложности проекта. На каком-то сгодится базовый уровень SQL, а где-то необходимо быть весьма и весьма подкованным. А если тестирование не связано с бэкендом, то знания языка запросов вовсе не пригодятся. В общем и целом, тестировщик должен обладать следующими знаниями и умениями при работе с БД и SQL: умение распознавать различные типы БД; способность реализовать подключение к БД, используя разные клиенты SQL-соединений; понимание таблиц БД, ключей, индексов, типов отношений между таблицами; умение создавать простые запросы; понимание и умение разбирать по полочкам сложные запросы.    Веб-сервисы Веб-служба (или веб-сервис) — это идентифицируемая веб-адресом программная система со стандартизированными интерфейсами. Данный термин описывает стандартизированный способ интеграции веб-приложений с использованием различных протоколов, например: XML, TCP/IP, SOAP, WSDL и UDDI. Веб-служба представляет собой способ связи между двумя электронными устройствами по сети, такими веб-сервисами можно пользоваться независимо от компьютера, браузера или места доступа в Интернет (поиск, веб-почта, хранение документов, файлов, закладок и т. д.). К преимуществам веб-сервисов можно отнести: возможность создания необходимых кондиций для взаимосвязи программных компонентов, которые не будут зависеть от используемых платформ; веб-сервисы используют открытые стандартные протоколы; благодаря XML обеспечивается легкость в формировании и настройки веб-сервисов; использование HTTP гарантирует успешную взаимосвязь систем через межсетевой доступ. Веб-сервисы должны знать разработчики для корректной реализации ПО, а тестировщикам они нужны, чтобы понимать, как работает та или иная веб-система. Jira Система баг-трекинга, которая помогает выявлять, регистрировать и контролировать баги, найденные в разрабатываемом ПО, а также отслеживать процесс устранения этих ошибок. Является командным инструментом, что упрощает процесс взаимодействия разработчиков и тестировщиков, а также различную баг-трекинговую деятельность в принципе. Помимо прямого назначения помогает команде эффективнее работать, расставлять приоритеты и выбирать дальнейшие шаги оптимизации ПО. Postman Популярный и в то же время мощный набор инструментов для тестирования API (в среде разработчиков произносится как “а́пи”). API — это прикладной программный интерфейс; он указывает, каким образом следует обращаться к программе и какие ответы она обязана предоставлять пользователям. Postman относительно простой в использовании, имеет богатый интуитивный интерфейс. Он проверяет запросы с клиентской стороны на серверную, а также отклик со стороны бэкенда. Таким образом можно убедится, что на стороне сервера все работает, даже если фронтенд сторона еще не готова.  API можно тестировать и при помощи множества других программных средств (например, JMeter), однако, на сегодняшний день именно Postman является наиболее компромиссным инструментом тестирования запросов, сочетающим в себе простоту и высокую эффективность.     Git Git — это популярная система контроля версий, позволяющая вести историю разработки проекта с возможностью доступа к каждой сохраненной версии. Одним из самых известных антагонистов Git является SVN — централизованная система, в отличие от децентрализованной Git. Также, в работе вам пригодится и сервис онлайн-хостинга проектов, использующий систему контроля версий. В данном случае это GitHub. В паре с Git он позволяет разработчикам сохранять свой код онлайн, а затем взаимодействовать с другими разработчиками в разных проектах. Git нужен скорее для Automation QA, поскольку позволяет в удобном виде хранить код тестов с возможностью вернуться к рабочей версии тестов. Также, тестировщик сможет: иметь доступ к коду разработчиков; организовать список тестов и отслеживать его выполнение; тестировать код с разных устройств (при этом сам код лежит на удаленном репозитории Git); хранить различные настройки для приложения; выполнять другие взаимодействия. Методологии разработки Agile/Scrum Методологии разработки — это своеобразные путеводители по процессам эффективной разработки ПО. Их применение помогает организовать максимально продуктивную работу всех участников, которые напрямую или косвенно задействованы в разработке продукта в соответствии с выбранной стратегией. Agile — семейство гибких методологий разработки программного обеспечения, которое позволяет выпускать продукт небольшими частями, постоянно его дополняя и совершенствуя. При таком подходе технические и бизнес-подразделения работают совместно, ПО постоянно обновляется, обеспечивается быстрое принятие решений и выявление неправильных подходов, приложение проще обслуживать, а качество кода готового продукта более высокое. Agile имеет собственный манифест, который подробно описывает основные принципы, на которых строится гибкая разработка. Scrum является одной из популярнейших реализаций agile-подхода. Его используют многие команды, поэтому знание особенностей работы со scrum-моделью для QA инженера является не менее важным, чем для любого разработчика. Английский язык Знание английского языка — естественное требование для многих профессий в IT, поскольку большинство новых сведений о технологиях, курсы, учебные и справочные материалы появляются в первую очередь на английском. Для работы в команде обычно знаний языка на уровне чтения технической документации, комментирования кода и составления баг-репортов вполне достаточно, однако, если возникнет необходимость вести переговоры и/или переписку с иностранным заказчиком, либо же вы будете в интернациональном коллективе, ваш уровень должен быть выше (тут уже очень желательно иметь уровень не ниже Upper Intermediate). Soft Skills Так называемые “гибкие (мягкие) навыки” — это внутренние качества специалиста, которые помогают ему выполнять работу максимально качественно и без лишнего напряжения. К примеру, для следователя-криминалиста прекрасными софт скиллами будут объективность, внимательность, умение чувствовать своего собеседника, прекрасное дедуктивное мышление и неугасающее стремление докапываться до правды. Для работника на ресепшене критически важными мягкими навыками есть коммуникабельность, дисциплинированность, пунктуальность, обходительность, вежливость и другие. Какие soft skills пригодятся тестировщику? Специалисту, который следит за качеством ПО и проверяет его на прочность, следует обладать следующими навыками: внимательность, умение концентрироваться на задаче; инициативность; усидчивость; организованность, проактивность, нацеленность на результат; стрессоустойчивость; эмпатия к пользователю и вместе с тем понимание бизнес-процессов (умение “переобуваться”); адаптивность; коммуникабельность; умение работать в команде; обладание логическим, системным, упорядоченным мышлением; умение правильно осуществлять декомпозицию (по отношению к системам, задачам, проблемам и т. д.); наличие шестого чувства + немного изобретательности; стремление учиться и умение передавать свои знания другим; Пользовательский опыт (не обязательно, но очень удобно) Было бы неплохо, если б перед тестированием приложения вы уже сталкивались с чем-то подобным в обычной жизни. Если работать предстоит в сфере игростроения, то ваш огромный геймерский опыт будет как нельзя кстати. Работа с проектами из веб-индустрии? Опыт сёрфинга в интернете (соцсети, интернет-магазины, онлайн-сервисы) облегчит понимание логики пользователей, их ожиданий и точек интереса.   Automation QA   Автоматизированный QA технически является надмножеством позиции Manual QA — он должен знать все то же самое, что и мануальный коллега плюс несколько новых инструментов. Эти инструменты мы сейчас и перечислим. Язык программирования  Если в разделе о Manual QA мы говорили об основах программирования, то автоматизатору понадобится именно уверенное владение конкретным языком. Обычно выбирают среди Java и Python, но это не предел. В тестировании можно применять и такие языки, как JavaScript, C#, Ruby, PHP, SmashTest и другие. При помощи выбранного языка вы будете писать автотесты, которые будут выполнять тестирование за человека. Программа работает — тестировщик анализирует результаты. Это упрощает работу, повышает скорость проведения тестов и снимает часть задач с человека. Фреймворк для тестирования  Для создания автотестов зачастую используется специальные программное обеспечение — фреймворки. Одним из популярнейших считается Selenium. Он мультиплатформен, ориентирован на работу с веб-приложениями и поддерживает множество популярных языков программирования. Более того, Selenium является основной технологией для множества других инструментов автоматизации браузеров, API и фреймворков. Инструменты нагрузочного тестирования Данный пункт является необязательным, но при этом очень желателен. Нагрузочное тестирование — это вид тестирования, при котором производится тест производительности целевого ПО при различных нагрузках от действий определенного количества пользователей. Наиболее известными инструментами проведения нагрузочного тестирования являются Gatling и JMeter.      Как стать тестировщиком?   Превращаем список приведенных выше технологий в туториал. Начинаем с пути Manual QA. Вы можете учиться самостоятельно — по книгам или видео курсам, а можете записаться на курсы тестирования для максимально эффективного обучения. В любом случае вначале вам нужно очень хорошо изучить теорию тестирования и базовые темы в IT: веб-технологии, API, клиент-серверная архитектура, базы данных, компьютерные сети, операционные системы (обратить особое внимание на Unix), мелкие подтемы, как, например, системы счисления и т. д. Конкретные темы по тестированию мы расписали в одном из первых наших разделов. Затем вам следует освоить написание тестовой документации (для чистого тестировщика), а QA понадобится еще и знание стандартов по обеспечению качественного ПО (ISO 9000) для дополнительного документирования, модель CMMI. Чтобы беспроблемно читать код разработчиков и понимать, что в нем происходит, следует владеть основами программирования. Для этого лучше выбрать либо Java, либо C# — документация по данным языкам очень информативна, есть большое комьюнити. Более того, множество программ обучения по данным языкам располагает прекрасным бэкграундом (история программирования, как работают вычислительные системы и как они обрабатывают информацию), который закладывает прочный фундамент программирования. Также, стоит освоить языки верстки HTML и CSS — они очень простые и используются в абсолютно всех веб-приложениях Для работы с обеспечением, которое использует базы данных, необходимо изучить основы SQL. Далее приступаем к изучению веб-сервисов, а после — к популярной баг-трекинговой системе Jira и мощному набору инструментов для тестирования API — Postman. Создание программного продукта обычно ведется в команде, потому знание методологии командной разработки является не менее важным, чем предыдущие технологии. Уделите время изучению принципов Agile/Scrum — с их помощью эффективно разрабатывается современное программное обеспечение. Методология гибкой разработки очень важна для тестировщика, поскольку он участвует в производственном цикле так же, как и разработчики. Также, не забудьте подтянуть ваш английский как минимум до уровня Intermediate. Он нужен для комфортного поиска нужной информации в интернете, чтения технической документации, работы с иностранными коллегами, а также — для возможного взаимодействия с заказчиком. Все же английский в IT еще никому не мешал и более того — давал новые карьерные возможности.  Чтобы ваша работа приносила вам удовольствие и вы себя не заставляли работать, вам следует обладать следующими софт скиллами: внимательность, умение концентрироваться на задаче; инициативность; усидчивость; организованность, проактивность, нацеленность на результат; стрессоустойчивость; эмпатия к пользователю и вместе с тем понимание бизнес-процессов (умение “переобуваться”); коммуникабельность; другие качества, которые мы указали в соответствующем разделе. С этими навыками и знаниями вы сможете приступать к практике. Изучите Git, начните работать каким-либо проектом: покройте его тестами, напишите тест-документацию. Опубликуйте наработки на GitHub — это даст вам ценный опыт работы с распределенной системой управления версиями и позволит проверить свои навыки в решении реальной задачи. Несколько хороших проектов, и полноценное портфолио готово, а с ним вы можете уверенно подавать резюме на вакансию мануального QA инженера. Если вас интересует автоматизированное тестирование, дополнительно изучите Python, либо Java + фреймворк для тестирования (Selenium, PyTest, Robot Framework или другой). Это позволит вам создавать скрипты, которые будут автоматически выполнять тестирование, избавляя вас от лишней рутины. Очень желательно иметь опыт работы с инструментами нагрузочного тестирования. Это может быть JMeter, Gatling или любой другой популярный аналог. Такой опыт даст вам дополнительный вес в глазах работодателя, что сыграет вам на руку, поскольку конкуренция за место тестировщика весьма высока.  Очень желательно, чтобы у вас был наставник, который мог бы следить за вашим прогрессом, отвечать на возникающие вопросы, давать полезные советы и направлять в нужное русло. Итоги В данной статье мы постарались сделать максимальный охват темы тестирования. Была рассмотрена не только специальность тестировщик, но и два её надмножества — QC и QA. Сейчас линии разграничения между этими тремя профессиями по большому счёту стёрты и прослеживаются лишь в серьезных компаниях. В более мелких же тестировщик может запросто выполнять функции QA. Тем не менее, в нашей статье высветлены те технологии и области знаний, которые подойдут как тестировщику, так и QA инженеру. Также, мы рассмотрели ответвления Manual QA и Automation QA. Как выяснилось, без знания мануального тестирования вам не стать автоматизированным тестером. Ведь как можно писать автотесты, если ты в принципе не понимаешь, что, где и как исследовать на предмет багов? Несмотря на высокую конкуренцию за место тестировщика, количество вакансий остается одним из самых больших на рынке труда в IT. Посмотрите популярные ресурсы по трудоустройству в IT и вы сами в этом убедитесь. Поэтому нами и были указаны некоторые необязательные технологии — мы хотим вооружить наших читателей максимально красноречивым стеком, дабы вы были на голову выше конкурентов. Приведенный в статье стек технологий является прочной основой QA специалиста — как мануального, так и автоматизированного. Если этот материал не дал вам в полной мере ответ на вопрос “как стать тестировщиком и что следует для этого учить?”, делимся с вами ссылкой на вебинар одного из авторов ITVDN — действующего QA Engineer Андрея Шевцова. Если вас интересует данное направление и вы хотите стать QA инженером, предлагаем вашему вниманию подборку курсов и вебинаров ITVDN, которые вы найдете на странице специальности Quality Assurance.     Желаем успехов в изучении IT технологий! Оставайтесь с ITVDN!

Приветствуем вас, друзья! Сегодня мы хотим затронуть критически важную и актуальную тему, от которой зависит успех всех, кто берется за изучение программирования. Практически всегда новички в IT сталкиваются с такими проблемами, как: непонимание учебного материала; сложности с написанием кода; прокрастинация (лень); отсутствие мотивации; другие проблемы. Все эти и другие вещи создают серьезные препятствия на пути к освоению желанной IT-профессии. Однако, всё выше перечисленное — не корень проблемы, а лишь её симптомы. Чтобы сделать свое обучение эффективным, необходимо взглянуть правде в глаза. Какие действия приводят к подобным неудачам? Почему новички быстро “выгорают” и теряют интерес к обучению, а иногда даже перестают видеть смысл в дальнейшем изучении программирования? Почему затрачиваемое на изучение время приносит так мало пользы? Ниже приводим список того, как НЕ стоит поступать, если вы с нуля изучаете программирование и хотите стать хорошим разработчиком.    Не писать код Программирование — это занятие, которое очень сильно привязано к практике. Понятное дело, что любому новичку вначале необходимо понять в целом, куда он попал, что будет делать и как правильно это делать. Без теории никак не обойтись. Однако читать массу книг либо иных учебных материалов по написанию кода и не практиковаться — все равно, что учиться ездить на велосипеде по книгам, ни разу не попробовав прокатиться на нем самолично. Обычно такая привычка рождается из-за стандартного обмана нашего мозга. Мы смотрим на код в учебных материалах, на его объяснение, и нам кажется, что все кристально чисто и понятно — зачем тратить время и самому составлять такой же? Однако, стоит только сесть за написание кода, убрать все подсказки, как выяснится, что вы не можете реализовать работающую программу.  Каждый теоретический материал должен быть обязательно закреплен практическими задачами. Вы их можете самостоятельно придумывать на ходу; обычно именно так и происходит. Вы читаете, например, о массивах, у вас в голове всплывают какие-то вопросы в стиле “А можно ли сделать вот так? А что будет, если...” и это будет отличным способом попрактиковаться. Также не забывайте о множестве задач под каждую тему — вне зависимости от того, обучаетесь вы по книге, либо по другим материалам — никогда не упускайте возможность отточить навыки программирования.   Копировать код Данное действие нежелательно для новичков, ведь суть их обучения состоит в понимании концепций, а тупое копирование кода напрочь убивает это понимание. Старайтесь не поддаваться такому искушению и после изучения экземпляра кода обязательно попробуйте воспроизвести его самостоятельно. Очень важно, чтобы вы осознавали что за чем идет, как и почему происходит. В будущем это знание пригодится при решении новых задач, ведь опыт написания кода отложится у вас в голове, чего не скажешь о методе “копипаста”.   Уделять мало внимания основам Один из самых важных пунктов для любого обучения в принципе. На нем мы сделаем особый акцент и распишем данный раздел как можно подробнее. Бывало ли у вас чувство, что продуктивность вашего обучения (школа, университет, то же программирование) идет на спад — вы очень слабо понимаете теорию, новый материал никак вам не поддается, а практика особой ясности в происходящее не вносит? Такое может случаться и в повседневной жизни, когда необходимо освоить какой-то навык, но объем информации давит всем своим весом, истребляя всяческое желание развиваться и что-то учить. Чтобы такого не случалось, важно знать принцип, который поможет достичь успеха в любых начинаниях и повысит эффективность вашего обучения. Зайдем издалека. Есть три уровня овладения какой бы то ни было дисциплиной. Их ключевое отличие в количестве внимания и концентрации, которые необходимо выделить для применения знаний на практике:   Знание. Вам необходимо выделять порядка 90% всего вашего внимания и концентрации, чтобы применить знания на деле. Как пример, школьник младших классов, который решает простейшие примеры на умножение и деление — ему необходима львиная доля усилий, чтобы каждый раз вспоминать таблицу умножения. Умение. На этом уровне человек оказывается, когда он набил руку и уже может выделять на практическое применение знаний меньше концентрации и внимания, а именно — порядка 40%.  Навык. Вы выполняете задачу практически не концентрируясь на ней, однако качество выполненной работы сохраняется. Для примера можно сравнить начинающего водителя и водителя со стажем, который рассекает по дороге и практически не обращает внимания на нюансы, при этом соблюдая все правила дорожного движения. У него все процессы происходят словно на периферии сознания, позволяя без напряжения вести транспорт и чувствовать себя как рыба в воде. Водитель-профессионал на практическое применение знаний выделяет около 10% концентрации и внимания.   А теперь смоделируем интересную ситуацию: водитель-новичок принимает участие в гонках. Его уровень концентрации на базовых моментах вождения будет настолько высок, что он попросту разобьется. Или возьмем человека, который хочет научится рисовать красивые портреты. Ему показывают, как правильно какие линии рисовать. Затем он сразу пытается нарисовать портрет. Что в этот момент произойдет? Начинающий художник не сумеет нарисовать чего-то стоящего, ведь уровень его концентрации на базовых вещах будет очень высок. Этот человек будет сосредотачивать свое внимание на положении руки, степени нажатия на карандаш, плавности отрисованных контуров и т. д. Что следует делать, чтобы избежать ошибок, как в продемонстрированных примерах? Начинающему художнику необходимо отрабатывать базовые движения карандаша и кисти достаточно долго, пока не будет достигнут уровень навыка. Тогда тело привыкнет работать без постоянного контроля ума и будет проще занимать корректное положение руки, вести ровную линию и концентрироваться на чем-то более масштабном, а не на “низкоуровневых” нюансах. Точно такой же подход нужен и начинающему водителю. Другими словами, нашим новичкам необходимо отработать базу до максимума. При этом скорость их обучения будет расти по экспоненте, ведь каждая новая ступень информации имеет меньше принципиально новых знаний, поскольку основывается на уже известных им данных. Это означает, что с каждым новым шагом концентрировать внимание им надо будет всё в меньшей степени. Каждая новая ступень будет даваться нашим друзьям все легче и легче, ведь у них будет достаточно сил, дабы сконцентрироваться на новой информации, а не страдать от непонимания из-за плохо усвоенной информации предыдущего этапа. Проецируем всё выше изложенное на обучение в IT. Вы начали заниматься программированием — найдите основу, базу, главный набор навыков, который стоит освоить. Тренируйтесь до полного совершенства над базисом, не проскакивайте темы и не изучайте их лишь поверхностно. Однако, если чувствуете, что на данный момент ну никак не можете осилить материал, можете перейти к следующей теме или взять небольшой перерыв (желательно физическая активность), но по истечению определенного количества времени обязательно вернитесь и закройте пробел. Добейтесь полного понимания и владения всеми базовыми вещами дисциплины и только потом переходите к новому кругу информации. Когда вы возьмете его (новый круг информации) в оборот и изучите все необходимое на данном этапе, то заметите, что на это ушло гораздо меньше усилий и времени, чем вы ожидали. Так делайте с каждым следующим этапом на пути к освоению языка программирования. В один момент вы обнаружите, что обогнали тех, кто проходил все темы поверхностно и будете гораздо сильнее их в кодинге. Конечно, этот путь требует добротных временных затрат, но если вы хотите стать хорошим программистом, то на этапе обучения вы просто обязаны уделять базе этой дисциплины солидный объем времени.   Бояться спросить Фобия, актуальная не только в обучении программированию, но и в других сферах нашей жизни: в школе/лицее/гимназии/колледже, в вузе, на работе, да и вообще где угодно. Спрашивать можно и даже нужно. Однако, стоит учитывать несколько нюансов: 1) Вопрос не должен быть глупым. 2) Перед тем, как задать его, вы должны подумать над проблемой, поискать решения и попробовать самостоятельно прийти к развязке. Когда вы поймете, что действительно сделали все, что в ваших силах, но ничего не добились, можете смело обращаться за помощью, не забыв описать предпринятые вами шаги помощнику (-ам).      Сразу идти и писа́ть на форумы, предварительно не погуглив хорошенько (неумение искать информацию) Вторая сторона медали тезиса под номером 4. Навыки использования поисковой системы (обычно это Google) и таких сервисов, как Stack Overflow, habr и других является обязательными для любого, кто связан с IT сферой. Вы будете всегда сталкиваться с определенными трудностями и самый оптимальный подход к их решению — поиск ответов в интернете. Если вы новичок, то практически на любой возникнувший у вас вопрос, уже был ранее дан ответ на одном из ресурсов, и это важно всегда помнить. Бывают случаи, если человек задает откровенно глупый вопрос на каком-то из форумов, либо вопрос, на который уже много раз отвечали, то такого товарища начинают банить, отрезая возможность что-либо спрашивать на сервисе в принципе. Так что гуглите, гуглите и еще раз гуглите. Один из самых полезных навыков в IT-отрасли. Если никак не получается найти нужную информацию — смотрите пункт 4 этой статьи.      Рассчитывать ТОЛЬКО на курсы Также одна из распространенных ошибок среди желающих освоить IT-специальность. Изучение программирования и смежных технологий требует достаточно большого количества времени. Это значит, что занятия 3 раза в неделю по 2 часа — слишком мало для полноценного освоения специальности. Так что же получается, вас обманывают на курсах и просто выкачивают деньги? Вовсе нет. Такая ситуация абсолютно нормальная; более того, она даже необходима. Сфера информационных технологий очень динамична, в ней постоянно что-то меняется, что-то устаревает, что-то обновляется и предстает в совершенно новом виде. Разработчик должен всегда учиться, дабы соответствовать требованиям даже не сегодняшнего, а завтрашнего дня. Подход к обучению на курсах предусматривает большую самостоятельную работу, которая будет вашей неотъемлемой спутницей во время будущей профессиональной деятельности. Умение самостоятельно учиться и постоянно развиваться как специалист — обязательный атрибут разработчика в IT. Поэтому для освоения любого языка программирования или IT-специальности в целом недостаточно простого посещения курсов. Вы должны уделять много времени внеурочному обучению: выполнять все д/з и учебные проекты, самостоятельно практиковаться на задачках. Большое количество практики вне занятий даст вам максимальный экспириенс от курсов. Как результат, вы преуспеете в обучении и станете кандидатом на желаемую должность, и при этом будете иметь прочную базу знаний и умений.         Заниматься обучением нерегулярно Утверждение тесно связано с предыдущим пунктом. Только там мы делали акцент на курсы по программированию и IT-специальностям, а здесь речь пойдет о самостоятельном обучении. Чуть ли не самые главные камни преткновения всех айтишников-самоучек — слишком мало времени на обучение + нерегулярные занятия. Недостаток выделяемого на обучение времени выливается в его чрезмерную длительность и потерю мотивации. Вы вроде и учитесь, а результата как такового нет. Нерегулярность занятий также убивает мотивацию и искореняет приложенные до этого усилия. Из вашей головы “вытекают” уже имеющиеся знания, теряются обретенные умения.  Обязательно разработайте план своего обучения и всегда придерживайтесь его. Старайтесь не поддаваться лени; если надо — заставляйте себя. Это вполне нормально, что ваш мозг сопротивляется учебным процессам, ведь его задача — уберечь подконтрольный ему организм от лишних забот и телодвижений, оставаясь при этом в максимальном физическом и психическом комфорте. Но, как мы знаем, без труда не вытащишь и рыбки из пруда.   Излишний перфекционизм Перфекционизм опасен бездействием и лишними нервами. Вы хотите выполнить какую-то задачу идеально, но не знаете, как это сделать, поскольку не обладаете тем уровнем знаний и опыта, которые для этого требуются. В итоге вы просто ничего не делаете, растрачивая время впустую. Соответственно, и нервишки шалят — работа стоит, время идет, а ни результата нет, ни эйфория от выполненной задачи не наступает. Пока вы учитесь, старайтесь выполнять задания без оглядки на то, насколько это решение идеально. Для начала сделайте так, как знаете. В будущем, используя новые знания и навыки, вы сможете выработать более оптимальное решение.   Учить множество языков (бросаться со стороны в сторону) Часто бывает, что новички не сразу определяют “своё” IT-направление, в котором хотят развиваться. В таком случае некоторые начинающие предпринимают решение выучить и первое, и второе, и пятое, и десятое, а там уже будет видно. Так вот этой стратегией лучше не пользоваться, хотя в теории всё звучит более чем логично. Каждый язык программирования требует определенных временных затрат и активных умственных усилий. Поскольку программирование — это в подавляющем большинстве практика, с каждым новым языком вы будете все больше и больше забывать все, что выучили до этого, ведь вы не практикуетесь. Если у вас феноменальные умственные способности, позволяющие учить языки очень быстро и не забывать все выученное — вам это не страшно, однако, среднестатистический человек не потянет такую планку. Плюс каждый из нас хочет достигать своих целей как можно быстрее, а путь с длительным изучением различных языков программирования явно не то, на что вы рассчитываете. Вы постоянно что-то изучаете, пишите код, но с ростом знаний и навыков вы скоро почувствуете, что нуждаетесь в чем-то большем. Чтобы обучение программированию давало свои плоды, оно должно в какой-то момент начать применяться в реальных боевых задачах. Если на этом ответственном этапе вы примете решение бросить язык и переключится на изучение нового, ваши знания и умения касательно текущего языка начнут забываться. Как результат — время потрачено впустую (причем приличный объем времени), а поскольку изученное не было подкреплено реальным боевым проектом, мотивация будет также вас покидать. Вас попросту не хватит для того, чтобы сделать хороший охват всех популярных языков. Гуру программирования могут себе позволить изучение основных принципов нового языка программирования за пару недель, однако у него уже есть недюжинный опыт и знания. Вам, как начинающему разработчику, не стоит предпринимать подобные действия. Но как тогда выбрать свой путь в IT? Все достаточно просто. В сети интернет вы можете найти множество материалов касательно того, где можно реализовать себя в IT. Изучите все возможные сферы и выберите 1-2, которые вам больше всего понравились. Теперь можете поверхностно опробовать инструментарий каждой из них. Опять-таки, углубляться никуда не стоит — вам необходимо понять, все ли вас устраивает, нравится ли вам выбранный язык программирования и те задачи, которые вы будете на нем реализовывать. Когда сделаете окончательный выбор, можете приступать к изучению всех необходимых языков и технологий, оттачивать навыки написания кода и разрабатывать проекты для портфолио. Чтобы изучить предметную область вы можете, к примеру, воспользоваться записанными вебинарами образовательной платформы ITVDN. На момент написания статьи были выпущены следующие вебинары, касающиеся IT-профессий:   Как стать Андроид разработчиком? Как стать Python разработчиком? Как стать C# / .NET разработчиком? Как стать Java разработчиком? Как стать FrontEnd разработчиком?    и другие.     На нашем YouTube канале вы также можете найти множество полезного контента. Если вы хотите узнать о том, какое из популярных направлений в разработке выбрать, можете взглянуть на 3.5-часовой вебинар под названием “Как стать программистом? Frontend, Java, Python или .NET - что выбрать?”. Его автор — Дмитрий Охрименко — CEO CyberBionic Systematics, сертифицированный тренер Microsoft и автор курсов по .NET и FrontEnd разработке с опытом в разработке более 10-ти лет. Следите за нашим каналом и соцсетями, чтобы не пропустить новые вебинары и тренинги! Все полезные ссылки оставим в конце статьи.   Слишком глубоко копаться в языке/технологии vs поверхностное изучение Данный пункт также в определенной степени относится к предыдущему. Но что он подразумевает? Например, если вы решили учить какой-то популярный высокоуровневый язык программирования, не надо лезть к нему под капот. Безусловно, вы должны узнать, на чем держится выбранный язык, что лежит в основе его функционирования, но тщательно изучать его фундамент не надо. Вы не обязаны лезть в глубины, добираться до низкоуровневого Assembler, затем изучать работу процессора в принципе и т. д. Вам это не нужно. Если провести аналогию между программированием и вождением автомобиля, то программист — это водитель. Водитель должен знать, из чего состоит его транспортное средство, но знать всё до мельчайших подробностей нет нужды — это уже работа автомеханика. Задача водителя — управлять машиной, так же само, как задача программиста — писать код. Обратная сторона медали заключается в поверхностном изучении языка программирования и примыкающих к нему технологий. Поверхностное изучение хорошо, когда вы делаете выбор между несколькими языками и желаете узнать, какой вам больше по душе. Но когда вы определились с направлением и языком, прыжки по верхам — то, от чего вы должны отказаться. На данном этапе углубление и тщательное изучение технологий для вас очень важно. Однако, напомним, что уходить в самые низы выбранного языка и технологий тоже не следует.   Избегать общения с IT-специалистами Достаточно важный момент, которому, однако, уделяется мало внимания. Рассмотрим ситуацию с двух сторон: 1) Вы посещаете соответствующие курсы по программированию. 2) Вы самостоятельно обучаетесь. Первый случай. Вы изучаете программирование на курсах, но неактивны с преподавателем и вашими одногруппниками. Это неправильная ситуация. На занятиях всегда возникают вопросы, и их надо задавать. Стесняться ни в коем случае не надо. Один из важных навыков программиста — коммуникабельность; в данной ситуации вы и тренируете свою общительность, и получаете ответы на возникающие вопросы. Кстати, хороший преподаватель всегда рад вопросам от своих учеников. Как результат — ваше обучение более продуктивное, вы чувствуете хорошую отдачу и выносите из каждого занятия действительно ценную информацию, получая больше знаний. Второй случай. Вы учитесь самостоятельно, сами практикуетесь, но вам некому показать результаты своей работы. Никто не может оценить ваши труды. Это также не есть хорошо, ведь теряется обратная связь — вы банально не знаете, а грамотно ли составлена программа, правильно ли выполнена верстка веб-страницы и т. д. На этапе обучения было бы очень здорово иметь собственного ментора — наставника, который занимается профессиональной разработкой в том направлении, которое вас привлекает. Если порыскать в гугле, можно найти сообщества, занимающиеся организацией менторства, или на крайний случай можно просто пользоваться помощью пользователей специализированных форумов. Главное — не задавать глупых вопросов, хорошенько формулировать свои мысли/вопросы и не быть пассивным.   Бросать дело на полпути Популярная среди новичков, школьников и студентов практика из оперы “И так сойдет!”. На самом деле ничего подобного. Вы изучаете программирование для себя, для своего успешного будущего. В ваших же интересах стать хорошим востребованным разработчиком. А как этого достичь, если ваши проекты напоминают, скорее, огрызки, чем полноценную реализацию задуманного? Здесь могут быть 2 варианта: либо вы плохо понимаете какую-то тему и не уделили ей должного внимания (пробел в знаниях), либо у вас дурная привычка, которая мешает вам учиться, а в будущем будет мешать и вашей карьере. С этим нужно бороться и не пренебрегать такой, на самом деле, большой проблемой. В конце концов, в резюме добавлять такие проекты стыдно. Да и на работодателя такая визитная карточка будет действовать отрицательно. Будьте грамотны и всегда доводите свои работы до конца. Это полезный навык для любой сферы жизнедеятельности.           Не искать работу, когда ты уже к ней готов Проблема, возникающая на поздних этапах обучения, когда вы уже в целом готовы подавать резюме в компании, однако, вас сдерживает неуверенность в своих силах. Вашими спутниками становятся такие мысли, как: “А вот, может, это мне еще стоит подучить...”, “Тут надо еще подтянуть”, “Да мне еще проектов так N надо реализовать...”, “Я 100% потерплю неудачу на первом же собеседовании” и другие. Суть в том, что коммерческая разработка — это, фактически, новый этап вашего обучения. Этап, на котором вас ожидают настоящие нагрузки и задачи, ответственность за написанный код, командная работа, митинги с обсуждениями задач и многое другое. Если вы не перейдете на этот этап, то так и останетесь болтаться на предыдущем, теряя мотивацию, а вместе с ней и полученные навыки и знания. Не уверены в своих силах, но весь необходимый материал усвоили и умеете применять на практике? Рискните и подайте резюме, сходите на собеседование —  так вы по крайней мере сможете адекватно оценить свой уровень знаний и умений и уже будете отталкиваться от фактов, а не от собственных страхов и предубеждений. Как определить, что вы уже готовы искать работу? Открываете описание целевых вакансий, смо́трите на требования; если вы, условно, знаете 8 из 10 требуемых фреймворков, значит, полный вперед! “Знаете фреймворки” — это: а) Вы их использовали в каком-либо из своих проектов; б) Эти проекты работают, причем работают нормально.   Незнание английского Английский язык вам понадобится в любом случае — кто бы что ни говорил и как бы вы себя не убеждали в обратном. На этапе обучения вы будете использовать его во время поиска ответов и различных дополнительных сведений о выбранном языке программирования и/или смежных технологиях. Сюда входят как официальные специализированные источники, справочные материалы, книги, так и всевозможные форумы, статьи, заметки и отзывы других разработчиков/учащихся. Русскоязычные ресурсы сильно уступают по своему количеству и насыщенности иностранным, потому все дороги таки приведут вас к зарубежным.  Для успешного взаимодействия с подобными источниками ваш уровень инглиша должен быть не ниже Intermediate. На работе вам также нужен английский: для профессионального развития, подтягивания знаний, их обновления, для того же поиска решений возникающих проблем. Помимо этого, этот язык будет важен при работе на иностранных заказчиков и/или в том случае, когда работаете в команде с иностранцами. Здесь уже желательно обладать английским не ниже уровня Upper Intermediate.   Заключительное слово Надеемся, что данная статья стала ценной находкой для вас. Здесь мы постарались затронуть самые важные ошибки, которые допускают начинающие разработчики. Если вы их устраните, продуктивность вашего обучения гарантировано пойдет вверх и принесет нереальный профит. Старайтесь, прикладывайте усилия и у вас все обязательно получится! Здесь вы сможете отслеживать все самые главные вкусности от ITVDN: FB, VK, Linkedin, Twitter, Instagram, Telegram.   Желаем вам побед в обучении! Обогащайтесь новыми знаниями и скиллами на ITVDN!

Дорогие друзья! Предлагаем вашему вниманию перевод статьи, опубликованной на DOU.ua 21 декабря 2020 года. Оригинальная версия на украинском языке доступна по ссылке. На этот раз предлагаем ознакомиться с актуальными вопросами, которые задают на технических интервью по JavaScript. Естественно, мы говорим о широком спектре специализаций, поэтому выбирайте свое направление и готовьтесь.   Junior Общие: 1. Какие методы HTTP-запросов вы знаете? 2. Какие версии HTTP-протокола вам известны? 3. Какие знаете коды ответа (состояния) HTTP? 4. Что такое Cross-Origin Resource Sharing? Как устранить проблемы с CORS? 5. Что такое cookie? 6. Какой максимальный размер cookie? 7. Что означает директива use strict? 8. Чем JS отличается при работе на front-end и back-end? 9. Что такое статическая и динамическая типизации? 10. Как клиент взаимодействует с сервером? 11. Что такое REST? 12. Объяснить понятие мутабельность/иммутабельность? Какие типы являются мутабельными и наоборот? 13. Как искать ошибки в коде? Используете ли вы дебаггер? 14. Каких известных людей из мира JS знаете?   JS Core 15. Какие существуют типы данных в JS? 16. Как проверить, является ли объект массивом? 17. Как проверить, является ли число конечным? 18. Как проверить, что переменная равна NaN? 19. Чем отличается поведение isNaN() и Number.isNaN()? 20. Сравните ключевые слова var, let, const. 21. Что такое область видимости? 22. Что такое деструктуризация? 23. Для чего предназначены методы setTimeout и setInterval? 24. Сравните подходы работы с асинхронным кодом: сallbacks vs promises vs async / await. 25. Можно ли записывать новые свойства / функции в прототипы стандартных классов (Array, Object и т. д.)? Почему нет? В каких случаях это делать можно? Как обезопасить себя, если нужно расширить прототип? 26. Назовите методы массивов, какие помните, и скажите, для чего они нужны. 27. Какие методы перебора массива знаете? В чем их отличие? 28. Как работают операторы присваивания / сравнения / строчные / арифметические / битовые и т. д.? 29. Опишите назначение и принципы работы с коллекциями Map и Set. 30. Что означает глубокая (deep) и поверхностная (shallow) копия объекта? Как сделать каждую из них? Ответы на некоторые из этих вопросов вы можете найти в видео курсе JavaScript Стартовый (урок 3, урок 5, урок 10), JavaScript Базовый (урок 3, урок 13, урок 19), ECMAScript 6 (урок 6).   Функции: 31. Какая разница между декларацией функции (function declaration) и функциональным выражением (function expression)? 32. Что такое анонимная функция? 33. Расскажите о стрелочных функциях (arrow function). В чем заключаются отличия стрелочных функций от обычных? 34. Что такое и для чего используют IIFE (Immediately Invoked Function Expression)? 35. Что такое hoisting, как он работает для переменных и функций? 36. Что такое замыкание (closure) и какие сценарии его использования? 37. Как вы понимаете замыкания? Что будет выведено в консоли в этом случае? var f = function() {   console.log(1); } var execute = function(f) {   setTimeout(f, 1000); } execute(f); // что выведет в консоль и почему f = function() {   console.log(2); } 38. Что такое рекурсия? 39. Что означает ключевое слово this? 40. Что такое потеря контекста, когда происходит и как ее предотвратить? 41. Методы функций bind / call / apply - зачем и в чем разница? Ответы на некоторые из этих вопросов вы можете найти в видео курсе JavaScript Стартовый (урок 11, урок 12) и JavaScript Базовый (урок 13, урок 14).   Front-end 42. Что такое DOM? 43. Сравните атрибуты подключения скрипта async и defer в HTML-документе. 44. Какая разница между свойствами HTML-элементов innerHTML и innerText? 45. Опишите процесс всплытия (bubbling) событий в DOM. 46. Как остановить всплытие (bubbling) события? 47. Как остановить дефолтную обработку события? 48. Чему равен this в обработчике событий (event handler)? 49. Что такое LocalStorage и SessionStorage? Какой максимальный размер LocalStorage? 50. Как получить высоту блока? Его положение относительно границ документа? 51. Что такое webpack? 52. Чем отличается dev-сборник от prod? Ответы на некоторые из этих вопросов вы можете найти в видео курсе JavaScript Базовый (урок 1, урок 6, урок 7, урок 8, урок 17) и ECMAScript 6 (урок 1).   Верстка 53. Что такое блочная модель CSS? 54. Какие способы центрирования блочного контента по горизонтали и вертикали знаете? 55. Какие подходы в верстке вам известны (float, flex, grid, etc.)? 56. Как сделать приложение responsive? 57. Какие есть принципы семантической верстки? 58. Зачем нужны префиксы для некоторых CSS-свойств (-webkit-, -moz- и т. д.)? 59. Как упростить написание кросс-браузерных стилей? 60. Практические задачи: прокомментировать и исправить пример плохого CSS или HTML. 61. Что такое CSS-препроцессоры? С какими работали? Что нового они приносят в стандартный CSS? Ответы на некоторые из этих вопросов вы можете найти в видео курсе HTML5 & CSS3 Стартовый (урок 5, урок 6), HTML5 & CSS3 Углубленный (урок 4). Курсы Верстка сайта на CSS Grid и Верстка сайта на FlexBox CSS дадут комплексные знания и практические навыки применения технологий FlexBox и Grid.   Angular 62. Перечислите основные компоненты фреймворка (модуль, роут, директива и т .п.). 63. В чем разница между компонентом и директивой? 64. Расскажите о жизненном цикле компонента. 65. Перечислите часто используемые хуки жизненного цикла компонента и расскажите, для чего они нужны? 66. В чем разница между конструктором и ngOnInit-хуком? 67. Как защитить роут от несанкционированного доступа? Какие механизмы предоставляет для этого фреймворк? 68. Что такое Lazy loading, как и для чего используется? 69. Какое назначение RouterOutlet? 70. Как компоненты могут взаимодействовать друг с другом? 71. Как создать two-way binding свойство для компонента? 72. Какие типы форм у фреймворка? В каких случаях и что лучше использовать? 73. Какие состояния у формы и как это можно применить? 74. Зачем нужны сервисы? Как с ними работать? 75. Что такое singleton-сервисы? Каково их назначение? Способ создания? 76. Какие есть способы объявления сервисов? 77. Для чего нужны модули? Сколько их должно быть в проекте? 78. Зачем нужны общие модули (shared)? 79. Какие преимущества типизации в TypeScript? 80. Какие возможности TypeScript можно использовать для типизации (здесь имеются в виду интерфейсы, типы, enum и т. д.)? 81. Какая разница между интерфейсом и классом? 82. В чем разница между интерфейсом и абстрактным классом? 83. Какая разница между интерфейсом и типом? 84. Что такое RxJS? Как он используется во фреймворке? Какие компоненты фреймворка тесно связаны с ним? 85. Чем отличаются Observable и Promise? 86. Для чего нужны Subjects? Какие типы Subjects существуют? 87. Как сделать несколько последовательных запросов к API с помощью HTTP-сервиса и RxJS? 88. Какая разница между switchMap, concatMap, mergeMap? 89. Как можно конфигурировать Angular-приложение? 90. Зачем нужны environment-файлы? Когда их лучше не использовать? 91. В чем разница между «умным» (smart) и «глупым» (dumb) компонентами? В каких случаях применяется каждый из них? 92. В чем разница между NgForm, FormGroup и FormControl и как их применяют для построения форм? 93. Зачем нужен и как работает async pipe? 94. Как следить за развитием фреймворка? Каких известных людей, связанных с Angular, знаете / читаете? Ответы на некоторые из этих вопросов вы можете найти в видео курсах Angular Базовый и Angular Углублённый.   React 95. Работали ли вы с классовыми компонентами? В чем их особенность? 96. Какие данные лучше хранить в состоянии компонента, а какие передавать через пропсы? Приведите пример. 97. Ознакомлены ли вы с хуками? В чем их преимущества? Приходилось ли делать свои и с какой целью? 98. Знакомы ли вы с фрагментами и порталами? Зачем они нужны? 99. Когда и для чего используют рефы? 100. Какие вы знаете методы жизненного цикла компонента? 101. В каком методе жизненного цикла компонента лучше делать запросы на сервер? Почему? 102. В каком методе жизненного цикла компонента лучше делать подписку и отписку от листенера? Почему? Зачем отписываться? 103. Был ли опыт работы с контекстом? Когда его стоит использовать? 104. В чем особенность PureComponent? 105. Работали ли вы с мемоизоваными селекторами (memoized selectors)? Для чего их используют и какой принцип работы? 106. В чем видите преимущества библиотеки React? 107. Почему библиотека React быстрая? Что такое Virtual DOM и Shadow DOM? 108. Зачем в списках ключи? Можно ли делать ключами индексы элементов массива? Когда это оправдано? 109. В чем основная идея Redux? 110. Работа со стилями в React. 111. React - это библиотека или фреймворк? Какая разница между этими двумя понятиями. 112. Можно ли использовать jQuery вместе с React? Почему да / нет? 113. Что такое codemod? 114. Приходилось ли вам настраивать проект React с нуля? С помощью каких инструментов вы это делали? 115. Перечислите все библиотеки, которые использовали в связке с React. 116. Что самое сложное вам приходилось реализовывать с помощью React? Ответы на некоторые из этих вопросов вы можете найти в видео курсах React Базовый и React Углублённый.   Back-end 117. Что такое REPL? 118. Что такое streams в Node.js? 119. Что такое middleware? 120. Для чего используют функцию setImmediate? 121. Зачем нужен app.param() в express? 122. Что такое token based authentication?   Базы данных 123. Напишите простой запрос для вычисления трех авторов, у которых больше всего книг. 124. Напишите запрос, который выбирает последние три комментарии для конкретного пользователя для двух таблиц: комментарии и пользователи. 125. Спроектируйте простую схему базы данных для библиотеки. 126. Для чего используют SQL-оператор HAVING? 127. Зачем используют SQL-оператор LEFT JOIN? 128. Чем отличается embed- от reference-связи в MongoDB? 129. В одном проекте программисты сохраняют данные в MongoDB-коллекции комментариев, используя такие типы данных (смотрите ниже). Что плохого в этом решении? id: ObjectID text: string author_id: string created_at: Date 130. В проекте понадобилось внести изменения в структуру таблиц, добавить несколько полей и индексы. Как программисты будут делать это на продакшене? Ответы на некоторые из этих вопросов вы можете найти в видео курсе SQL Базовый.   Инструменты 131. Каждый раз, когда вы делаете pull, почему-то случается конфликт в последней строке во всех файлах, которые вы редактировали. Что происходит? 132. Что делает команда git fetch? 133. Какой git hygiene подходы вы знаете? 134. Что такое CI / CD? Для чего это нужно?   Практические задания 135. Расскажите, какие есть способы копирования простого объекта типа obj = {a 1, b 2, c 3} 136. Напишите deep clone для объекта. 137. Назовите различные способы, как поменять местами значения двух переменных. 138. Менеджер попросил в задаче поменять статусы из «active, inactive» на «active, removed», но в коде фигурируют только цифры и непонятно, какой статус соответствует какой цифре. Как помочь будущим программистам не лезть в документацию по коду? Вопрос ставят на конкретном примере с кодом. 139. Необходимо сделать мини проект - список пользователей с формой создания / редактирования пользователя: Для хранения пользователей используйте Firebase (это бесплатно). Для стилизации используйте Bootstrap. Минимальный набор полей пользователя: имя; фамилия; электронная почта; телефон (в формате +380 (XX) XXX-XX-XX) дата рождения; будет плюсом - добавление аватара и возможность crop-картинки. Пользователи должны иметь возможность фильтрации и пагинацию. Проект должен содержать README-файл с шагами для запуска.   Middle Общие 1. Расскажите о пирамиде тестирования. 2. Какие типы автоматизированных тестов выпадала возможность писать? Какие библиотеки при этом использовали? Каким инструментам отдаете предпочтение и почему? 3. Что такое unit-тесты? Какое место в пирамиде тестирования занимают unit-тесты? 4. Что такое code coverage? Обязательно 100% покрытие тестами кода? 5. Как запретить браузеру отдавать кэш на HTTP-запрос? 6. Что такое XSS (Cross-Site Scripting)? 7. Расскажите о паттернах Observer, Pub / Sub. Какая между ними разница? Приведите примеры реализации этих паттернов в известных фреймворках / библиотеках / браузерных API. 8. С какой целью может быть использован event listener события fetch self.addEventListener ( 'fetch', event => {})? 9. Что такое Event loop и как он работает? Расскажите о микрозадачах и макрозадачах.   JS Core 10. Какие типы данных бывают в JavaScript? Какой будет результат выполнения кода? let firstObj = { name: 'Hello' }; let secondObj = firstObj; firstObj = { name: 'Bye' }; console.log(secondObj.name); 11. Что такое temporal dead zone? 12. Как работает boxing / unboxing в JavaScript? 13. В чем разница между оператором in и методом hasOwnProperty? 14. Опишите, с помощью чего в JS реализуются такие ООП-парадигмы, как инкапсуляция, полиморфизм, абстракция? 15. Что такое прототип? Как работает прототипное наследование в JS? Объясните работу кода. function Main () {} Main.prototype = { protected: true }; const obj = new Main(); Main.prototype = { protected: false }; console.log('Object protection: ', obj.protected); 16. Какая разница между композицией и наследованием? 17. Почему не стоит использовать конструкторы типа new String? 18. Расскажите о базовом устройстве и механизме работы Event loop. 19. Что такое записи (records) и кортежи (tuples)? Чем они отличаются от обычных объектов? 20. Какие различия в поведении ES5 функции-конструктора и ES2015 класса? 21. Как реализовать паттерн «Модуль»? 22. Почему typeof null возвращает object? 23. Что такое приведение (преобразование) типов в JS? 24. Что такое явное и неявное приведение (преобразование) типов данных в JS? Как происходит преобразование типов в следующих примерах: {}+[]+{}+[1] !!"false" == !!"true" ['x'] == 'x' 25. Что такое Garbage Collector? 26. Опишите основные принципы работы «сборщика мусора» в JS-движках (engines). 27. Опишите назначение и принципы работы с коллекциями WeakMap и WeakSet? Чем они отличаются от коллекций Map и Set соответственно? 28. Чем отличается Observable от Promise? 29. Что такое Promise? Назовите порядок выполнения then и catch в цепочке. Promise.resolve(10)   .then(e => console.log(e)) // ??   .then(e => Promise.resolve(e))   .then(console.log) // ??   .then(e => {     if (!e) {       throw 'Error caught';     }   })   .catch(e => {     console.log(e); // ??     return new Error('New error');   })   .then(e => {     console.log(e.message); // ??   })   .catch(e => {     console.log(e.message); // ??   }); 30. Расскажите о последовательном и параллельном выполнении асинхронных функций. В чем разница между Promise.all() и Promise.allSettled()? 31. Что такое дескрипторы свойств объектов? Расскажите об их практическом применение. 32. Назовите несколько способов создания постоянного (неизменного) объекта в JavaScript. 33. Как создать свойство у объекта, которое нельзя будет изменить? 34. Зачем нужен конструктор Proxy? Приведите пример использования. 35. Что такое ArrayBuffer? В чем разница между Uint32Array и Float32Array? Каков результат выполнения кода? const uint32Array = new Uint32Array(); Array.isArray(uint32Array); 36. Каким будет результат сравнения? const url = “HTTPs://xyz.com/path<to>page.html”; encodeURI(url) == encodeURIComponent(url); 37. Расскажите о генераторах и итераторах. 38. Объясните, что делает приведенный ниже код: function * fn(num) {   for (let i = 0; i < num; i += 1) {     yield console.log(i);   } } const loop = fn(5); loop.next(); loop.next(); 39. Расскажите о типе данных Symbol и его практическом применении. Как перевести число с 10-разрядной системы в 16 (2,8) разрядную систему счисления? Ответы на некоторые из этих вопросов вы можете найти в видео курсе JavaScript Стартовый (урок 3, урок 4, урок 13, урок 14) и JavaScript Базовый (урок 18, урок 19),  ECMAScript 6 (урок 6).   Функции 40. Объясните, что означает currying. Приведите пример использования на практике. 41. Приведите пример функции с мемоизацией. Когда следует применять эту технику? 42. Что такое чейнинг функций? Напишите пример с использованием этого подхода. 43. В чем разница между function и arrow function? Каким будет результат выполнения кода? const pluckDeep = key => obj => key.split('.').reduce((accum, key) => accum[key], obj) const compose = (...fns) => res => fns.reduce((accum, next) => next(accum), res) const unfold = (f, seed) => {   const go = (f, seed, acc) => {     const res = f(seed)     return res ? go(f, res[1], acc.concat([res[0]])) : acc   }   return go(f, seed, []) }   Front-end 44. В чем принципиальная разница между событиями mouseleave и mouseout? 45. В каком порядке обрабатываются пользовательские события в DOM (click, mouseover и т .д.)? FIFO или LIFO? 46. Что такое Event bubbling и Event capturing? 47. Сравните методы объекта event stopPropagation и stopImmediateProparation. 48. Какие есть подходы оптимизации производительности веб-страницы? 49. Как реализован механизм same-origin policy в браузере? На какие браузерные API он распространяется? 50. Назовите способы хранения данных в браузере. Сравните их. 51. Web worker`ы. Опишите особенности передачи данных между worker`амы и основным потоком, между разделенными worker`амы. 51. Что такое Transferable-объекты? 52. Расскажите о способах оптимизации выполнения ресурсоемких операций JS для улучшения производительности рендеринга контента на странице. 53. Почему ResizeObserver вызывает события изменения размера до воспроизведения элемента, а не после? 54. Расскажите, как вы понимаете Web Accessibility? 55. Опишите алгоритм создания функционала, который обеспечивает чтение содержимого .txt файла при перетаскивании его из файловой системы в окно браузера. 56. Что такое Virtual DOM? Ответы на некоторые из этих вопросов вы можете найти в видео курсе HTML5 & CSS3 Углубленный (урок 3), JavaScript Базовый (урок 1, урок 2, урок 3).   Верстка 57. Объясните разницу между единицами измерения px, em, rem. 58. Для чего нужны CSS-переменные? Приведите несколько примеров использования. 59. Что произойдет при добавлении следующего селектора? * {Box-sizing: border-box; } 60. Как адаптировать страницу для печати? 61. Опишите особенности кастомизации стилей стандартных элементов форм. 62. Что такое progressive рендеринг? Какие подходы используются? 63. Назовите несколько способов реализации lazy-loading медиаресурсов на странице. 64. Назовите популярные шаблонизаторы для фронтенд-разработки. Опишите особенности их использования. 65. Назовите популярные CSS-методологии и их различия. 66. Как работает CSS Grid? 67. Какие форматы изображений поддерживают анимацию? 68. Как отследить прогресс / окончание CSS @keyframes анимаций или плавных переходов, реализованных с помощью transition, в JS? 69. Какие CSS-свойства могут быть обработаны непосредственно через GPU? Что такое композитные слои и почему большое их количество может привести к аварийному завершению работы браузера на мобильных устройствах? 70. Как переиспользовать Инлайн SVG-элементы на странице? 71. Опишите способы оптимизации SVG-файлов. 72. Как реализовать иконочный шрифт из определенного набора SVG-файлов? 73. Что такое ложное жирное или ложное курсивное (Faux) начертание шрифтов? 74. Что такое #shadow-root в инспекторе HTML-страницы? 75. Зачем нужны Custom Elements? 76. Почему удаление лишних символов пробелов / символов переноса в HTML не отражается на конечной производительности загрузки страницы? 77. Что такое контекст отображения canvas? Какие существуют типы контекста для рендеринга двумерной и трехмерной графики? Ответы на некоторые из этих вопросов вы можете найти в видео курсе HTML5 & CSS3 Углубленный.   Angular 78. Как работает Dependency injection? Зачем это нужно? Расскажите об использовании кастомных инжекторов. 79. Что такое zone.js? Для чего Angular использует зоны? С какой целью можно использовать NgZone-сервис? 80. Как работает Change detection? Как можно оптимизировать компонент с помощью схем Change detection? Какие еще есть приемы для оптимизации рендеринга (связанные с Change detection)? 81. Как выполнить конфигурацию HTTP-сервиса? Зачем она нужна? Обработка HTTP-ошибок? 82. Какие есть подходы к организации работы с данными? 83. Как подготовить сборник к деплою? 84. Что такое NgRx? Когда стоит использовать? 85. В каких случаях лучше использовать Renderer-сервис вместо нативных методов? И наоборот? 86. Как работают и для чего нужны резолверы? Как получить данные, загруженные резолверами? 87. Как работают и зачем нужны динамические компоненты? Приведите примеры их целесообразного использования. 88. Какая разница между @ViewChild и @ContentChild? 89. Что делает код и как иначе можно связать класс компонента с переменной? @HostBinding ( 'class.valid') isValid; 90. Как можно кэшировать данные, используя сервисы или RxJS? 91. Что такое асинхронная валидация форм? Когда применяется и как реализуется? 92. Зачем нужна forRoot-функция модуля? 93. Какая разница между декларированием и экспортом компонента из модуля? 94. Почему плохо «провайдить» сервис с shared-модуля в lazy-loaded модуль? (Вопрос о scope модулей.) 95. Что такое :: ng-deep и для чего используется? 96. Какие тесты можно запустить для Angular-программы? Какие инструменты используют для тестирования Angular-программы? 97. Как протестировать API-сервис? Ответы на некоторые из этих вопросов вы можете найти в видео курсах Angular Базовый и Angular Углублённый.   React 98. Что такое JSX? Что лежит в его основе? 99. Как работает алгоритм Virtual DOM? 100. Для чего нужно свойство key во время рендеринга списков? 101. В чем разница между функциональными и классовыми компонентами? 102. Зачем и когда нужно передавать props в super() при использовании классовых компонентов? 103. Почему нужно использовать setState() для обновления внутреннего состояния компонента? 104. В чем заключается принцип «подъема состояния»? 105. Какие библиотеки менеджмента состояния React-приложения вы знаете? Зачем они нужны? 106. Когда следует использовать Redux? Какие есть альтернативы? 107. Redux vs Mobx? 108. Расскажите о базовом принципе работы React Hooks. 109. В чем разница между createRef и useRef? 110. Когда следует использовать React refs? Когда не стоит? 111. Какие недостатки библиотеки React видите? 112. Какие паттерны используете вместе с React? 113. Как относитесь к типизации вместе с React? 114. Как построить хорошую архитектуру React-проекта? 115. Оптимизация React-приложений? Как измерить производительность программы? 116. Можно ли приложение на React встроить в другое приложение на React? Ответы на некоторые из этих вопросов вы можете найти в видео курсах React Базовый и React Углублённый.   Back-end 117. Почему Node.js однопоточный, а не многопоточный? 118. Что такое event driven development? 119. Сравните fork() и spawn() методы. 120. Расскажите о Node.js фреймворках, которые использовали. Какая между ними разница? 121. Опишите словам код ендпоинта, который должен сохранить с клиента файл размером 4 гигабайта и положить его на S3 или другой CDN. 122. Что такое микросервисы, зачем их используют? 123. В каких случаях вы бы выбрали монолит, а в каких - микросервисы? 124. Как понять, что приложение в определенный момент работает исправно? 125. Как понять, что приложение за последние три дня работал исправно? 126. Как происходит проверка правильности пароля при использовании bcrypt? 127. Что такое JWT? 128. Джуниор прислал код на ревью. Что здесь не так? Как исправить? router.post ( '/ users', async (req, res, next) => {   const user = await db.createUser (req);   if (user) {     return res.json (users);   }   res.json ({error: "can not create user"}) })   Базы данных 129. Что такое Redis и для чего его используют? 130. Какие базы данных использовали? Какая разница между SQL и NoSQL? 131. Для двух таблиц - комментарии и пользователи - напишите запрос, который выбирает последние три комментария для каждого пользователя. 132. Я как заказчик прошу выбрать вас базу данных для нового проекта. Ваши действия?   Инструменты и другое 133. Для чего нужен package-lock.json? 134. В чем разница между npm install и npm ci? 135. Для чего нужны бандлеры? 136. Расскажите о модульном подключении скриптов. Приведите пример использования загрузчиков / бандлеров модулей. 137. Чем различаются git merge и git rebase? 138. Что такое staging area в git? 139. Опишите процесс code review. Назовите основные правила, способы разрешения конфликтов и споров во время его проведения.   Практические задания 140. Напишите функцию Sleep (ms), которая останавливает выполнение async-функции на заданный промежуток времени. 141. Реализуйте один из методов массива (например, splice). 142. Напишите функцию с RegExp для нахождения всех HTML-ссылок в строке. 143. Реализуйте функцию, которая исполнит callback для всех элементов определенной ветви DOM-дерева. 144. Реализуйте таблицу с виртуальным скролом. 145. Реализуйте функцию преобразования URL query строки в JSON.   const inData = "user.name.firstname=Bob&user.name.lastname=Smith&user.favoritecolor=Light%20Blue"; function queryObjectify(arg) { // ?? } queryObjectify(inData) /* Результатом виконання для вхідного рядка, повинен бути наступний об’єкт {   'user': {     'name': {       'firstname': 'Bob',       'lastname': 'Smith'     },     'favoritecolor': 'Light Blue'   } }; */ 146. Реализуйте функцию нахождения пересечения двух массивов. const first = [1, 2, 3, 4]; const second = [3, 4, 5, 6]; function intersection (a, b) { // ?? } intersection(first, second) // -> [3, 4] 147. Реализуйте функцию / класс для генерации HTML. const HTMLConstruct = {}; HTMLConstruct.span('foo'); // -> <span>foo</span> HTMLConstruct.div.span('bar'); // -> <div><span>bar</span></div> HTMLConstruct.div.p( HTMLConstruct.span('bar'), HTMLConstruct.div.span('baz') ); // -> <div><p><span>bar</span><span>baz</span></p></div> 148. Если есть проект с ограниченными сроками и некритичной производительностью, чем будете руководствоваться при выборе библиотек, подходов? Или все же будете обращать внимание на производительность? Или наоборот: сроки нелимитированные, производительность важна. Ваши действия?   Senior Общие 1. Расскажите о функциональном программировании. 2. Что такое TDD (Test Driven Development) / BDD (Behaver Driven Development)? 3. Расскажите подробно о работе HTTPS. 4. Какой стек технологий можно выбрать для реализации клона какого-нибудь известного проекту и почему? 5. Имеется проект на старых технологиях, необходимо в него вносить изменения. Как это сделать лучше всего? 6. Если у кандидата есть опыт работы с несколькими фреймворками: какой будете использовать для следующего проекта? Какие факторы будут влиять на выбор? 7. Что такое V8 Engine?   JS Core 8. Реализация паттерна Class Free OOP (HTTPs://observablehq.com/@bratter/class-free-oop). 9. Патерн async disposer (HTTPs://advancedweb.hu/what-is-the-async-disposer-pattern-in-javascript). 10. использование регулярных выражений. Когда приемлемо / неприемлемо? Как они работают? Как можно сделать читабельный код?   Front-end 11. Как браузер определяет, можем ли мы общаться между вкладками? 12. Что такое Content Security Policy? 13. Как избежать загрузки кэшированных файлов скриптов и стилей? 14. Что такое requestAnimationFrame? 15. Расскажите о микросервисной архитектуре Front-end App. 16. Что такое Shadow DOM? 17. Сравните nextElementSibling и nextSibling. 18. Какие знаете метрики веб-сайта?   Angular 19. Как проводится конфигурация NgZone-модуля? Когда это необходимо? 20. Что раздражает в фреймворке? Что бы вы изменили? 21. Если бы вы решали, что добавить в следующем релизе фреймворка, какая фича это была бы? 22. Писали ли вы кастомные декораторы? Если да, то зачем? 23. Сделать ревью кода и дать замечания по архитектуре. 24. Расскажите, как бы вы делали такие фичи. Опишите архитектуру фичи в приложении.   Back-end 25. Сравните Common.js с AMD Modules и ES6 Imports. 26. Какой фреймворк выбрали бы для бэкенда, почему? 27. Опишите своими словами, как работает OAuth v2. 28. Есть проект с источниками памяти, как их обнаружить, устранить и предотвратить это в будущем? 29. Есть проект с performance issues, как их обнаружить, устранить и предотвратить в будущем?   Базы данных 30. Какие альтернативные виды баз данных используете? 31. Что такое RDS и почему он иногда не подходит? 32. Что такое SQL Injections и как их избежать? 33. Почему для запросов в БД надо использовать плейсхолдеры? 34. Как спроектировать кластер на MongoDB? 35. Для чего используют MongoDB Aggregation framework? 36. Расскажите о GraphQL.   Инструменты 37. Можете ли вы описать суть методологии git flow в двух словах? 38. Что означает требование делать squash commits во время rebase? 39. Каково ваше мнение об альтернативных системы контроля версий (Version Control System)? 40. Какие конвенции знаете и используете для git? 41. Расскажите о своем опыте использования / внедрения CI / CD. 42. Необходимо настроить деплой проекту на несколько сред. Расскажите, как бы вы построили процесс? Какие инструменты использовали бы?   Практические задания 43. Реализуйте асинхронный метод filter для Array (должны работать await). 44. Реализуйте функцию reduce при помощи рекурсии. 45. Как можно было бы сделать toggle-компонент, как в iPhone, без использования JS?   Благодарим за помощь в подготовке статьи Вячеславу Колдовскому, Ивану Рыженку, Николаю Галкину, Александру Бурмистрову, Владу Балабашу, Андрею Шумаде, Ивану Кувацкому, Андрею Кладочному.

Дорогие друзья! Предлагаем вашему вниманию перевод статьи, опубликованной на DOU.ua 30 сентября 2020 года. Оригинальная версия на украинском языке доступна по ссылке. Редакция DOU пообщалась с разработчиками, которые проводят технические собеседования Python-специалистов для различных уровней, и собрала примерный список вопросов к кандидатам. Конечно, он не является исчерпывающим, однако содержит типичные вопросы.   Вопросы для Junior   От джуниоров требуют знать и уметь применять базовые структуры данных и модули, простейшие запросы к базам данных, знать простейшие команды системы контроля версий и тому подобное. Общее по Computer Science и Web Development: 1. Что такое инженерия и процесс разработки в целом? 2. Какие знаете принципы программирования? 3. Чем отличаются процедурная и объектов-ориентированная парадигмы программирования? 4. Какие основные принципы ООП (наследование, инкапсуляция, полиморфизм)? 5. Что такое множественное наследование? 6. Какие есть шесть этапов разработки продукта в Software Development lifecycle и какая разница между Agile и Kanban? 7. Какие есть методы HTTP-запросов и какая между ними разница? 8. Как выглядят HTTP-request / response? 9. Что такое авторизация и как она работает? 10. Что такое cookies? 11. Что такое веб уязвимость? 12. Какие знаете классические базы данных? 13. Как читать спецификацию в конкретном языке (например, PEP8 в Python)? 14. Как происходит взаимодействие клиента и сервера? 15. Какие есть подходы к проектированию API? 16. Как использовать паттерны программирования? 17. Что такое Acceptance Testing и зачем его используют? 18. Что такое модульные и интеграционные тесты, API-тесты? 19. Как писать unit-тесты? 20. Какие есть best practices в написании автотестов? 21. Какие базовые команды системы контроля версий? 22. Как использовать Git? 23. В чем разница между хешированием и шифрованием? Ответы на некоторые из этих вопросов вы можете найти в видео курсах Python Базовый, Python Углублённый, Основы работы с Git.   Python: 24. Python - интерпретируемый язык или компилируемый? 25. Какие есть меняющиеся и постоянные типы данных? 26. Что такое область видимости переменных? 27. Что такое introspection? 28. Разница между is и ==? 29. Разница между __init __ () и __new __ ()? 30. В чем разница между потоками и процессами? 31. Какие есть виды импорта? 32. Что такое класс, итератор, генератор? 33. Что такое метакласс, переменная цикла? 34. В чем разница между итераторами и генераторами? 35. В чем разница между staticmethod и classmethod? 36. Как работают декораторы, контекстные менеджеры? 37. Как работают dict comprehension, list comprehension и set comprehension? 38. Можно ли использовать несколько декораторов для одной функции? 39. Можно ли создать декоратор из класса? 40. Какие есть основные популярные пакеты (requests, pytest, etc)? 41. Что такое lambda-функции? 42. Что означает *args, **kwargs и как они используются? 43. Что такое exceptions, <try-except>? 44. Что такое PEP (Python Enhancement Proposal), какие из них знаете (PEP 8, PEP 484)? 45. Напишите hello-world сервис, используя один из фреймворков. 46. Какие есть типы данных и какая разница между list и tuple, зачем они? 47. Как использовать встроенные коллекции (list, set, dictionary)? 48. В чем заключается сложность доступа к элементам dict? 49. Как создается объект в Python, для чего __new__, зачем __init__? 50. Что знаете из модуля collections, какими еще built-in модулями пользовались? 51. Что такое шаблонизатор и как в нем выполнять базовые операции (объединять участки шаблона, выводить дату, выводить данные с серверной стороны)? 52. Как Python работает с HTTP-сервером? 53. Что происходит, когда создается виртуальная среда? Ответы на некоторые из этих вопросов вы можете найти в видео курсах Python Стартовый (урок 2, урок 4-8), Python Базовый (урок 1, урок 6, урок 7, урок 9), Python Углублённый (урок 1, урок 4).   Базы данных: 54. Какие есть базовые методы работы с SQL- базой данных в Python? 55. Что такое SQL-транзакция? 56. Как сделать выборку из SQL-базы с простой агрегацией? 57. Как выглядит запрос, который выполняет JOIN между таблицами и к самим себе? 58. Как отправлять запросы в SQL-базу данных без ORM? Ответы на некоторые из этих вопросов вы можете найти в видео курсе SQL Базовый.   Алгоритмы: 59. Что такое алгоритмы (например, Big-O notation)? 60. Какие есть базовые алгоритмы сортировки? 61. Что такое Bubble Sort и как это работает? 62. Что такое линейная сложность сортировки?   Вопросы для Middle   Если джуниору все надо подсказывать и помогать, то мидл может самостоятельно взять что-то новое и быстро его изучить и понять. У него накоплено достаточно знаний и опыта, чтобы быстро овладевать новым. Он может прийти и обсудить с опытным разработчиком, проконсультироваться, но окончательных решений не принимает. Обычно у мидлов спрашивают: 63. Ориентируетесь ли в *nix, можете ли написать скрипты/автоматизацию для себя и коллег? 64. Что такое многопоточность? 65. Что такое архитектура веб сервисов? 66. Как работает современное нагруженное веб приложение (нарисовать и обсудить примерную архитектуру, например, Twitter или Instagram)? 67. Что нужно для сайта / сервиса среднего размера (redis \ celery \ кэш \ логирование \ метрики)? 68. Как написать, задеплоить и поддерживать (микро) сервис? 69. Как масштабировать API? 70. Як проводить Code review? 71. Что такое абстрактная фабрика, как ее реализовать и зачем ее применяют? 72. Что такое цикломатическая сложность?   Python: 73. Async Python: как работает, зачем, что под капотом? 74. Сравнить асинхронные web-фреймворки. 75. Что такое модель памяти Python? 76. Что такое SQLAlchemy (Core и ORM частей) и какие есть альтернативы? 77. Принципы работы и механизм Garbage collection, reference counting? 78. Как работает thread locals? 79. Что такое _slots_? 80. Как передаются аргументы функций в Python (by value or reference)? 81. Что такое type annotation? 82. Для чего используют нижние подчеркивания в именах классов? 83. Статические анализаторы: Flake8, Pylint, Radon. Ответы на некоторые из этих вопросов вы можете найти в видео курсе Python Углублённый (урок 3).   Базы данных: 84. Разница между SQL и NoSQL? 85. Как оптимизировать SQL-запросы? 86. Какие есть уровни изоляции транзакций? 87. Какие есть виды индексов? 88. Точечные вопросы по выбору БД, движков БД? 89. Front-end: есть ли опыт работы с «современным» JS (Babel, Webpack, TS, ES)? 90. DevOps: работали ли с Docker-контейнерами, объяснить основные термины K8s (кластер, pod, node, deployment, service), что такое Kibana? 91. Алгоритмы: что такое временная сложность алгоритма (time complexity)? 92. Углубленные знания Linux: как зайти на внешний сервер, работать с пакетами, настроить среду и выполнять операции? 93. Специфично для Data Science: как работать с пакетами для обработки и визуализации данных (NumPy, Pandas и другие)? Ответы на некоторые из этих вопросов вы можете найти в видео курсе SQL Базовый.   Вопросы для Senior   На собеседованиях с Senior`ами обычно мало говорят о теоретической стороне технологии, больше обсуждают конкретный опыт разработчика. Поэтому формализованных вопросов здесь нет. Однако, примером могут быть: 94. Что такое @property? 95. Каким образом можно запустить код на Python параллельно? 96. Как работать с stdlib? 97. Какие задачи решали с помощью метаклассов? 98. Что такое дескрипторы? 99. Знания других языков, кроме Python (опыт). 100. Какие технологические особенности реализации распределенных систем? 101. Какие есть низкоуровневые особенности языков и фреймворков? 102. Способы и методы управления памятью.   Бонус. Практические задания   1. Спроектировать клон Instagram. Это сервис, который понятен практически любому кандидату, даже если у него нет аккаунта. На высоком уровне он очень прост: картинки, описания, комментарии. Поэтому что-то минимальное сможет описать и джуниор. Если кандидат претендует на высшие позиции, можно бесконечно копать вглубь, касаясь API, тротлинга запросов, защиты от фрода, построения фидов пользователя и тому подобное. 2. Дано рекурсивное определение чисел Фибоначчи, надо написать функцию, которая реализует это определение. 3. Есть база данных из трех таблиц — стандартная many-to-many схема. Нужно написать запрос, который объединяет три таблицы и возвращает определенный результат. 4. Даем ТЗ какого-то полезного микросервиса (сокращалка url-ов, поиск дубликатов картинок, поиск тегов в текстах) или функции (rate limiter). Просим кандидата рассказать, как бы он его реализовал. Это дает возможность узнать, что привык использовать специалист, насколько глубоко он знает и понимает различные технологии. 5. Написать какой-то несложный декоратор (выводит аргументы функции на экран или, например, измеряет сколько времени выполнялась функция). 6. Junior`у можно предложить реализовать задачу FizzBuzz test. 7. Для Middle+ я люблю давать несложные задачки на рекурсию. Например, есть вложенный список чисел и нужно что-то на нем посчитать (скажем, найти максимум). Также, можно предложить написать аналог deepcopy для конкретной структуры данных (tree, graph). 8. Для Senior - игра «спроектировать за 5 минут...». Это может быть Google, FB, Twitter, высоконагруженный интернет-магазин, сервис поиска, продажи и бронирования билетов, сайт новостей и тому подобное. Такая задача помогает понять, как кандидат решает проблемы, ход его мыслей, умеет ли он отделять главное от второстепенного, понять, какого он типа ( «в глубину» или «в ширину»). 9. Игра «у юзера что-то не работает». На примере спроектированной системы собеседователь придумывает ошибку с «дикими симптомами», которую очень сложно понять, воспроизвести. Но нужно быстро решить проблему. 10. Задание, которое демонстрирует знание и понимание list и dict comprehensions. Looking at the below code, write down the final values of A0, A1, ...An.             A0 = dict(zip(('a','b','c','d','e'),(1,2,3,4,5)))             A1 = range(10)             A2 = sorted([i for i in A1 if i in A0])             A3 = sorted([A0[s] for s in A0])             A4 = [i for i in A1 if i in A3]             A5 = {i:i*i for i in A1}             A6 = [[i,i*i] for i in A1]             A7 = [i if i%2 else 0 for i in A1 if 2 < i < 8]             ','.join(str(j**2) for j in range(10)) – what is this object ?   11. Задача, в которой есть три функции, в них выполняются базовые операции (сортировка, фильтрация, поднесение массива к квадрату). Нужно упорядочить эти три функции в порядке возрастания времени, которое уходит на их выполнение. Place the following functions below in order of their efficiency. They all take in a list of numbers between 0 and 1. The list can be quite long. An example input list would be [random.random () for i in range (100000)]. How would you prove that your answer is correct? - profiling? def f1 (lIn):             l1 = sorted (lIn)             l2 = [i for i in l1 if i <0.5]             return [i * i for i in l2] def f2 (lIn):             l1 = [i for i in lIn if i <0.5]             l2 = sorted (l1)             return [i * i for i in l2] def f3 (lIn):             l1 = [i * i for i in lIn]             l2 = sorted (l1)             return [i for i in l1 if i <(0.5 * 0.5)]   То есть, на входе все функции имеют одинаковые данные, на выходе выдают одинаковый результат. Но из-за того, что внутри операции выполняются в разном порядке, время выполнения будет отличаться. Здесь нужно разбираться в алгоритмах и понимать, что происходит с твоими данными в процессе. Эту задачу может решить Junior, а может не решить и Middle. Казалось бы, такая мелочь, но когда мы работаем с большим количеством данных, важно, чтобы код был оптимизирован и программа выполнялась максимально быстро.   12. Простые задачи на статистику или логику. Например, определить угол между стрелками часов, которые показывают 8:40. За подготовку материала редакция DOU выражает благодарность Михаилу Кашкину (Founder в Okumy и курсов по Python), Руслану Скире (Python Developer в CodeIT LLC), Бориславу Ларину (Python Developer в Prom.ua), Владимиру Обризану (Director в Design and Test Lab), Виктору Свирскому (Senior Developer в DataArt), Николаю Зорину (CTO в Jiji, проект Genesis), Владимиру Селюху (Team Lead в Prom.ua), Сергею Галабурде (Software Engineer в N-iX), Алексею Чуприкову (Lead Python Engineer в EPAM), Ивану Лучку (TL Data Science Specialist в Boosta), Олегу Новикову, Владимиру Щербинину, Роману Могилатову (Technical Leader в SoftServe), Вадиму Рудю, Натальи Кушнир, Андрею Лейцюсю, Роману Луцю и другим. Перевел на русский язык Владислав Сверчков

Пошук роботи в ІТ — це процес, який часто здається марафоном без фінішу. Ти надсилаєш десятки резюме, проходиш співбесіди, виконуєш тестові — і раптом отримуєш сухе повідомлення: «На жаль, ви нам не підходите». Чому саме? Адже ти вчився, мав мотивацію, виконав завдання. Відповідь проста: на кожному етапі рекрутинг-процесу роботодавець шукає не просто знання, а сигнали — про твоє мислення, готовність до роботи, поведінку і навіть енергію, яку ти передаєш. Розберімо докладно кожен етап і те, як уникнути типових помилок. Етап 1. Відмова після подачі резюме Це найпоширеніший і найболючіший момент: ти надсилаєш десятки відгуків і отримуєш тишу. Що відбувається насправді Рекрутер витрачає на одне резюме від 7 до 15 секунд. За цей час він вирішує, чи варто читати далі. Якщо твій документ виглядає неструктуровано, без конкретики, без GitHub або портфоліо — він просто губиться серед сотень інших. ⚠️ Типові помилки Заголовок “Junior Developer” без уточнення напряму. Потрібно конкретно: “Junior Python Developer”, “QA Manual”. Опис у стилі “вивчав HTML/CSS/JS, маю базові знання SQL”. Це виглядає як список зі шпаргалки. Відсутність результатів. Навіть на етапі навчання варто показувати, що ти вже зробив: pet-проєкти, сертифікати, дипломні завдання. Неадаптоване резюме. Якщо ти шлеш одне й те саме всім — видно, що ти не читав опис вакансії. ✅ Як зробити краще Почни резюме з короткого профілю: хто ти, що вмієш і чим можеш бути корисним. Додай результати навчання: проєкти, технології, що використовував, лінки. Замість фрази “Хочу розвиватися в ІТ” напиши “Прагну приєднатися до команди, де зможу працювати над продуктом, вдосконалюючи свій код і процеси тестування”. 💡 Резюме — це не твоя біографія, а перша презентація твоєї професійної цінності. Етап 2. Відмова після розмови з рекрутером Якщо тебе запросили на першу співбесіду — резюме зацікавило. Але далі важливо закріпити враження. Як мислить рекрутер HR оцінює не твої знання коду, а твою мотивацію, емоційний інтелект, комунікаційність і відповідність культурі компанії. Кандидати часто забувають: ця розмова — не формальність, а тест на зрілість. ⚠️ Типові причини відмови Ти не можеш чітко пояснити, чому саме ІТ і чому цей напрям. Ти не розповідаєш, що вже робив, а лише підкреслюєш, чого не знаєш. Ти виглядаєш пасивним або невпевненим, не ставиш питань і не проявляєш зацікавленості в компанії. Ти знецінюєш попередній досвід (“це неважливо, я тепер у ІТ”). ✅ Як діяти Підготуй чітку історію переходу: хто ти був, чому вирішив змінити сферу, що зробив для цього і які результати отримав. Говори про свій бекграунд як про силу, а не як про тягар. “Раніше працював у фінансах, тому уважність до деталей допомагає мені як тестувальнику.” Став запитання: “Як виглядає адаптація новачків у вашій компанії?”, “Які є шляхи росту?” 💬 Рекрутер шукає людей, які хочуть не просто роботу, а розвиток. Етап 3. Відмова після тестового завдання Цей етап показує, як ти мислиш і як ставишся до роботи. Як мислить техлід Тестове — це не про “ідеальний код”. Це про відповідальність, логіку та ставлення до задачі. Навіть якщо рішення неідеальне, але зрозуміле, акуратне й пояснене — це плюс. ⚠️ Типові причини відмови Затримка з виконанням без попередження. Відсутність опису або коментарів. Техлід не розуміє твоїх рішень. Ігнорування вимог. Наприклад, попросили зробити адаптивний інтерфейс, а ти зробив лише десктоп. Плагіат або шаблонні рішення. Досвідчені розробники бачать це миттєво. ✅ Як діяти Якщо не встигаєш — попередь заздалегідь. Це професійно. Додай короткий README: які технології використав, чому саме так, які були складнощі. Не бійся показати процес: краще пояснити логіку, ніж залишити “ідеальний, але непрозорий код”. 💡 Тестове завдання — це твій шанс показати недосконалість, а потенціал співпраці. Етап 4. Відмова після технічної співбесіди Це етап, де “вилітають” навіть найсильніші. Тут важливо не лише знати, а й уміти мислити вголос. 💥 Що оцінює техлід Чи розумієш ти принципи, а не лише визначення. Як реагуєш на складні або невідомі питання. Як мислиш під тиском. Наскільки комфортно з тобою спілкуватися як з колегою. ⚠️ Типові помилки Відповіді “з книжки”, без розуміння контексту. Агресивна реакція на фідбек або виправдання: “Так мене вчили”. Мовчання, коли не знаєш відповіді. Відсутність питань про команду, продукт, стек. ✅ Як діяти Якщо не знаєш — скажи: “Я не стикався з цим на практиці, але припускаю, що…” Не бійся мислити вголос: техлід хоче почути логіку, а не вгадування. Наприкінці обов’язково запитай: “Чи могли б ви дати фідбек, що покращити?” — це справляє враження зрілості. 💬 Технічна співбесіда — це не перевірка, а діалог. Етап 5. Відмова після фінального етапу Іноді ти пройшов усе: тест, технічну, фінальну розмову — і все одно отримуєш відмову. 💥 Що може бути причиною Компанія обрала кандидата з трохи більшим досвідом. Ти не зовсім підходиш під “культурний фіт” — не стиль роботи команди, не співпадає енергія. Твоя комунікація була занадто формальною або, навпаки, надто емоційною. Іноді це не означає, що ти “поганий”. Це просто невідповідність середовищу, і вона взаємна. ✅ Як реагувати Подякуй за можливість. Запитай, чи можеш отримати фідбек — короткий, конкретний. Не сприймай це як провал, а як інформацію для зростання. 💡 Іноді «ні» зараз — це «так» через кілька місяців, коли з’явиться інша позиція. Висновок Кожна відмова — це дзеркало. Воно показує не те, що ти “недостатньо хороший”, а те, де ще можна рости. Ніхто не будує кар’єру без відмов. Але ті, хто аналізує, робить висновки і вдосконалює себе після кожного етапу — у підсумку отримують не просто роботу, а впевненість у власній професійності. Не бійся фрази «ми обрали іншого кандидата». Бійся одного — не зробити висновків і не використати шанс стати кращим.

В этой статье мы рассмотрим организацию работы с памятью в .NET. Здесь мы узнаем, что такое стек и куча, и для хранения каких типов данных они применяются.   Разделение памяти По умолчанию, как только .NET приложение запускается и определяется виртуальный адрес текущего процесса, создаются следующие "кучи": Куча для кода - JIT-компилируемый нативный код Малая объектная куча - объекты до 85 кб Большая объектная куча - объекты свыше 85 кб* Куча для обработки данных *примечание: в случае массивов для данных типа double существует исключение, согласно которому они хранятся в большой объектной куче задолго до достижения размера в 85 кб (double[] считается системой  "большим" объектом при достижении размера в 1000 элементов). По отношению к оптимизации 32-битного кода это, конечно, не очень хорошо. Разбиение на большие и малые кучи достаточно целесообразно для улучшения производительности, но об этом позже, когда будем говорить о сборщике мусора. Элементы, размещенные в кучи, обладают своими адресами, которые являются чем-то вроде указателей на ячейки памяти, где хранятся значения этих элементов. Впрочем, куча - это не единственная структура данных, которой может похвалиться вселенная .NET. К примеру, есть еще и стек, который крайне полезен для хранения "специфических" типов данных. Сейчас мы рассмотрим в деталях, как устроены эти структуры данных в деталях.   Стек Стек - это структура данных, организованная по принципу LIFO (последний вошел - первый вышел). Если вдуматься, это идеальное решение для хранения данных, к которым вскоре предстоит обратиться (легко извлекаются с вершины стека). Де-факто природа области стека заключается в двух постулатах: "помнить" порядок выполнения и хранить значимые типы данных.   Запоминание порядка выполнения - обращение к стеку Большая часть кода, который мы пишем, инкапсулирован в классы и методы, которые вызывают другие методы, и так далее. .NET Framework обязан всегда "помнить" порядок вызовов участков кода. Более того, так же нужно хранить данные о состоянии переменных и значениях параметров, передаваемых при вызове методов (дабы суметь восстановить состояние вызывающего метода после завершения работы вызываемого). При каждом вызове метода .NET инициализирует стек-фрейм (что-то вроде контейнера), где и хранится вся необходимая информация для выполнения методов: параметры, локальные переменные, адреса вызываемых строчек кода. Стек-фреймы создаются в стеке друг на друге. Все это прекрасно проиллюстрировано ниже: Стек используется для хранения порядка выполнения кода и часто называется стеком вызова, стеком выполнения или программным стеком. Давайте взглянем на следующий участок кода: Дабы вызвать Method2, фреймворк должен сохранить адрес конца выполнения метода, которым будет следующая строчка кода (строчка 4 в примере ниже). Этот адрес вместе с параметрами и локальными переменными вызываемого и вызывающего метода хранятся в стеке вызова, как показано на схеме ниже. Также вы можете увидеть, что происходит, когда Method3 завершает свое выполнение (стек-фрейм покидает стек вызова).   Хранение значимых типов Также стек используется для хранения переменных любых значимых типов .NET - включая: bool, decimal, int и так далее. Ссылочные типы - это типы, которые хранят данные и ссылку на эти данные в рамках одной области памяти. Что так же интересно, так это то, что все локальные переменные значимых типов при завершении выполнения метода очищаются. Это происходит по той причине, что при завершении работы метода его стек-фрейм становится недоступным - стек имеет указатель на начало стек-фрейма на вершине стека вызова (текущий указатель стек-фрейма), который просто перемещается на следующий стек-фрейм после окончания работы текущего (физически данные все еще находятся в стеке вызова, но на практике получить доступ к ним через стандартный .NET-механизм невозможно).   Куча Куча схож со стеком, но если стек представляется в виде последовательности коробок, складируемых друг на друге, в случае с кучей эти самые коробки аккуратно разложены и мы можем получить к ним доступ в любое время.   Хранение ссылочных типов Все прочие переменные, которые не являются значимыми (производные от object), являются ссылочными типами данных. Все ссылочные типы данных хранятся в управляемой куче (малой или большой - в зависимости от размера). Впрочем, пусть даже и значение объекта хранится в куче, ссылка на него хранится в стеке. Рассмотрим следующий код: Фигура ниже иллюстрирует, как выглядит стек и куча в плане хранения данных: OBJREF, хранимый в стеке, на самом деле является ссылкой на объект MyClass, хранимый в куче. Заметка: выражение MyClass myObj совершенно не занимает места в куче переменной myObj. Здесь всего лишь создается переменная OBJREF в стеке, после чего она инициализируется значением null. Как только выполняется команда new, куча получает действительное место памяти объекта, а сам ссылочный объект получает по адресу свое значение.   Значимые типы против ссылочных типов (стек против кучи) Основное различие между ссылочными и значимыми типами данных заключается в том, что ссылочные типы данных передаются по адресу – то есть при передаче ссылочной переменной в виде параметра метода передается всего лишь общий адрес на ячейку памяти с данными объекта. В случае же со значимыми типами данных, между методами передается копия самого объекта. Вот как это выглядит схематически: Как уже и было сказано, в случае со ссылочными типами данных, при присваивании ссылочному типу данных значения другого ссылочного типа данных, происходит присваивания адреса, тогда как ячейка памяти со значением остается прежней. Конечно, хранение одного вида информации в стеке, другого в куче, имеет свои причины, которые мы рассмотрим в грядущих статьях. :)   Заключение В сегодняшней статье мы рассмотрели область стека и кучи, два вида организации памяти для работы в рамках .NET-приложения. В следующей статье мы познакомимся с процессом упаковки и распаковки, а также узнаем, как это сказывается на производительности нашего приложения. До новых встреч! Автор перевода: Евгений Лукашук Источник

Мы уже знаем особенности работы с памятью и доступные структуры данных в .NET приложениях, в этом посте мы разберем упаковку и распаковку, а также рассмотрим, как эти две операции влияют на производительность приложения.   Что такое упаковка и распаковка? Зачем нам задумываться об упаковке и распаковке? Разве это не обязанность .NET-среды, которая следит за управлением данных и, соответственно, сама "выбирает" наиболее оптимальный способ их хранения? На самом деле - нет. Что очень важно знать и понимать -  так это механизм перемещения данных из области стека в кучу - и наоборот. Помните: Когда любой значимый тип присваивается к ссылочному типу данных, значение перемещается из области стека в кучу. Эта операция называется упаковкой. Когда любой ссылочный тип присваивается к значимому типу данных, значение перемещается из области кучи в стек. Это называется распаковкой. К примеру, здесь мы имеем следующий пример упаковки: А вот состояние памяти в момент произведения операции: Чтобы сохранить значение "123" в виде объекта, в куче создается "упаковка", куда впоследствии и перемещаются данные. Когда же производится распаковка: Вот что происходит с памятью: Значение "123" было изъято из упаковки и помещено назад в область стека. Заметьте, что когда тип данных i упаковывается внутри объекта o, в стеке хранится лишь ссылка, в то время как само значение хранится в куче. Как только производиться распаковка, данные в куче обязаны быть скопированы в стек (переменная j). В обоих случаях наша цель - это работать с тем самым значением (123). Как вы можете себе представить, сии операции могут быть достаточно ресурсоемкими.   Давайте рассмотрим IL Когда мы производим подобный анализ производительности, часто бывает полезно заглянуть непосредственно в Intermediate Language (IL). Мы еще не рассматривали эту концепцию, но, как вы наверняка знаете, когда мы производим компиляцию в DLL или EXE, выходной файл на самом деле содержит IL - промежуточный код, который в последствии исполняется JIT и впоследствии - виртуальной машиной. Среда выполнения .NET обязана как-то знать, нужно ли упаковывать или распаковывать определенные переменные. Поэтому для обозначения этих операций также требуются дополнительные затраты памяти. Давайте создадим несложное .NET консольное приложение: Теперь скомпилируем приложение и при помощи утилитки ILSpy посмотрим его код внутри EXE. Как только EXE-файл будет открыт в ILSpy, пронавигируемся к методу Main, выбрав "IL with C#". Заметьте, что операция box выполняется только после присвоение ссылочному типу значения значимого. И наоборот: unbox.any - только после попытки присвоить ссылочному типу данных значимой переменной. Это де-факто способ, которым операции упаковки и распаковки представлены в IL.   Когда стоит производить упаковку и распаковку? Код в примере выше скорее всего вам покажется наивным, и вы можете подумать: "Эй, что за вздор! Я никогда не буду такого делать". Что же, в большинстве случаев это действительно так. Но данные в нашем приложении часто упаковываются и распаковываются, когда мы об этом даже не догадываемся.   Гетерогенные коллекции К примеру, старая школа до сих пор может похвастаться ArrayList. Метод добавления элемента здесь, как можно отметить, принимает object-параметр. Таким образом, и здесь производится наша излюбленная упаковка. Впрочем, подобное кануло в лету с приходом обобщений и обобщенных коллекций.   Конкатенация строк Другой интересный пример в виде конкатенации строк. Эта операция требует наличия метода String.Concat, который принимает два object-параметра. Дабы избежать подобных ситуаций, нам достаточно просто немного изменить код, используя на переменной типа int метод ToString (и здесь стоит проигнорировать сообщение ReSharper о том, что операция бессмысленна:) ). И все! Никакой упаковки больше нет. Вообще, это далеко не единичные примеры для демонстрации. Но цель нашей статьи - донести четкое представление о том, что такое упаковка и распаковка и когда они применяются.   Производительность Как мы уже говорили, упаковка и распаковка требуют определенных затрат производительности. В случае с конкатенацией строк, выигрыш от применения ToString весьма незначителен. Именно потому, как я упомянул выше, даже ReSharper не советовал нам делать подобное: В этом случае гораздо лучше сохранить читабельность кода без ToString. Целесообразность оптимизации появляется, как правило, тогда, когда операции упаковки и распаковки предстоит производить в цикле сотни и тысячи раз. В этом случае время выполнения кода с упаковкой может составлять порядка 150 процентов от времени исполнения кода без нее (вы можете сами создать тестовое приложение и сравнить требуемый промежуток времени). Упакованные значения могут также требовать больше памяти, чем значения в стеке. Копирование значений в/из стека также требует своих затрат. Согласно MSDN, упаковка может занимать порядка 20 раз больше времени, нежели простое присвоение. В то время как распаковка примерно в 4 раза медленней простого присвоения.   Итак... зачем же тогда вообще нужно использовать упаковку и распаковку? Несмотря на все недостатки в плане падения производительности .NET -приложения, концепции упаковки и распаковки были внедрены в .NET не просто так. И вот причины: .NET-стандарт обладает общей системой типов, что позволяет представлять и ссылочные. и значимые типы схожим образом - и все это благодаря упаковке. Коллекции можно было использовать для хранения значимых типов до появления обобщений. Упрощения кода, вроде конкатенации строк и так далее. Упаковка и распаковка настолько распространены, что мы не может избежать их полностью. Мы должны знать принцип их работы, чтобы минимизировать их использование, но к этому нужно подходить разумно. Не тратьте свое время на постоянную оптимизацию кода, частую проверку через IL, чтобы убедиться, дабы ни одна лишняя операция упаковки не была использована. Помните, что чистота и простота чтения кода иногда значительно более важна, нежели незаметное, мельчайшее ускорение работы программы.   Подведем итоги В сегодняшнем уроке мы рассмотрели, что такое упаковка и распаковка, как она представлена в IL-коде, и какое влияние на производительность они имеют. Искренне надеюсь, моя статья сумела прояснить некоторые общие концепции, хотя бы чуть-чуть. :) В грядущих статьях мы рассмотрим механизм сборки мусора. Если у вас есть идеи или пожелания касательно материала новых статьей - милости просим в комментарии!   Автор перевода: Евгений Лукашук Источник

Я был свидетелем многих вопросов, связанных с Subject`ами на Stack Overflow. Недавно я увидел одного разработчика, который интересовался, как, собственно говоря, работает AsyncSubject. Вопрос заставил меня написать эту статью, чтобы показать, почему необходимо использовать различные типы Subject`ов и как их использовать.   Когда мы используем Subject`ы? В своей статье Бен Леш утверждал, что: … [мультикастинг] является основной причиной использования Subject`ов в RxJS. Что касательно мультикастинга, мы рассмотрим его более подробно немного позже. Сейчас же нам достаточно знать, что он позволяет принимать оповещения от одной «наблюдаемости» и отправлять их другим «наблюдателям». Подобная связь «наблюдаемости» с «наблюдаемыми» и есть сутью Subject`ов. Причина этого заключается в том, что де-факто Subject`ы являются одновременно «наблюдаемостью» и «наблюдателями».   Как они могут быть использованы? В качестве примера давайте рассмотрим компонент Angular awesome-component. Наш компонент выполняет определенную работу и содержит в себе внутреннюю «наблюдаемость», что производит определенное значение при работе с ней пользователя. Чтобы позволить родительским компонентам получить доступ к «наблюдаемости», awesome-component принимает «наблюдателя», что вводит свойство и что подписывается, в свою очередь, на «наблюдаемость». Это значит, что отныне родитель может соединиться с «наблюдаемостью» при помощи спецификации «наблюдателя» - что-то наподобие этого: Так как теперь «наблюдатель» «обвязан», родитель соединен и получает значения от awesome-component. Впрочем по сути это то же самое, как  если бы awesome-component производил значения через подписанные события. Так почему же мы здесь не используем события? Дело в том, что «наблюдаемостями» проще управлять. К примеру, чтобы добавить фильтры, нам необходимо использовать лишь несколько операторов. Но немаловажный нюанс: родительский компонент имеет «наблюдателя» – не «наблюдаемость», так как в таком случае мы можем применять операторы? Subject`ы - это одновременно и «наблюдаемости», и «наблюдатели», поэтому, когда мы создаем Subject, он может быть использован по отношению к awesome-component в качестве «наблюдателя» или работать с компонентом как с «наблюдаемостью». Что-то наподобие этого: Subject соединяет «наблюдателя» по принципу «делай-все-что-хочешь-со-значением» с «наблюдаемостью» в виде awesome-component. Но здесь применяется набор операторов родителей компонента.   Композиция различных «наблюдаемостей» При помощи Subject`а для композиции «наблюдаемости» awesome-component может быть использован в разных целях разными компонентами. К примеру, другой компонент может быть заинтересован только в последнем сгенерированном значении. Для этого нужно использовать last-оператор: Что интересно, это не единственный способ получения последнего значения: мы просто можем использовать другой Subject. К примеру, при помощи AsyncSubject код будет выглядеть следующим образом, так как он производит только последнее полученное значение: Но, если использование AsyncSubject равнозначно композиции «наблюдаемости» при помощи использования Subject и last-оператора, зачем усложнять RxJS лишним классом? Ну, в основном потому что Subject`ты предназначены для мультикастинга. В данном случае два способа эквивалентны, потому что здесь есть только один подписчик. В ситуации с применением мультикастинга здесь было бы несколько подписчиков и применять оператор last здесь было бы нецелесообразно. Теперь же давайте рассмотрим мультикастинг более детально.   Как Subject`ы используются непосредственно в RxJS? Ядро инфраструктуры мультикастинга RxJS исполняется при помощи оператора multicast. Multicast вообще применяется к ключевым «наблюдаемостям», принимает Subject и возвращает полученную из Subject`а «наблюдаемость». Оператор multicast чем-то похож на awesome-component. Мы можем принимать «наблюдаемость», чье поведение зависит от принимаемого Subject`а. Ситуации, когда базовый Subject передается multicast: Подписчики мультикаст-«наблюдаемости» принимают оповещения типа next, error, complete. «Поздние» подписчики , другими словами, те, которые подписались после оповещений error, complete, – так же в свою очередь принимают эти оповещения. Важно отметить, что пока мультикастинг не передал factory, «поздние» подписчики не работают с другими подписками на источник. Чтоы произвести композицию по отношению к мультикаст-«наблюдаемости», что передает последнее оповещение next ко всем подписчикам, недостаточно просто применить last-оператор к «наблюдаемости», созданной при помощи Subject. «Поздние» подписчики подобной «наблюдаемости» не получат последнее next-оповещение. Они получат только complete. Специально для этого оповещения должны храниться в состоянии Subject`а. Именно это делает класс AsyncSubject и именно для этого мы используем AsyncSubject в подобной ситуации.   Что касательно других классов Subject`ов? Существует двое других вариантов Subject`ов: BehaviorSubject и ReplaySubject. Чтобы понимать BehaviorSubject лучше, давайте рассмотрим пример: Здесь родительский компонент соединяется с awesome-component при помощи Subject и применяет оператор startWith. Этот оператор обеспечивает надежный прием значения “awesome” вместе со значениями, сгенерированными awesome-component – в случае, конечно, если они таки были сгенерированы. Подобно тому, как AsyncSubject используется вместо обычного Subject`а и оператора last, BehaviorSubject может заменить собой оператора startWith и Subject`а – так как его конструктор принимает значение, которое было бы в противном случае направлено к startWith. В случае с использованием BehaviorSubject все подписчики получат начальное значение. Это возможно потому, что BehaviorSubject хранит значение переменной в своем состоянии. По той причине, что концепция «переигрывания» уже полученных оповещений внедрена в мульти-подписку, аналогии с единым подписчиком для ReplaySubject просто не существует. Так же, как и BehaviorSubject, переменные хранятся в состоянии Subject`а.   Итак, как мы используем эти Subject`ы? Мы увидели, какие бывают Subject`ы и для чего они используются. Но как они должны быть использованы? Что ж, как бы это ни было парадоксально, но класс Subject – это тот класс, который вам, вероятно, никогда не придётся использовать. Subject работает прекрасно при связывании «наблюдателя» с «наблюдаемостью». Но для ситуаций с мультикастингом существуют альтернативы. RxJS содержит операторы мультикастинга, которые используют различные Subject – классы, причем точно так же, как я могу использовать генераторы «наблюдаемостей» RxJS (fromEvent) над вызовами Observable.create. Но для ситуаций с мультикастингом я все же предпочитаю использовать следующие операторы: Publish или share могут быть использованы вместо Subject; publishBehavior может быть использован вместо BehaviorSubject; publishLast может быть использован вместо AsyncSubject; publicReplay или shareReplay могут быть использованы вместо ReplaySubject.   Автор перевода: Евгений Лукашук Источник

Обзор SVG графика может быть анимирована с использованием анимационных тегов. Они были описаны в спецификации Animation SMIL. Рассмотрим эти теги: позволяет анимировать свойства в течение времени. это удобное сокращение, которое полезно для присвоения значений анимационных нечисловых атрибутов и свойств, таких как свойства opacity. который двигает вдоль траектории движения path. которая модифицирует значение цвета отдельных атрибутов или свойств с течением времени. В дополнение к элементам, определенных в SMIL, SVG включает расширения, совместимые с SMIL анимацией спецификации. Эти расширения включают в себя атрибуты, которые расширяют функционал элемента. Расширения SVG включают в себя: - дает возможность анимировать один из SVG атрибутов в течение промежутка времени, например, в качестве атрибута преобразования нового центра фигуры или преобразование фигуры и использование поворота вокруг одной из осей (Х, Y, Z). path(attr) - позволяет анимировать  вдоль определенного пути.    - используется в сочетании с animateMotion элемента для ссылки на траекторию движения, которая должна быть использована в качестве пути для движения. Элемент mpath входит внутрь animateMotion элемента перед закрывающим тегом. keypoints (attr) - задается в качестве атрибута для animateMotion, обеспечивая точный контроль скорости траектории движения анимации. rotate(attr) - используется в качестве атрибута для animateMotion для того, чтобы контролировать поворот относительно оси поворота. SVG анимации могут быть похожи на CSS анимации. Ключевые кадры создаются, объекты движутся. Но они могут сделать нечто, что CSS анимации не делает. Применение SVG Анимации SVG элементы можно стилизовать и анимировать и с помощью CSS. В принципе, любое преобразование или анимации перехода, которые могут быть применены к HTML элементу, также могут быть применены к SVG. Но существуют некоторые SVG свойства, которые не могут быть сделаны через CSS. Векторная версия путь, например, поставляется с набором данных path, который определяет траекторию этому пути. Эти данные могут быть изменены и анимированных через SMIL, но не CSS. Это потому, что SVG элементы описаны набором атрибутов, известных как SVG атрибуты представления. Если вы предпочитаете использовать JavaScript, я рекомендую использовать snap.svg, который описан как "в JQuery в SVG". Вот коллекция примеров. http://snapsvg.io/demos/ Если вы предпочитаете декларативный подход анимации, вы можете применять элементы SVG анимации, о которых я расскажу. Еще одно преимущество SMIL над JS анимацией в том, что JS анимации не работают, когда SVG встроен в качестве IMG или используется в качестве фона изображения в CSS. SMIL анимации работают в обоих случаях. Это большое преимущество, на мой взгляд. Поддержка браузеров Поддержка браузеров для SMIL анимации довольно приличная. Они воспроизводятся во всех браузерах, кроме IE. Подробный обзор поддержки браузеров вы можете посмотреть в таблице совместимости на caniuseit. Если вам нужно обеспечить альтернативный вариант для SMIL анимации, вы можете проверить поддержки браузера на лету, используя Modernizr. Если SMIL не поддерживается, вы можете предоставить какой-то запасной вариант (анимации JavaScript, например). Анимация атрибутов элемента из одного значения к другому в течение произвольного времени с указанием конечного состояния: from, by, to, dur и fill. Давайте рассмотрим с перемещением круга из одного положения в новое. Это можно сделать, изменив значение его атрибута сх (который определяет х - положение его центра). Мы собираемся использовать элемент, чтобы сделать это. Атрибуты, которым устанавливают числовые значения и цвета, как правило, анимированные с помощью . Для получения списка атрибутов, которые могут быть анимированными, обратитесь к этой таблице: http://www.w3.org/TR/SVG2/animate.html#AnimationAttributesAndProperties Чтобы изменить значение на другое в течение времени используются from, by, to, dur и fill. В дополнение к этому, вы также хотите указать, когда анимация должна начинаться с атрибутом начала. В приведенном примере, я определил круг, а затем вызываю анимацию на этом круге. Центр окружности перемещается из исходного положения - 500 единиц, до 1750 единиц вдоль оси х. Начальное значение установлено на кнопку мыши. Это означает, что круг будет двигаться, когда она нажата. Вы можете установить это значение к значению времени, а также. Например, начинают = "0s" начнет анимацию, как только страница загружена. Вы можете задержать анимацию, установив положительное значение времени. Например, начать = "6s" запустит анимацию через шесть секунды после нагрузки. Атрибут Dur похож на анимации-импульса в CSS. from - to атрибуты похожи на from to ключевых кадров в keyframe блока анимации в CSS: Повторяющиеся анимации с Repeat-Count Когда вы хотите воспроизвести анимацию несколько раз, вы можете сделать это с использованием атрибута RepeatCount. Можно указать, сколько раз вы хотите повторить или использовать ключевое слово, чтобы он без конца повторять. Так что, если мы должны были повторить анимацию вида круга в течение двух раз, код будет выглядеть так: Управление значениями ключевых кадров анимации: keyTimes и values. В CSS, мы можем задать значения, которые мы хотим, чтобы взять в определенные рамки во время анимации. 0%, 40 % , 80 % и 100% являются кадрами анимации. Анимация вдоль определенных путей: Хорошие примеры таких анимаций можно посмотреть здесь http://codepen.io/mileselam/pen/kprKm http://codepen.io/rossfenrick/pen/gpzJzz http://codepen.io/tmrDevelops/pen/yyveKv Так же более подробный пример есть на хабре http://habrahabr.ru/post/207908/ Функция прохода анимации Еще один важный элемент — это функция по которой будет проходить анимация. Среди всем известных функций анимации мы знаем ease, ease-in, ease-out, linear. Но если Вы хотите создать свою функцию прохождения анимации, то вам сюда http://cubic-bezier.com/ И напоследок лучший пример, от которого просто невозможно оторвать глаз http://codepen.io/thiennhat/pen/BNByzJ?editors=001 Пробуйте и у вас все получится!

Введение Человек, который осмеливается потратить впустую час времени, еще не осознал цену жизни. Ч. Дарвин Средняя продолжительность жизни человека – 79.5 лет. Из них более 10 лет человек проводит на работе. Данная статья будет полезна тем, кто ценит свое время: желает работать продуктивнее, получить больше свободного времени или просто упорядочить жизнь! Что же такое время? Существует множество определений. Чаще всего мы говорим о часовом и реальном времени. Часовое время равномерно: в нем час это 60 минут или 3600 секунд, а в году 365 дней. С ним работают большинство хитроумных систем и приспособлений для учёта времени.  Реальное время относительно – за интересной работой (проверка комментариев) время пролетает незаметно, а за скучной и однообразной (проверка документов или платежей) оно тянется, как кисель. Люди живут по реальному времени. Оно субъективно – именно вы его создаете, и, поэтому, можете им управлять. Планирование Очень разумно составлять планы на полгода, на год вперёд, но грош им цена, если у тебя нет планов на завтрашний день. Хилари Мантел. Волчий зал Планирование – основа деловой активности. Без плана невозможно построить качественный дом. Плохой план или его отсутствие – основная причина неудач. Задайте себе вопрос в понедельник: «Какие три вещи я хочу закончить до пятницы?». В начале каждого дня или в конце предыдущего спросите себя: «Что я хочу сделать за сегодня?». Ваш план может выглядеть не только как список задач в Excel. Представьте для себя удачное завершение Вашей задачи – и мозг активно будет искать решение! Так работают многие техники «визуализации». Делите сложную задачу на задачи поменьше, планируйте от длительных задач до ежедневных. Не забывайте ставить фиксированные сроки! Помните, успешное планирование сэкономит до половины времени при решение задачи! Список дел Огромную роль в ежедневном планировании занимает список дел. Не пытайтесь распланировать все! Согласно принципу Парето, который можно сформулировать так: «только 20% усилий приносят 80% результата, остальные 80% - лишь 20% результата», основная часть усилий тратится впустую! Очень важно определить ключевые задачи и выделить под них определенное время выполнения, когда Вы сфокусируетесь на их выполнении! Решите, как разделить задания по важности – например, цифрами или буквами алфавита. Существуют дела срочные – их нужно закончить прямо сегодня, существуют дела несрочные – те, которые можно отложить на завтра или послезавтра. Ваша задача – выполнить дела срочные и важные, на них стоит потратить основную часть Вашего времени. Далее стоит выполнить задачи важные, но не столь срочные – важные задачи приносят основной доход! Остальные дела – по возможности передайте их подчиненным или скажите слово «нет», они не имеют огромного влияния на Вашу работу. Можете даже записывать важные задачи в журнале для встреч, как встречи самих с собой! Скажем: «С 11 утра до 11:30 я буду заниматься подготовкой новости для моего вебсайта». Попытки выполнить все задачи сразу приносят лишь разочарования! Отложите часть задач на следующий рабочий день. Начинайте рабочий день с самой неприятной, но важной задачи – время «на раскачку» (чтение новостей, заваривание кофе, разговоры с коллегами) может затянутся, а к обеду наша активность чаще всего снижается. Чтобы определить важные задачи, попробуйте записать мысли, активности и разговоры в блокнот, скажем, за неделю. Так Вы узнаете, куда утекает время. Сплетни и сторонние разговоры, чтение новостей и просмотр телевизора в рабочее время – явно лишние активности, убирайте «пожиратели времени». Стремление к идеалу Лучшее – враг хорошего М. Джиованни (1574) С детства я жуткий перфекционист – стараюсь все сделать идеально, до последней строчки. Мои попытки, к сожалению, не приводили к успеху – я просто не успевал! В современном мире не ждут идеальных решений. Делай работу как все, но делай её хорошо!  Если Ваш подчиненный может справится с задачей, то ею не стоит заниматься лично. Вам достаточно просто проконтролировать выполнение или поставить задачу проектному менеджеру. Многозадачность Чем больше у вас ответственности, чем больше шляп вы носите, тем больше вероятность, что вы станете неэффективной. Это закон переключения между задачами Дэйв Креншоу С прискорбием вынужден сообщить Вам , человек - существо однозадачное. Многозадачность – всего лишь иллюзия. Даже выполняя несколько дел одновременно, мозгу приходится переключатся между ними. Конечно, можно натренироваться для выполнения хотя бы двух задач одновременно, но даже с двумя задачами нельзя ручаться за результат.  Выполняйте задачи последовательно, одну за другой, так вы не будете переключатся и, как следствие, выполните задачи быстрее. Сосредоточенность Пока вы заняты важной задачей , максимально отрешитесь от всевозможных отвлекающих факторов, таких как телефон, Skype, Вконтакте, коллеги, сообщения на почте, комментарии на сайте и прочее. Любое дело требует тщательно продуманного плана выполнения и внимания. Задачу можно закончить гораздо быстрее, а затем даже взять небольшой перерыв. Предупреждайте своих коллег, что будете заняты выполнением важной задачи, можно даже повесить знак «не беспокоить». Не отвечайте на сообщения или звонки моментально, если это, конечно, не часть вашей работы. В некоторых зарубежных ВУЗах доски висят даже в туалете – кто знает, когда вас осенит идея или появится срочное задание? Не отвлекайтесь от текущих дел – запишите идею, оставьте напоминание для задания и возвращайтесь к текущей задаче! Подобное записывание помогает освободить мозг от лишних мыслей во время работы. Ключевые идеи Планируйте ваши действия, представляйте себе успешные результаты. Выделяйте ключевые дела и назначайте для них фиксированное время. Если задачу может выполнить кто-то другой – не цепляйтесь за неё когтями и зубами, передайте её. Не вспоминайте о прошлом – важны лишь сегодня и будущее. Не оставляйте ключевые задачи на потом – делайте их первыми. Не пробуйте делать много задач одновременно и не отвлекайтесь на раздражители. Не забывайте между важными задачами заниматься более простыми – они помогут немного отдохнуть и разгрузить мысли. Помните, рабочий день крайне ограничен – зачастую, Вы не успеете сделать ВСЕ! Ставьте реальные сроки к задачам, будьте довольны своей эффективностью!