С 1 по 8 октября 2020 года на ITVDN проходит акция — вы можете пройти обучение по курсу “Transact-SQL” бесплатно! Что такое Transact-SQL? Transact-SQL (T-SQL) — это процедурное расширение языка SQL, созданное компанией Microsoft и Sybase. Данный язык является ключом к использованию системы управления реляционными базами данных MS SQL Server. Transact-SQL существенно дополнил язык запросов SQL управляющими операторами, локальными и глобальными переменными, а также всевозможными функциями для обработки строк, дат/времени, математических преобразований и т. д. О курсе Transact SQL Автор видео курса — Станислав Зуйко, FullStack .NET Software Engineer at Ciklum, тренер-консультант по специальности .NET Developer в CyberBionic Systematics. Курс состоит из 14 видео уроков общей длительностью 13 часов 27 минут. На уроках учащиеся ознакомятся со стандартом SQL в реализации компании Microsoft – языком Transact-SQL – ключом к использованию MS SQL Server. Впрочем, в других реализациях реляционных баз данных (Oracle, MySQL, Firebird) различия будут незначительными. Курс охватывает достаточный минимум знаний, необходимых при работе с базами данных как аналитику данных, так и разработчику программного обеспечения. После прохождения курса вы будете понимать принципы проектирования БД, уметь составлять корректные выборки, используя различные возможности языка T-SQL.    Программа курса: Знакомство с SQL. Типы данных. DDL, DML. SELECT. Условия выборки. Built-in Functions. Scalar Functions System Catalog. Aggregate functions Целостность данных. Первичный, внешний ключ Нормализация БД Соединение таблиц. JOINs Операторы работы с наборами. Представления Subquery, Temporary table, Common table expression Индексы Процедурный язык Transact-SQL Хранимые процедуры. Пользовательские функции. Транзакции. Триггеры. Для кого этот курс Курс предназначен прежде всего для .NET разработчиков, Backend разработчиков, использующих технологии Microsoft, и разработчиков баз данных. Курс входит в комплексные программы обучения по специальностям .NET Developer, ASP.NET MVC Developer, ASP.NET Core Developer, Database Developer. Чему вы научитесь на этом курсе: Разбираться в синтаксисе SQL и различных типах данных Работать с группой операторов определения данных (DDL) и группой операторов для манипуляции с данными (DML) Работать со встроенными и скалярными функциями — инструментами, которые помогают с написанием скриптов Выполнять нормализацию баз данных Соединять таблицы, содержащие данные, при помощи JOINs Обеспечивать целостность данных, понимать определение первичных и вторичных ключей, а также успешно с ними работать Применять язык Transact-SQL для решения различных задач, которые касаются данных   Сроки акции Акция проходит с 1 по 8 октября 2020 года включительно. Доступ к курсу открывается на 10 дней.

<p>Мы начинаем <strong>серию вебинаров</strong>-практикумов по С++, Qt и QML. В ходе данного цикла вебинаров будут рассмотрены все этапы создания кроссплатформенных графических приложений на основе фреймворка Qt.</p> <p><strong>Всего будет 4 вебинара:</strong></p> <ol> <li>Знакомство с QML. Пятнашки (17 сентября)</li> <li>Model View Controller в Qt. Знакомство с QML - продолжение. (24 сентября)</li> <li>Работа с базами данных в Qt (22 октября)</li> <li>Работа с сетью в Qt (29 октября)</li> </ol> <p>Мы рассмотрим самые важные части фреймворка в процессе создания приложения &quot;Книга контактов&quot;, которое с каждым вебинаром будет улучшаться и масштабироваться. Таким образом, вы узнаете, как создавать интерфейс своей программы, как в нее добавить работу с базой данных, а также как создавать клиент-серверные приложения. Но, прежде чем приступать к созданию книги контактов, мы попрактикуемся с QML на примере создания игры &#39;Пятнашки&#39;.</p> <p>Итак, тема первого вебинара&nbsp; - <strong>Знакомство с QML. Пятнашки</strong><br /> <br /> В течении вебинара будет разработана игра &laquo;Пятнашки&raquo; с бизнес-логикой на C++ и графикой на QML. Эта маленькая игра позволит на практике понять основные принципы и best practices в QML.</p> <p>После просмотра данного вебинара, зритель освоит базовую информацию о языке QML и об его интеграции с C++, что позволит ему эффективно разрабатывать графические приложения с динамичным пользовательским интерфейсом, используя Qt фреймворк.</p> <p>Приложение, разработанное в течении вебинара, может стать примером в портфолио джуниор разработчиков.</p> <p><strong>План вебинара:</strong></p> <p>1) Структура QML компонентов</p> <p>2) Компоненты QtObject, Item</p> <p>3) Базовые графические компоненты</p> <p>4) Взаимодействие C++ и QML:</p> <ul> <li>Q_PROPERTY</li> <li>Q_INVOKABLE</li> </ul> <p>5) Компоненты ListView, GridView</p> <p>6) Сигналы-слоты в QML</p> <p>7) Свойства, алиасы</p> <p>8) Регистрация своих классов в метасистеме</p> <p>9) Кастомизация компонентов</p> <p>&nbsp;</p> <p><strong>Целевая аудитория:</strong></p> <p>Данный вебинар будет интересен разработчикам, желающим попрактиковаться с фреймворком Qt или людям, которые ранее не сталкивались с QML, а разрабатывали свои графические приложения с помощью Qt Widgets.</p> <p>Также он будет интересен новичкам, которые хотят научиться писать кросплатформенные графические приложения на C++.</p>

Основні технології. Фреймворки та допоміжні інструменти. Необов’язкові технології. Зарплати FrontEnd розробників. DOU. Djinni. Stack Overflow Developer Survey 2023. Чому так багато технологій? Поради новачкам FrontEnd. Підсумки.   FrontEnd – один із найлегших розробницьких напрямків в ІТ. Він вигідно вирізняється тим, що поєднує в собі програмування та творчість, оскільки девелопер працює над оживленням дизайнерського макету та створенням відповідної користувацької логіки. Також перевагою фронтенду є те, що побачити результат своєї роботи можна майже одразу – в будь-якому браузері. Відносна легкість фронтенду породжує велику популярність серед бажаючих потрапити в ІТ, а враховуючи наслідки відкритої агресії по відношенню до України – особливо велику популярність, адже це можливість працювати віддалено (на ІТ-компанію або на фрилансі) і отримувати гарну зарплату. Відповідно, конкуренція серед Trainee/Junior FrontEnd розробників шалена, а тому роботодавці вимушені закручувати гайки і підвищувати вимоги до кандидатів, аби відібрати найкращих.  Тож як стати фронтенд розробником? Якими технологіями необхідно володіти, аби стати Intern/Junior FrontEnd розробником у 2024 році? Проаналізувавши вакансії на українському ринку IT, ми склали список актуальних інструментів, які зазвичай вимагають роботодавці від кандидатів. Їхній перелік – нижче у статті. Frontend developer roadmap. Основні технології HTML5 & CSS3 HTML5 і CSS3 – це фундаментальні технології, без знання яких не обійтися жодному веброзробнику. За допомогою мови гіпертекстової розмітки HTML створюється розмітка (каркас) кожної вебсторінки. Потім мова стилів CSS збагачує візуальне оформлення сайту і надає йому привабливого та ефектного зовнішнього вигляду. Крім цього, необхідно володіти: кросбраузерним адаптивним верстанням, щоб вміти створювати сайти під мобільні пристрої, планшети і широкоформатні екрани та для різних браузерів; семантичним верстанням для підвищення якості розмітки та покращення пошукової індексації сайту; валідним верстанням, яке передбачає повну відповідність коду розробника всім стандартам W3C – організації, яка створює та впроваджує технологічні стандарти для World Wide Web. Приділіть особливу увагу верстанню під мобільні пристрої, тому що сучасний вебспоживач дуже багато часу проводить у смартфоні. Існує навіть спеціальний підхід, при якому спочатку верстається вебсайт під мобільні пристрої, а потім під десктопи – називається Mobile First. Це загальні вимоги щодо верстання. Тепер розглянемо більш детально вимоги безпосередньо щодо мови стилів – CSS. Тут ви повинні знати основні властивості CSS3: фони, градієнти, тіні, анімації, трансформації, переходи, а також технології Flex та Grid, про які ми ще поговоримо. Гарне володіння HTML та CSS вже дозволяє займатися верстанням сайтів та заробляти гроші. Саме з цих двох базових технологій починається шлях до професії FrontEnd розробника. Якісно вивчити HTML та CSS ви зможете за допомогою наступних наших курсів: HTML5 & CSS3 Стартовий; HTML5 & CSS3 Базовий; HTML5 & CSS3 Поглиблений. Flex та Grid CSS Технології верстання надійних адаптивних вебсторінок, які дозволяють легше створювати динамічні сайти та зручніше структурувати їх вміст. На нашому ресурсі є українськомовні відео курси, які гарно пояснюють теми Flex та Grid верстання: CSS Flexbox та Верстання на Grid. CSS-препроцесори CSS-препроцесор — це програма, яка має власний синтаксис, але може згенерувати з нього CSS-код. Найчастіше у вакансіях зустрічаються SASS, SCSS, Stylus, LESS. Препроцесори призначені для: прискорення процесу написання коду; спрощення читання коду та його подальшої підтримки; мінімізації рутинної роботи під час написання коду. Для підвищення ефективності написання CSS-коду достатнім буде вивчення лише одного препроцесора, але у вакансіях часто зустрічаються одразу декілька. Git & GitHub Git – найбільш популярна система контролю версій, яка дозволяє вести історію розроблення проєкту з можливістю доступу до кожної збереженої версії. Крім того, варто вміти працювати з сервісом онлайн-хостингу проєктів, який використовує систему контролю версій. У даному випадку це GitHub. У тандемі з Git він дозволяє розробникам зберігати свій код онлайн у хмарному сховищі, а потім взаємодіяти з іншими розробниками у різних проєктах. Дані системи дозволяють команді програмістів працювати над одним проєктом одночасно, зберігаючи внесені зміни, і навіть відслідковувати виконання завдань кожним членом групи. Git & GitHub — дуже важливі інструменти для будь-якого IT-розробника, вивченням яких слід зайнятися якомога раніше. Ми рекомендуємо вивчати Git на ITVDN за допомогою курсу «Основи роботи з Git». Знання про вебтехнології та мережу інтернет Щоб якісно виконувати свою роботу, фронтенд розробник повинен розбиратися у вебі і розуміти принципи його функціонування. Таким чином, необхідно знати: як працює інтернет; протоколи HTTP/HTTPS, вебсокети; як працюють браузери; що таке DNS та як він працює; що таке доменне ім'я; що таке хостинг. Також буде непогано, якщо ви спробуєте налаштувати сайт на якомусь безкоштовному хостингу, прив'яжете домен до цього хостингу. JavaScript Мова програмування, яка використовується як при розробленні клієнтської сторони веб-застосунку, так і серверної. За допомогою JavaScript (скорочено JS) можна писати навіть настільні та мобільні додатки, використовуючи певні програмні платформи та бібліотеки. Ця мова дозволяє: динамічно змінювати HTML-розмітку; здійснювати інтерактивну взаємодію з користувачем; анімувати зображення; здійснювати валідацію форм; керувати мультимедіа тощо. Іншими словами, JavaScript "оживлює" сторінку та додає їй функціональності. Гарне володіння цією мовою програмування є обов'язковим пунктом для кожного FrontEnd розробника. JavaScript використовує офіційний стандарт ECMAScript (скорочено - ES), який має на увазі певний формальний опис синтаксису, базових об'єктів та алгоритмів. На даний момент існує багато різних версій ES. Роботодавці найчастіше вимагають знання ES6+. Однак спочатку необхідно вивчити чистий JavaScript (vanilla JavaScript) і лише потім вникати в нові стандарти. Як не крути, а класику треба знати. Завдяки гарному володінню JS можна швидко розібратися в будь-якій версії ES, а потім опанувати будь-який фреймворк або бібліотеку. ITVDN надає можливість вивчити JavaScript з нуля до поглибленого рівня за допомогою курсів: JavaScript Стартовий; JavaScript Базовий. JavaScript Core (DOM, AJAX, JSON) DOM (Document Object Model) – об'єктне представлення вихідного HTML-документу. Ключовим є поняття DOM-дерева, яке описує структуру сторінки. За допомогою об'єктної моделі JavaScript отримує повну владу над HTML-документом: можливість редагувати, видаляти та додавати елементи і атрибути HTML, змінювати CSS-код тощо. AJAX (Asynchronous JavaScript And XML) – це синтез технологій JavaScript і XML, який фактично являє собою комбінацію: вбудованого в браузер XMLHttpRequest-об'єкту (щоб запитувати дані з вебсервера); JavaScript та HTML DOM (щоб відображати або використовувати дані). AJAX дозволяє вебсторінкам здійснювати асинхронне оновлення, обмінюючись даними з вебсервером. Завдяки цій технології сторінка не потребує перезавантаження – оновлюється лише конкретна її частина (згадайте стрічку новин у соціальних мережах). JSON (JavaScript Object Notation) – це загальний формат обміну даними. Дозволяє здійснювати обмін інформацією між програмними продуктами, котрі написані різними мовами. Таким чином, клієнт, який використовує JavaScript, може легко передавати дані на сервер, реалізований за допомогою Ruby/Java/PHP. Всі три технології мають особливу цінність для кожного веброзробника та розкривають організацію роботи інтернет-застосунку. REST API API – Application Programming Interface – це набір правил, при дотриманні яких програми можуть між собою взаємодіяти. Розробник створює API на сервері та дозволяє клієнтам звертатися до нього. Красномовним прикладом буде API від Google Maps, котрий дозволяє веброзробнику вказати на гугл мапі розташування певної будівлі (точку видачі інтернет-замовлень, офіс компанії абощо) на своєму сайті. Таким чином програміст позбавляє себе необхідності самому розробляти власну мапу і користується вже готовим рішенням від Google, використовуючи набір правил від API. REST – Representational State Transfer – це архітектурний підхід, котрий регламентує, як саме API мають виглядати. Цьому набору правил має слідувати девелопер під час створення власного застосунку. Простими словами, REST – це звичайний запит виду «клієнт-сервер» з використанням HTTP-протоколу. Фронтенд розробнику необхідно розбиратися у REST API, оскільки ця технологія використовується усюди, де є необхідність працювати з даними від сервера. Алгоритми та структури даних Розуміння алгоритмів та структур даних (ADS, від Algorithms and Data Structures) – обов'язок будь-якого грамотного програміста. До структур даних відносяться: стеки, черги, зв'язані списки, графи тощо. Вивчивши їх, ви зможете керувати складністю своїх програм, роблячи їх більш доступними для розуміння, а також розробляти високопродуктивні програми, які ефективно працюватимуть з пам'яттю. Знання алгоритмів дозволить вам створювати складні конструкції для ефективного розв'язання широкого спектра завдань. Коли говорять про алгоритми, зазвичай мають на увазі алгоритми сортування та пошуку: сортування прямим включенням, прямим вибором, злиттям, пірамідальне, прямий пошук, бінарний, індексно-послідовний та інші. Важливо розумітися і на нотації Big O, яка описує складність кожного алгоритму. Даний механізм допомагає визначити, за яких умов вигідніше використовувати той чи інший алгоритм. Зазначимо, що як новачкові, вам не треба пірнати вглиб цих тем. Буде достатньо: теоретичного володіння ADS; розуміння, де яку структуру даних слід використати; уміння оцінити складність алгоритму (Time Complexity та Space Complexity); уміння написати декілька алгоритмів (найпопулярніші алгоритми сортування та пошуку). Володіння ADS допоможе вам створювати більш якісний та оптимізований код. Крім того, це посилить ваші позиції серед інших кандидатів. Webpack Потужний збирач модулів (bundler), який дозволяє скомпілювати в один файл кілька різних компонентів: від .js та .css файлів до картинок, шрифтів тощо. Використовується для роботи над об'ємними проєктами і досить часто зустрічається у вакансіях. Воно і не дивно – це найпопулярніший збирач, як-не-як. npm Node Package Manager – пакетний менеджер, який є найбільшим у світі реєстром програмного забезпечення (відповідно до витягу з офіційного сайту). Використовує платформу Node.js і дозволяє розробникам з усього світу користуватися вже готовими програмними рішеннями та поширювати власні на основі Node.js. npm використовують для керування залежностями, себто для встановлення, оновлення та видалення тих пакетів (бібліотек та інструментів), які використовуються у вашому проєкті. Незамінна річ для FrontEnd розробників, якою ви обов’язково користуватиметеся. Основи Figma Figma – це популярний дизайнерський інструмент для створення інтерактивних прототипів застосунків або веб-сайтів. З його допомогою дизайнер створює дизайн, який фронтенд-розробник потім верстає за допомогою HTML/CSS і додає інтерактивність при участі JavaScript. Знання основ фігми дозволяє девелоперу зручно взаємодіяти з дизайнерським прототипом: швидко дізнаватися необхідні розміри тих чи інших елементів, робити експорт картинок та іконок тощо. Додатковий плюс – можливість використання браузерної версії Figma. Англійська мова План навчання Front-end повинен обов'язково включати підтягування English. Знання англійської є однією з основних вимог до фронтенд-розробника, оскільки велика кількість корисної інформації знаходиться саме на англомовних сайтах. Рівень читання технічної документації буде достатньо для комфортного користування іноземними ресурсами (Intermediate). Однак чим вищий рівень вашої англійської, тим більші шанси отримати job-офер. Інгліш використовується не тільки при роботі з документацією, а і при комунікації з командою та клієнтами. Серед програмістів побутує вислів: «Яку мову слід вчити першою? Вчи англійську!». Тому не пошкодуйте ваш час і гарненько підтягніть англійську – цілком можливо, що саме гарне володіння нею стане вирішальним при розгляді вашої кандидатури. Підтягнути English ви можете завдяки наступним безкоштовним відео курсам на ютуб-каналі CodeUA: Business English – ви опануєте базову ділову лексику для активної участі у перемовинах англійською, а також ведення ключової документації цією мовою. IT English – акцент на прокачці ділової лексики, граматики, усталених конструкцій та виразів з ІТ-сфери. Фреймворки та допоміжні інструменти Основні фреймворки JavaScript Це інструменти, за допомогою яких створюються динамічні веб/мобільні/десктопні застосунки мовою JavaScript. Вони прискорюють розроблення вебзастосунків та передбачають чітко структуровану організацію коду, підвищуючи його якість та чистоту. Найпопулярнішими high-level інструментами для фронтенд розроблення можна назвати фреймворки Vue.js, Angular та бібліотеку React. Кожен із них призначений для вирішення свого спектру завдань і має різний ступінь складності: Vue.js – найлегший (але й з найменшою спільнотою), React – середньої складності, Angular – високої складності. Варто сконцентруватися на глибокому вивченні одного фреймворку, але в той же час дуже рекомендується знати особливості та сферу застосування всіх перерахованих вище технологій. Який фреймворк все ж обрати? Думки щодо цього розходяться. Інструментарій вибирається індивідуально під проєкт та важко передбачити, які задачі вам потрібно буде вирішувати. На даний момент найбільшою популярністю користується React, оскільки вона збалансована як з точки зору складності, так і з точки зору багатства функціоналу. До того ж найбільша кількість вакансій припадає саме на цю бібліотеку, а значить, що вона цікава не тільки розробникам, а й бізнесу. Кожен із цих трьох інструментів доступний для вивчення на платформі ITVDN. Українськомовні курси за напрямком Angular: Angular Базовий. Тестування Angular-застосунків. За напрямком React: React Базовий. За напрямком Vue.js: Vue.js Стартовий. Допоміжні фреймворки JavaScript Наряду з традиційною трійкою – Vue.js, React та Angular – у вакансіях часто зустрічаються інші фреймворки, створені на їхній базі, наприклад Next.js та Nuxt. Next.js базується на популярному React і дозволяє збільшити ефективність та масштабувати процес створення реакт-застосунків. Він додає шар абстракції над реактом, а одними з найголовніших його нововведень є рендеринг на серверній стороні та генерація статичних вебсайтів. Дуже багато React-вакансій для джунів мають серед вимог та побажань Next.js – якщо ви орієнтуєтеся на реакт, рекомендуємо ознайомитися з даним фреймворком. Nuxt – високорівневий фреймворк на базі Vue.js для масштабованого та інтуїтивно зрозумілого створення FullStack-вебзастосунків та вебсайтів. Зустрічається не часто у вимогах, але його вивчення може вигідно підсвітити вашу кандидатуру. Angular Material Технологія, на яку слід звернути увагу тим, хто планує розвиватися в напрямку Angular. Це бібліотека UI компонентів, яка дає доступ до готових візуальних рішень задля пришвидшення процесу верстання на Ангулярі. Бібліотека сповідує принципи Material Design, запроваджені компанією Google у 2014 році, які передбачають привабливий та інтуїтивно зрозумілий UI дизайн, котрий однаково гарно виглядатиме на різних пристроях. Необов’язкова для вивчення бібліотека, але часто зустрічається у вакансіях – її знання допоможе вам як мінімум виділитися серед інших Angular-кандидатів. TypeScript Кросплатформна строготипізована мова, яка є розширенням JavaScript. Строга типізація дозволяє зменшити кількість потенційних помилок у вихідному коді, написаному на TypeScript. Також ця мова реалізує концепції, які близькі до об'єктно-орієнтованих мов, таких як C#, Java та подібних. TypeScript підвищує швидкість та зручність написання комплексних програм, внаслідок чого їх стає легше підтримувати, масштабувати та тестувати. Відповідно до зарплатної аналітики від DOU (зима 2024), TypeScript обігнав JavaScript за популярністю і посідає перше місце серед українських розробників в категорії “Основна мова програмування”. У вакансіях ця мова зустрічається досить часто незалежно від цільового фреймворку. При цьому для Angular розробників знання TypeScript є обов'язковим. Радимо вивчити дану мову, а зробити це ви можете за допомогою нашого українськомовного курсу “TypeScript”. Інструменти керування станом програми (State Management) Великі вебзастосунки постійно зростають у складності, а тому зберігати дані, які можуть використовуватися в різних місцях, стає все складніше. Для вирішення цієї проблеми були вигадані окремі бібліотеки, що йдуть паралельно з фреймворками — вони служать для управління глобальним сховищем даних усього веб-застосунку і називаються менеджерами станів. Їх застосування вже стало стандартом у FrontEnd розробленні. Для девелоперів, які використовують Vue.js, це VueX, для React-розробників – Redux і MobX, для Angular-девів – RxJS, NgRx. Необов’язкові технології (але дуже корисні)   Патерни проєктування JavaScript Це найкращі практики, які описують типові способи вирішення поширених завдань, що виникають під час проєктування програмного забезпечення. Знання шаблонів проєктування дозволяє писати більш чистий, зрозумілий і читабельний код, а також уникати "винайдення велосипеда". Більше того, володіння патернами показує вашу грамотність як розробника і підвищує вашу цінність в очах роботодавця, що допоможе виділитися на тлі конкурентів. CSS-фреймворки Інколи у вакансіях для FrontEnd-початківців можна зустріти вимоги до володіння CSS-фреймворками. Найпопулярнішими є Bootstrap і Tailwind. Вони допомагають суттєво прискорити створення верстання за рахунок низки вбудованих можливостей. Bootstrap – результат старань команди з Twitter, який вийшов у світ в далекому 2011. Є повністю безкоштовним, має відкритий вихідний код і дозволяє створювати гнучкі, адаптивні вебінтерфейси під різні пристрої, використовуючи вже готові шаблони кнопок, форм, таблиць тощо. Tailwind більш сучасний та трендовий – 2017 року випуску, і при цьому відомий своїм високим ступенем кастомізації (на відміну від Bootstrap). Він не дає набору готових шаблонів (доступно тільки в платному Tailwind UI), проте дозволяє швидко створювати власні рішення за рахунок особливого синтаксису. В будь-якому випадку, рекомендуємо спробувати обидва інструменти, аби відчути їхню потужність, переваги та недоліки. GraphQL GraphQL є моделлю даних, яка часто використовується для побудови API для застосунку. Головна перевага перед REST API – наявність лише однієї точки входу, що дозволяє більш динамічно та гнучко визначати взаємодію з даними. Також GraphQL має такий синтаксис, який дозволяє працювати з будь-якою мовою програмування як на клієнті, так і на сервері – лишається тільки підключити необхідну бібліотеку до вашого проєкту для інтеграції GraphQL. На момент написання статті кожна шоста вакансія на Djinni у розділі “JavaScript / FrontEnd” з досвідом від 0 до 1 року мала серед обов’язкових або бажаних технологій GraphQL. jQuery Невелика, швидка та багатофункціональна JavaScript-бібліотека, для роботи з якою необхідно володіти HTML, CSS та JavaScript на базовому рівні. Вона покликана спростити програмування мовою JS. Дана бібліотека представляє об'ємні рішення поширених завдань у вигляді методів, що викликаються одним рядком коду. Незважаючи на те, що jQuery вже давно покинула зеніт популярності, поступаючись місцем фреймворкам JS, велика кількість сайтів все ще використовує цю бібліотеку, а деякі роботодавці вказують її серед вимог для Junior, особливо для джунів-верстальників. Лінтери Інструменти, які дозволяють аналізувати якість JavaScript-коду відповідно до стандарту ES. Вони вбудовуються в середовище розроблення і вказують на наявність невідповідностей стандарту коду, якщо такі є. Даний механізм корисний як для одноосібного розроблення (для самоконтролю), так і для командного, коли кожен розробник повинен слідувати тим самим мовним конструкціям, аби на виході отримати єдиний, цілісний проєкт. Один із найвідоміших лінтерів – ESLint. Це необов’язковий інструмент для роботодавця, але він дуже корисний для веброзробників у силу його можливостей з контролю якості коду. Тестування Jest та Cypress – головні інструменти модульного тестування, яке покладається на плечі розробника. Але що це таке? Unit тестування (воно ж – модульне тестування) – процес, який полягає у створенні тестів для перевірки працездатності окремих ділянок написаного програмістом коду. Виконується безпосередньо автором коду. Яку користь приносить Unit тестування: суттєве скорочення багів у коді; спрощення рефакторингу коду; забезпечення якісного відокремлення інтерфейсу від реалізації; краще розуміння написаного коду; можливість протестувати найдрібніші ділянки коду. Усі інструменти вчити не треба — достатньо навчитися працювати лише з одним із них. Gulp / Grunt Системи збирання, які автоматизують рутинні завдання розробників: мініфікацію коду, оптимізацію зображень, тестування, аналіз якості коду та інше. Підходять для розроблення невеликих проєктів. SVG Мова розмітки масштабованої векторної графіки. Зображення на сторінці, зроблені за допомогою SVG, коректно відображаються на екранах з різною роздільною здатністю, не втрачаючи при цьому своєї якості, на відміну від традиційних растрових .jpeg, .png та інших. SOLID принципи SOLID – це принципи, які є своєрідним ременем безпеки для тих, хто працює відповідно до парадигм об'єктно-орієнтованого програмування. Вони були створені з метою убезпечити ООП-орієнтованого розробника від незрозумілого, заплутаного спагеті-коду, який також ще й дуже важко підтримувати. SOLID – це акронім, який складається з п'яти букв, що кодують п'ять основних принципів: S - Single Responsibility Principle (принцип єдиної відповідальності) O - Open-Closed Principle (принцип відкритості-закритості) L - Liskov Substitution Principle (принцип підстановки Барбари Лісков) I - Interface Segregation Principle (принцип розділення інтерфейсу) D - Dependency Inversion Principle (принцип інверсії залежностей) Володіння цими принципами дозволяє грамотно проєктувати та розробляти такі програмні системи, які з великою ймовірністю зможуть тривалий час розвиватися, розширюватися та підтримуватися. Хоча SOLID принципи написані переважно для ООП, їхні ідеї цілком застосовні і до сучасного JavaScript розроблення, що допоможе фронтенд розробникам створювати більш чистий та лаконічний код. Зарплати FrontEnd розробників DOU Звернемося до вже згаданої зарплатної аналітики від української IT-спільноти DOU за зиму 2024 року. Медіанна зарплата всіх українських розробників, які взяли участь в опитуванні (а їх 5959), наступна: Intern Software Engineer – 350 USD; Junior Software Engineer – 950 USD; Middle Software Engineer – 2500 USD; Senior Software Engineer – 4738 USD. Тепер поглянемо на медіанну ЗП FrontEnd розробників: Junior – 900 USD; Middle – 2400 USD; Senior – 4600 USD. На всіх позиціях зменшення винагороди у порівнянні з аналітикою півроку тому. Виходить, медіана фронтендників майже на всіх тайтлах трохи менша, ніж загальна медіана, проте розрив досить невеликий. Djinni Тепер перейдемо до зарплатної аналітики українського сервісу Djinni і оберемо розділ “JavaScript / FrontEnd” та розглянемо попит за останні 6 місяців. Маємо 17818 кандидатів, зарплатні очікування яких становлять від 600 USD до 3000 USD при зарплатних вилках вакансій 2000-3300 USD. На 1 вакансію в середньому припадає 114.4 відгуки, а кількість пропозицій на кандидата – 0.2. Stack Overflow Developer Survey 2023 Погляньмо, скільки заробляє цей фахівець за межами України. У цьому нам допоможуть результати опитування Stack Overflow Developer Survey 2023 (понад 90 000 респондентів із США, Індії, Німеччини, Канади, Великої Британії та інших країн). Ця цифра – 59 970 USD на рік (приблизно 5000 USD на місяць). При цьому буде важливо сказати, що фронтендники з даного опитування мають у середньому 8 років професійного кодингу – і це один із найнижчих показників. Нижче за них розташовуються лише Data Scientist / ML Specialist – 7.9 років досвіду, а також студенти, які мають трохи більше 2.8 років досвіду у професійному створенні коду. Чому так багато технологій? Поради новачкам FrontEnd Український ринок FrontEnd дуже сильно перегрітий кандидатами. Роботодавці, звісно, користуються цією ситуацією: виставляють більше вимог до кандидатів і паралельно знижують рівень ЗП. Таким чином вони хочуть відфільтрувати слабких кандидатів і отримати якомога скіловішого фахівця за якомога нижчою ціною, оскільки в Junior-девелопера треба вкласти значну кількість часу та грошей, доки він вийде на таку продуктивність, яка приносить хоч якісь прибутки.  Наша стаття враховує ці нюанси, а тому ми відобразили максимальну кількість технологій, які ви з великою ймовірністю зустрінете у більшості вакансій. Не всі інструменти потрібно знати та вчити, але чим багатший ваш інструментарій, тим більші шанси на працевлаштування. Декілька порад для початківців, які вирішили підкорити FrontEnd: Робіть пет-проєкти і публікуйте їх на GitHub. Створюйте застосунки, які вирішуватимуть ваші повсякденні задачі, і намагайтеся застосувати в них якомога більше вивчених вами технологій. Це дозволяє підтвердити ваші знання на практиці та демонструє потенційному працедавцеві ваші навички кодингу. Використовуйте ШІ. Штучний інтелект буде корисний в низці задач: прискорення розроблення; генерування ідей для пет-проєктів; пояснення складних тем; асистенція при написанні коду тощо. Розвивайте власний бренд. Чим більша ваша популярність в ІТ-спільноті, тим більші шанси запрошення на співбесіду. Для цього найкраще підходить LinkedIn – соціальна мережа для встановлення робочих контактів, але також можна підключити Instagram, YouTube тощо. Публікуйте пости з корисною інформацією, діліться вашими досягненнями, дієвими порадами та особистими враженнями щодо вивчення FrontEnd, і т. д. За вами стануть спостерігати багато ІТ-фахівців, які можуть самі завітати до вас із пропозицією роботи або порекомендувати вас комусь. Не нехтуйте вивченням англійської мови. English є супер важливим в умовах перегрітого ринку джунів – треба обов’язково мати B1. Якщо є декілька сильних кандидатів, які приблизно однакові за soft & hard скілами, роботодавець обере того, хто краще знає англійську. Також згадана аналітика DOU доводить – чим краще знаєш англійську, тим на більшу ЗП можеш претендувати. Менторинг. Максимально вдале рішення – знайти собі ментора. Він буде наглядати за вашим навчанням та прогресом, підкидати задачі/проєкти, давати корисні поради, відповідати на питання тощо. А наприкінці вашого навчання навіть може запропонувати вільне місце в компанії або ж порекомендувати знайомим айтівцям. Відточуйте навички програмування у Codewars або LeetCode. Це спеціальні сервіси для програмування, де ви обираєте собі задачу (є різні рівні складності) та виконуєте її, розвиваючи навички кодингу необхідними мовами. Дуже зручно і корисно, враховуючи, що на співбесіді можуть бути схожі live-coding завдання, а також, що LeetCode використовують девелопери, які готуються до інтерв'ю в топових ІТ-компаніях (Facebook, Google, Amazon тощо). Також на ITVDN є спеціальний інтерактивний практикум, де ви можете “набити руку”. Колаборація з розробниками-початківцями. Долучайтеся до команд однодумців, де ви працюватимете спільно над проєктом, аби отримати навички роботи в команді. Звісно, це не дорівнює комерційному досвіду, який прагнуть побачити у вас роботодавці, але дозволяє попрацювати в умовах, що максимально наближені до реальних. Відвідуйте тематичні ІТ-події в офлайн форматі. Там ви зможете поспілкуватися з іншими девелоперами, показати себе і розширити свою мережу корисних знайомств. Контактувати з ІТ-фахівцями на таких івентах обов’язково! Інакше ви просто дарма витратите час та гроші. Пройдіть пробне інтерв’ю за донат. Ви можете місяцями не отримувати запрошення на співбесіду, через що страждатиме ваша мотивація та впевненість. Аби не падати духом і дати собі об’єктивну оцінку, домовтеся про інтерв’ю з якимось FrontEnd спеціалістом, який проведе вам технічну співбесіду за донат і надасть свої поради щодо подальшого кар’єрного шляху – наразі це популярна тема. Пробне інтерв’ю з рекрутером. Можливо, проблема відсутності запрошень криється у вашому CV або погано оформленому LinkedIn-акаунті? Із цим допоможе розібратися рекрутер або кар’єрний консультант, який надасть свої послуги за гроші або відповідний донат на збройні сили. Стосовно двох останніх пунктів – на ITVDN всі студенти, котрі навчаються у форматі онлайн занять із тренером у групі (Live Online), безкоштовно отримують персональну допомогу щодо подальшого працевлаштування, а саме: індивідуальну консультацію задля визначення персональних цілей; допомогу в складанні CV (резюме) та Cover Letter (супровідного листа); допомогу з оформленням LinkedIn-акаунту; проведення тестового інтерв’ю з розгорнутим фідбеком; формування стратегії пошуку роботи; надання додаткових корисних матеріалів. Підсумки FrontEnd розробник – досить універсальний боєць у світі веброзроблення. Він повинен вміти і верстати, і створювати логіку роботи клієнтської частини, і розуміти роботу серверної частини вебзастосунку. Для опанування такого великого інструментарію варто запастися часом, терпінням та завзятістю. Зазначені у статті засоби розроблення сайтів також мають аналоги, оскільки для вирішення різних завдань підходять різні вебінструменти. Однак ми вибрали найпопулярніші та найефективніші з них. Якщо у вас є бажання опановувати цю професію і ви хочете самостійно “помацати”, чим займається фронтенд розробник, на ITVDN створено комплексну програму навчання у форматі відео навчання, яка включає 51 відео курс. Якщо ж вам більше до вподоби живе онлайн навчання з тренером та у групі з іншими учнями, пропонуємо формат Live Online для вивчення спеціальності FrontEnd (Angular або React напрямки). Бажаємо вам успіхів у досягненні ваших цілей! Залишайтеся з ITVDN!

Дорогие друзья! Предлагаем вашему вниманию перевод статьи, опубликованной на DOU.ua 10 ноября 2020 года. Оригинальная версия на украинском языке доступна по ссылке. На DOU размещено более 450 вакансий для .NET-разработчиков, что свидетельствует о популярности этой технологии. Редакция DOU собрала вопросы, которые .NET-разработчики задают своим коллегам на технических собеседованиях. Готовьтесь на здоровье :) Вопросы для Junior Общее 1. Назовите основные принципы ООП. 2. Что такое наследование, инкапсуляция, абстракция, полиморфизм: приведите примеры (желательно из собственного опыта). От какого класса неявно наследуются все классы в .NET? Разрешено ли множественное наследование в C#? 3. Что такое рекурсия? 4. Что такое лямбда-выражение? 5. Что такое параллельное программирование (многопоточность) и его назначение? Какие классы используются? 6. Что такое JSON? 7. Как вы понимаете REST? 8. Расскажите о SPA concept. 9. Какие GoF-паттерны использовали? 10. Какая разница между GET и POST HTTP методами? 11. Какую проблему решает Docker? Каковы его плюсы и минусы? 12. Чем принципиально отличаются unit-тесты от интеграционных тестов?   Обработка исключений 13. Что такое Exception? 14. Для чего служат try, catch, finally? В каком случае может не выполниться блок finally? 15. Что такое call stack? Какие ключевые слова вы знаете?   Платформа .NET 16. Что такое ASP.NET? 17. Какие существуют типы Action filters? 18. Что такое Web Service? 19. Что такое CLR? 20. Что такое сборщик мусора (Garbage Collector) на базовом уровне? 21. Что такое делегат? 22. Отличается ли Delegate от Action? 23. Что такое LINQ и для чего используется? Приведите несколько примеров применения LINQ. 24. Что такое пространство имен (namespace) и зачем это нужно?   Типы данных, коллекции и структуры данных 25. Какие типы данных вы знаете? 26. Какие примитивные типы знаете? 27. Что такое Nullable-тип? 28. Что такое тип значения, а что такое тип ссылки? Что из этого class, а что struct? В каком участке памяти они хранятся? 29. Чем отличаются value от reference type? String - это reference или value? 30.В чем отличие между string builder и string? 31. Что такое дженерики? Какие проблемы они решают? 32. Что такое boxing / unboxing? 33. Что такое Array, List, HashSet, Dictionary? Приведите примеры использования этих структур данных. Какая сложность операций с ними (поиск, вставка, удаление)? 34. Какие знаете коллекции? 35. Что делает оператор yield?   Классы, структуры и интерфейсы 36. Что такое класс? 37. Чем отличается класс от абстрактного класса? 38. Чем отличается абстрактный класс от интерфейса? Для чего нужны интерфейсы и какие задачи они выполняют? 39. Какие вы знаете модификаторы доступа? 40. В чем разница между обычным классом и статическим? 41. В чем разница переопределения метода между ключевыми словами new и override? 42. Какое различие между const и read only? 43. Разница между структурой и классом. Приведите примеры структур. 44. Может ли экземпляр структуры храниться в куче (heap)? Как это сделать?   Асинхронность 45. Что такое асинхронность и чем она отличается от многопоточности? 46. Какие есть ключевые слова для использования асинхронности в коде? 47. Что означают ключевые слова async / await?   Базы данных 48. Разница между реляционными и нереляционными базами, плюсы и минусы использования обоих вариантов. 49. Что такое индексы в RDBMS? 50. Какие типы JOIN существуют в SQL?   Тестирование 51. Для чего нужны unit-тесты? 52. Какие преимущества и недостатки использования unit-тестов? 53. Из каких трех логических блоков состоит unit-тест?   Вопросы для Middle   Общее 54. Вы набираете google.com в браузере. Расскажите как можно подробнее, что происходит в это время на HTTP-уровне? 55. Как работает HTTPS? 56. Как вы понимаете SOLID? 57. Какие протоколы сериализации вы знаете и где они применяются? 58. Что такое в вашем понимании чистая функция? Какие у нее преимущества? 59. Что такое dependency injection и зачем оно нужно? 60. Что такое cohesion и coupling (связанность и связность)? 61. Что такое IaaS, PaaS, SaaS и каковы различия между ними? 62. Какие способы отладки программы вы используете? 63. Какие знаете паттерны? Объясните суть перечисленных. 64. В чем суть паттерна Singleton? Почему его еще называют антипаттерном? 65. Для чего нужен паттерн Strategy? 66. Какие ключевые различия между распределенными системами и монолитными? 67. Какие паттерны проектирования распределенных систем вы знаете? 68. Какие есть принципы работы Message bus? Почему могут возникать дубликаты в очередях? 69. Какие принципы построения идемпотентных сервисов знаете? 70. Расскажите, как работают асинхронные методы? Чем асинхронность отличается от параллелизма?   Платформа .NET 71. Какие исключения нельзя остановить в блоке catch? 72. Какая разница между .NET Standard Class Library и .NET Core Class Library? 73. Объясните разницу между отложенным и немедленным исполнением в LINQ. Приведите примеры. 74. Для чего нужен метод ConfigureServices в Startup.cs? 75. Какая разница между services.AddTransient и services.AddScope в ASP.NET Core? 76. Что такое Kestrel? 77. Опишите ASP.NET MVC request pipeline. 78. Как в ASP.NET WebAPI настроить кэширование ответов на HTTP-запросы?   Управление памятью 79. Что такое куча и стек? Различия, принцип работы. 80. Как работает сборщик мусора? 81. Зачем нам зарезервированное слово using в C#, если в .NET есть автоматическое управление памятью? Как с этим связан disposable-паттерн и зачем такой сложный паттерн для managed и unmanaged ресурсов? 82. Какие особенности работы с Large Object Heap?   Типы данных, коллекции и структуры данных 83. Когда генерируется дженерик-класс конкретного типа - при выполнении программы или во время компиляции? 84. Что такое рефлексия? 85. Расскажите о коллекции LinkedList <T>. Чем она отличается от других коллекций? 86. Что такое индексатор? 87. Что такое immutable object? Какие преимущества дает использование immutable object? Предложите способ реализации его в .NET. 88. Когда использовать StringBuilder, а когда string? Как работает StringBuilder? 89. Что такое балансирование деревьев? 90. Что такое Key-value структуры? 100. Что такое хэш-функция и зачем нужны хэш-таблицы? 101. Какими свойствами должна обладать идеальная хеш-функция? 102. Что такое коллизии и как с ними бороться? 103. В чем заключается сложность CRUD-операций в Dictionary <K, V> в .NET? 104. Где хранятся массивы? Массивы примитивных типов? 105. В чем отличие между массивом (T [ ]) и списком (List <T>)? 106. В чем разница между IList <T> и IEnumerable <T>? 107. Зачем нужны Enumerable, Observable, AsyncEnumerable и какие модели получения данных они реализуют? 108. В чем разница между IEnumerable и IQueryable? 109. Что такое enum flags?   Базы данных 110. Расскажите о нормальных формах в СУБД. 111. Что такое индекс в БД? 112. Когда следует использовать индексы? Преимущества и недостатки. 113. Какие типы индексов существуют? Чем они отличаются? 114. Что такое ACID? 115. Какие вы знаете уровни изоляции транзакций? 116. Что такое план выполнения запроса (execution plan) в MS SQL? 117. Проблема: запрос долго выполняется. Какие есть методы ее диагностики и решения? 118. Как ORM (Entity Framework или Entity Framework Core) транслируют C# код в язык запросов базы данных? Что для этого используется?   Параллелизм 119. Для чего использовать Task.ConfigureAwait? 120. Например, есть веб-сервер, который по HTTP-запросу делает выборку из базы данных. Всего на сервере 16 тредов (threads). Каждый HTTP-request выполняет запрос в базу и ожидает результатов, в этом случае тред блокируется. Можно ли оптимизировать эту работу средствами .NET? 121. Зачем нужен ThreadPool? Опишите механику работы: как поток выделяется и возвращается обратно в ThreadPool.   Вопросы для Senior   Общее 122. Какие ещё практики, кроме ООП, использовали (AOP, FP и т. д.)? 123. Назовите три самые сложные проблемы, которые вам приходилось решать. Как вы это сделали, как пришли к этому решению? 124. Что такое слабосвязанный код? Чем он лучше сильносвязанного кода? Как бы вы достигали более слабой связности кода? 125. Использование статических классов повышает или понижает связность кода? 126. Как можно измерить performance кода? Влияет ли факт замеров на производительность? 127. Для чего используются и как работают multi-stage билды в Docker? 128. Как понять, что какая-то часть кода утилизирует много памяти или долго выполняется? Что может быть ботлнеком в разных случаях? Какие есть способы уменьшения памяти и трафика памяти? 129. Как бы вы реализовали cross-cutting concern (например, логирование, валидация, транзакции)? 130. Расскажите о Rest Maturity Model. 131. Что такое CPU и IO-bound задачи? 132. Что такое маршалинг? 133. Как работает async / await (подробно)? Почему нельзя использовать async void методы?   Платформа .NET 134. Как работает lock? Можно ли использовать структуры внутри выражения lock? 135. Что такое Expression Tree? 136. Как работает сборщик мусора (подробно)? Почему в GC три поколения, а не, скажем, пять, десять или два? 137. Как бы вы организовали трассировки Web API сервисов? 138. Как в .NET Core можно настроить хранение секретов на компьютерах разработчиков и на рабочих средах? 139. Как бы вы организовали процесс CI/CD .NET Core сервисов для их деплоймента в облачную инфраструктуру? 140. Как включить CORS в AspNetCore?   Типы данных, коллекции и структуры данных 141. Как реализованы дженерики? 142. Как создать собственный immutable-тип? 143. Как работает IEnumerable <T> (подробно)? 144. Какой алгоритм использует коллекция STACK? 145. Какие структуры данных вы реализовывали сами для платформы .NET? Расскажите, чем они отличались от стандартных реализаций. 146. Чем отличается интерфейс от абстрактного класса? В каких случаях вы использовали бы и то, и другое? 147. Почему в структуре нет конструктора по умолчанию?   Базы данных 148. Как БД сохраняет данные? 149. Какие типы БД вы знаете? 150. Как и когда БД лучше использовать? 151. Что такое денормализации? 152. Когда и какие уровни изоляции транзакций можно использовать? 153. Как в популярных СУБД реализованы принципы ACID (SQL Server, PostgreSQL и т. д.)? 154. Приходилось ли вам оптимизировать запрос в БД? Если да, то как? 155. Опишите, какие вы знаете потенциальные проблемы, связанные с параллельными запросами к БД. 156. Какую базу данных вы бы использовали для реализации distributed lock механизма? Расскажите детали реализации.   Микросервисы 157. Какую проблему решают микросервисы? 158. Какие есть способы коммуникации микросервисов? 159. Расскажите варианты реализации распределенных транзакций в микросервисах. 160. Что такое circuit breaker? 161. Каким образом вы будете налаживать систему, состоящую из множества микросервисов, если нужно отследить полный путь обработки запроса? 162. Что такое брокеры сообщений? Что такое at-least-once, at-most-once семантика? Есть ли какие-то брокеры, которые гарантируют exactly-once семантику? 163. Как должен работать код клиента брокера в зависимости от выбранной семантики? 164. Какие инструменты для работы с очередями вам известны (как в .NET, так и отдельные продукты), какой инструмент/продукт вы бы выбрали и почему?   MS Azure 165. Какие виды сервисов бывают в Service Fabric? 166. Какие особенности и ограничения Azure Table Storage? 167. Как бороться с проблемой холодного старта в Azure Functions? 168. В чем отличие очередей и топиков в Azure Service Bus?   Практические задания   Junior only Опишите, как бы вы реализовали калькулятор. Если понадобится добавить поддержку для римской системы счисления, что будете делать? Напишите программу, чтобы проверить, является ли число простым или нет. Найдите наименьший элемент в массиве. Упорядочите структуры папок в файловой системе. Напишите программу, которая симулирует fizz-buzz. Расскажите, что делает этот код, и предложите, как его улучшить. а) public bool IsArrayEmpty(string[] array) {   if (array.Length > 0)     return false;   else     return true; }   б) protected string GetClass(object url) {   string result = string.Empty;   if (SiteMap.CurrentNode != null && SiteMap.CurrentNode.Url == url.ToString())     result = "class=\"active\"";   return result; }   Middle Напишите программу для тиражирования последовательности Фибоначчи для заданного числа. Спроектируйте базу данных врачей и пациентов в SQL. Создайте stored procedure или запрос в SQL, который вернет врачей, имеющих больше, чем N пациентов. Проверьте коллекцию на наличие дубликатов. Спроектируйте thread-safe класс Singleton в C#. Надо записать некую сущность в базу данных и отправить событие в брокер сообщений. Как это сделать с минимальным риском потери данных? Имеются три сервиса. Выполняется HTTP-запрос на первый. Первый должен записать данные во второй, а второй - в третий. Как гарантировать, что данные при такой сложной коммуникации не потеряются? Как предотвратить записи дубликатов данных? Будет ли работать этот код и почему? a) SomeClass myClass = null; myClass.SomeMethod();   б) var table = GetTable(); table.Draw(); … private SomeClass GetTable() {   using(var table = new SomeClass())   {     table.ID = "www";     table.Width = "95%";     table.Controls.Add(tr);     return table;   } } Расскажите, что делает этот код, и предложите, как его улучшить: а) Shape shape = GetNextShape(); if(shape is Circle) Console.WriteLine(((Circle)shape).Radius);   б) public int Quantity {   get   {     try     {       return int.Parse(TxtQuantity.Text);     }     catch (Exception)     {       return 0;     }   } }   Что не так с кодом?   try {   SomeMethod(); } catch(Exception e) {   Log(e.Message);   throw e; }   Senior Как бы вы спроектировали FTP-сервер? Web-сервер? Хостинг картинок с разделением прав доступа? Систему, состоящую из front- и back-офисов? Создайте клон любой популярной социальной сети (Instagram, Facebook и т.д.) Допустим, есть сущность сделки (Bid). И в сделке есть список партнеров, с которыми эта сделка заключается. Сами сделки хранятся в сервисе сделок (bidding service), а партнеры - в своем сервисе (partners service). И когда показывается список сделок, на начальном скрине нужно отразить количество партнеров. Как бы вы спроектировали хранение и изображение этого счетчика? Задача на знание LINQ: с исходной коллекции данных необходимо получить новую коллекцию по определенным требованиям (например, отсортированную, без дубликатов и т. д.). Напишите программу, которая проверяет, является ли поле судоку 9×9 правильно заполненным. Реализуйте свой Select, Where, SelectMany со всеми характеристиками LINQ (отложенное исполнение, одномоментная (eager) проверка входных данных). С помощью LINQ напишите метод, который вернет такие элементы коллекции, которые делятся на N без остатка, отсортированные от наибольшего значения к наименьшему. Сигнатура метода: List <int> Filter (IEnumerable <int> collection, int n) ;. Напишите функцию, которая вернет сумму всех четных элементов массива, который передается в функцию (JavaScript).   Выражаем благодарность за подготовку статьи Алексею Краевому, Максиму Шнуренку, Андрею Ткаченку, Владу Медведовскому, Сергею Селецкому, Андрею Губскому, Сергею Мащуренку, Александру Скриннику, Андрею Соболю, Богдану Нановскому, Святославу Аксёнчикову, Ивану Корнелюку, Михаилу Пивоварову, Алексею Дерке, Евгению Гуреву, Михаилу Меркулову, Юрию Воронину.

Общие знания, которые нужны каждому Python разработчику Что должен знать Python Developer, работающий в сфере Data Science Python BackEnd Developer Python Developer в сфере DevOps Automation QA Engineer (Python) Desktop, Mobile, Game Python Developer Итоги   Добрый день, дорогие читатели блога ITVDN! Предлагаем вашему вниманию новую публикацию в рубрике “Что должен знать разработчик...”, в которой мы пишем о самых популярных IT-профессиях. Ранее уже были опубликованы обзоры по FrontEnd и .NET. В этот раз в центре внимания язык Python. В каких сферах он успешно применяется, а в каких буквально незаменим? Какими знаниями нужно обладать, чтобы стать, к примеру, Python BackEnd разработчиком? Все это вы узнаете в нашей статье. Приятного чтения! В последние годы язык программирования Python стремительно набирает популярность. По данным Stack Overflow Developer Survey 2019, в котором приняли участие более 87 тысяч IT специалистов из разных стран, Python в 2019 году опередил даже таких постоянных и несомненных лидеров как Java, С# и С++. Сейчас он широко используется в Data Science (машинное обучение, анализ данных, визуализация), разработке встроенного программного обеспечения и в реализации серверной части веб-приложений. Также при помощи Python можно создавать игры, десктопные и мобильные приложения, писать тесты для ПО, а также упрощать администрирование ОС. Как видите, сферы применения довольно обширны. Мы постараемся затронуть самые популярные, в которых Python используется в качестве основного средства программирования. Начнем с технологий, которые должен знать любой Python-разработчик вне зависимости от специализации.   Python Многие сходятся во мнении, что язык программирования Python  - один из самых легких для изучения, его часто рекомендуют в качестве первого языка начинающим программистам. В то же время это высокоуровневый язык программирования общего назначения, с большим потенциалом повышения производительности программиста, скорости разработки и читаемости кода. Каждый Python-девелопер должен владеть таким набором знаний: Синтаксис языка Python: типы данных, строки и символы, операции с целыми и вещественными числами, отступы, условные и циклические конструкции, функции, списки, словари, классы, файловый ввод-вывод, логические операции и операции сравнения. Популярные библиотеки и фреймворки. Этот пункт зависит от выбранного IT-направления. К примеру, если вы планируете себя реализовать в веб-разработке, отличным выбором станет библиотека Requests, которая облегчит процессы составления HTTP-запросов, также будут полезны фреймворки Django и Flask. Если же вас увлекает машинное обучение, то Theano, TensorFlow, Keras и другие библиотеки помогут с построением и тренировкой нейронных сетей. IDE и редактором кода. Проекты лучше создавать в интегрированной среде разработки (IDE) или в редакторе кода. Это позволяет сделать написание кода максимально удобным: подсветка синтаксиса, автодополнение, инструменты сборки, возможность отладки код и прочее. Самыми популярными платформами являются PyCharm, WingWare IDE, Komodo.   Открытым остается и вопрос, какую версию Python стоит изучать: 2.x либо 3.х? Согласно информации из официального источника разработчиков python.org, в 2020 году прекращается поддержка Python 2.7. Соответственно, стоит сконцентрировать усилия на изучении именно версии 3.х. Разработчик должен иметь глубокие знания языка Python, понимать и уметь применять на практике принципы объектно-ориентированного программирования (ООП).    Английский язык Знание английского языка - естественное требование для каждого разработчика в IT, поскольку большинство новых сведений о технологиях, курсы, учебные и справочные материалы появляются в первую очередь на английском. Для работы в команде разработчиков обычно знаний языка на уровне чтения технической документации и комментирования кода вполне достаточно, однако если вы планируете самостоятельно вести переговоры и переписку с иностранным заказчиком, ваш уровень должен быть выше.    Git & GitHub Git - наиболее популярная система контроля версий, которая позволяет вести историю разработки проекта с возможностью доступа к каждой сохраненной версии. Помимо этого, стоит уметь работать с сервисом онлайн-хостинга проектов, использующих систему контроля версий. В данном случае это GitHub. В тандеме с Git он позволяет разработчикам сохранять свой код онлайн, а затем взаимодействовать с другими разработчиками в разных проектах. Данные системы позволяют команде программистов работать над одним проектом одновременно, сохраняя внесенные изменения, а также отслеживать выполнение задач каждым членом группы.   Алгоритмы и структуры данных Понимание алгоритмов и структур данных является очень важным для любого программиста. Исключением могут быть разве что FrontEnd разработчики. Данные используются во всех сферах нашей жизни: от банковских счетов и медицинских карт вплоть до списка оплаченных покупок в супермаркете. Знание структур данных поможет вам хранить информацию в упорядоченном виде, что упростит работу с ней. Также это повысит общую производительность ваших программ. Знание алгоритмов позволит вам создавать сложные конструкции для эффективного решения широкого спектра задач.   Методологии разработки Agile/Scrum Методологии разработки - это своеобразные путеводители по процессам эффективной разработки ПО. Их применение помогает организовать максимально продуктивную работу всех участников, которые напрямую или косвенно задействованы в разработке продукта в соответствии с выбранной стратегией.  Agile - семейство гибких методологий разработки программного обеспечения, которое позволяет выпускать продукт небольшими частями, постоянно его дополняя и совершенствуя. При таком подходе технические и бизнес-подразделения работают совместно, ПО постоянно обновляется, обеспечивается быстрое принятие решений и выявление неправильных подходов, приложение проще обслуживать, а качество кода готового продукта более высокое. Agile имеет собственный манифест, который подробно описывает основные принципы, на которых строится гибкая разработка. Scrum является одной из реализаций agile-подхода. Его используют многие команды, поэтому знание особенностей работы со scrum-моделью для разработчика серверного ПО является востребованным и весьма полезным. Итак, мы рассмотрели технологии, которыми должны владеть все Python разработчики, не зависимо от прикладной области, в которой они работают. Теперь давайте рассмотрим наиболее популярные специализации, в которых может себя реализовать Python разработчик, а это: Data Scientist BackEnd Developer DevOps Engineer Automation QA Engineer (Python) Проанализируем каждое направление, затронув основные технологии. Также расскажем, каким образом Python используется в Desktop, Mobile и Game разработке.   Что должен знать Python Developer, работающий в сфере Data Science   Легкий и лаконичный Python нашел себе широкое применение в такой важной сфере разработки, как Data Science. Почему именно Python? Он прост в изучении и способен в несколько строк кода создать искусственный интеллект, который будет способен к самообучению, либо посчитать матрицу внушительных размеров. Data Science подразумевает работу с большими объемами данных и включает в себя сбор, анализ, структурирование и дальнейшую визуализацию информации. Каждый специалист данной области занимается: сбором большого количества неупорядоченных данных и преобразованием их в удобный формат; решением бизнес-задач с использованием данных; программированием на Python, R и других языках; работой со статистикой; использованием Machine Learning, Deep Learning и текстовой аналитике; сотрудничеством с IT и бизнесом в равной мере; изучением современных тенденций, которые могут помочь в разработке, которая ведется на данный момент в компании.    Итак, какими технологиями необходимо владеть, чтобы стать Data Scientist?   Линейная алгебра и математический анализ Data Science - это как раз та область, в которой без знаний математики ну никак. Работа с колоссальным объемом данных предусматривает в обязательном порядке применение аппарата линейной алгебры. А это матрицы, векторы, линейные уравнения, различные алгоритмы классификации и кластеризации, которые широко используются (подробнее в следующих разделах). Также необходимо знать оптимизацию средствами матанализа.   Статистика Наука, которая применяет совокупность методов и приемов по сбору, обработке, представлению и анализу числовых данных, чтобы впоследствии на их основании сделать те или иные выводы. Статистика содержит такие важные разделы, как: выборка, распределение частот, среднее значение, взвешенное среднее значение, медиана, вероятность, распределения вероятностей, тестирование значимости, а также ряд других тем и понятий. В интернете есть множество хороших англоязычных курсов, которые помогут освоить разделы статистики, которые обязательны для специалиста Data Science.   Библиотеки и дополнительные инструменты Python Для всевозможных математических вычислений используется Python, а точнее - его библиотеки. К примеру, Matplotlib и Seaborn используются при необходимости визуализации данных, NumPy для работы с уже упомянутой линейной алгеброй. Для научных вычислений прибегают к использованию SciPy. Pandas позволяет выполнять быстрый анализ, очистку и подготовку данных из разных источников - Excel, SQL, веб-страницы, файлы CSV. Таким образом, библиотеки Python предоставляют отличный набор для анализа данных и визуализации. Среди дополнительных инструментов особого внимания заслуживает Jupyter Notebook, который позволяет создавать очень наглядные и информативные аналитические отчеты путем совместного хранения кода, иллюстраций, комментариев, формул и графиков.    Базы данных Поскольку работа Data Scientist-а плотно связана с обработкой большого количества информации, очевидно, что без баз данных тут не обойтись. Необходимо знать, как извлекать и обрабатывать данные, уметь писать и выполнять сложные запросы. Существуют реляционные базы данных (так называемые, SQL базы данных) которые используют структурированный язык запросов, и нереляционные (NoSQL), которые предлагают динамическую структуру для определения и обработки данных. К системам управления баз данных (СУБД) первого типа относят MySQL, PostgreSQL, Microsoft SQL Server, Oracle. Ко второму типу - MongoDB, Cassandra, BigTable, Redis, RavenDB и прочие. Несмотря на широкое распространение NoSQL, специалисты Data Science все же используют SQL технологии, поскольку зачастую работают именно с упорядоченным множеством данных (медицинские карты пациентов, транзакции клиентов и т. д.). Здесь наилучшим выбором станет PostgreSQL/MySQL/SQL Server.   Машинное обучение Это ответвление искусственного интеллекта, основная идея которого состоит в следующем: компьютер должен не просто использовать заранее написанный алгоритм, а самостоятельно обучаться решению поставленной задачи (например, задачи определения символов по отсканированному изображению текста, опознавания лиц и голосов, подборки видеороликов на YouTube с учетом просмотренных ранее). Минимальный набор базовых алгоритмов машинного обучения, который необходимо знать: линейная регрессия, логистическая регрессия, SVM (метод опорных векторов), random forest (“случайный лес”), дерево принятия решений, Gradient Boosting, РСА (метод главных компонент), k-means (кластеризация методом k-средних), k-NN (классификация методом k-ближайших соседей), ARIMA (интегрированная модель авторегрессии скользящего среднего). Говоря о библиотеках Python, которые применяются в машинном обучении, отметим scikit-learn (работа с классическими алгоритмами машинного обучения), TensorFlow и Keras (работа с глубоким обучением, которое направленное на работу с нейронными сетями). Если подытожить вышеизложенное, вам необходимо знать основные алгоритмы кластеризации, классификации, уметь работать с нейронными сетями, умело использовать указанные библиотеки в ходе решения задач, а также понимать и применять на практике принципы машинного обучения. Затем можно будет переходить к подробному изучению глубокого обучения, искусственного интеллекта и разрабатывать проекты для портфолио.   Что должен знать Python BackEnd Developer   Веб-сервера (Nginx, Apache) BackEnd разработчику необходимо знать общие принципы работы веб-серверов, а также понимать, как в целом работает интернет и каким образом ваш код взаимодействует с серверами, базами данных и вообще с “внешним миром”.  Веб-сервер - это программное обеспечение либо аппаратное средство, которое работает с целью приема HTTP-запросов, их обработки и последующей выдачи НТТР-ответов. На данный момент их существует множество, однако наибольшее распространение получили Nginx и Apache. Этим двум веб-серверам посвящено несметное количество статей, которые рассматривают их плюсы и минусы и благодаря которым вы сможете определиться, какой из них лучше всего подходит под решение ваших задач. Но также отметим, что сами по себе Nginx и Apache способны не только конкурировать, а и эффективно взаимодействовать между собой при правильной конфигурации, создавая мощную, гибкую и высокофункциональную систему с возможностью горизонтального масштабирования.   Базы данных (MySQL, MongoDB) Серверная сторона программного обеспечения предусматривает активное использование серверов (от англ. “to serve” - служить). Это компьютеры, которые выполняют какую-либо сервисную задачу по приему, обработке и предоставлению информации пользователям. Для BackEnd разработчика знание серверов и умение работать с ними является настолько же важным, насколько для FrontEnd разработчика - знание триады HTML, CSS и JavaScript.  Работаете со структурированными данными, а среди ваших приоритетов надежность, окупаемость и совместимость со всеми основными ОС? Выбирайте MySQL. Если же вы ориентируетесь на скорость, гибкость, масштабируемость, удобство в управлении СУБД, либо вы просто не можете определить схему для своей БД, вам стоит сфокусироваться на изучении систем управления нереляционными базами данных. Хорошим выбором станет MongoDB благодаря своей распространенности.      Фреймворки Flask/Django Два данных фреймворка являются самыми популярными в веб-разработке на языке Python. Какому стоит отдать предпочтение? Flask подойдет тем, кто заинтересован в тонкостях настройки проекта, и кто хочет иметь полноту власти над всеми его компонентами. Также данный фреймворк лучше подходит для создания REST API. Минимализм, максимальный контроль составляющих приложения, свобода в управлении каждым элементом - это визитные карточки Flask. С другой стороны, если вы ищете набор готовых инструментов, стоит обратить внимание на Django. Он ориентирован больше на стек готовых решений и конечный продукт, нежели на подробную настройку всех компонентов проекта. Если вас интересует разработка и развертывание приложения в кратчайшие сроки, простота в его создании, масштабируемость, поддерживаемость и наличие очень хорошо структурированной и детальной документации по используемому фреймворку, смело выбирайте Django.   Паттерн MVC (Model-View-Controller) Паттерн MVC достаточно востребован в наше время. Данный шаблон предусматривает разделение приложения на три компонента: Модель, Представление, Контроллер, благодаря чему реализуется концепция разделения и закрепления ответственности за каждым компонентом, что упрощает разработку веб-проектов.    Вспомогательные технологии (Celery, RabbitMQ) Среди известных технологий, которые облегчают жизнь BackEnd разработчику можно отметить Celery. Это инструмент для управления очередями задач, который применяется для фоновой обработки долго выполняющихся задач, снижая нагрузку на процессор. Упомянем также и RabbitMQ - менеджер сообщений, который предназначен для передачи данных (так называемых сообщений) между сервисами и упрощающий работу со сложными ресурсоемкими задачами при помощи очередей.   Что должен знать Python Developer для работы в сфере DevOps   Python особо популярен у DevOps специалистов. DevOps - это методология, которая совмещает в себе разработку (Development) и системное администрирование (Operations) с целью увеличения частоты выпуска релизов. Данные специалисты также должны обладать навыками использования облачных технологий и автоматизации инфраструктуры. DevOps инженеры отдают свое предпочтение Python за его простоту, мощность, надежность, многозадачность, поддержку большого количества специальных пакетов, которые повышают эффективность данного языка программирования и за другие преимущества. Python используют, в основном, вместе с командной оболочкой Bash для упрощения процессов развертывания ПО и автоматизации различных задач системного администрирования (написание скриптов). Что еще должен уметь DevOps инженер, помимо написания скриптов? Понимать устройство ОС Linux/Windows. Знать, как работают компьютерные сети (сетевая модель передачи данных TCP/IP и эталонная модель OSI), понимать инфраструктуру сетей. Знать основные сетевые протоколы (HTTP, HTTPS, SSH, IP, TCP и другие). Работать с популярной облачной инфраструктурой AWS. Применять контейнеризацию (Docker), кластеризацию (Kubernetes), принципы CI/CD (Jenkins), инструменты мониторинга (Zabbix, Nagios), управлять ПО на удаленных серверах (Ansible). Работать с веб-серверами (например, Nginx и Apache), уметь их настраивать. Данный стек технологий вполне достаточный для уверенного старта в качестве DevOps инженера.   Что должен знать Automation QA Engineer (Python)   Python также имеет большую популярность в тестировании. Он применяется для написания скриптов, которые автоматизируют процессы проведения тестов. Помимо классических навыков и знаний тестирования необходимо владеть языком Python, разбираться в принципах ООП и также владеть тестовыми фреймворками (в данном случае - PyTest, Robot Framework, unittest и другие).     Desktop, Mobile, Game Python Developer   Менее популярные сферы использования Python. Для разработки настольных приложений можно использовать библиотеку Tkinter и фреймворк PyQt, который позволяет работать с графическим инструментарием, подобным тому, что использует Visual Studio для создания Windows Forms приложений. Игры на Python также можно создавать - PyGame библиотека в помощь. Однако они будут далеко не уровня ААА. При этом Python успешно используется в таких тяжеловесах гейм-индустрии, как World Of Tanks, Battlefield 2 и EVE Online для запуска скриптовых сцен, реализации пользовательского интерфейса, обработки событий. Если говорить о мобильных приложениях, то там Python применяется разве что для реализации серверной стороны приложения. К примеру, клиент Instagram для iOS написан на языке Objective-C, а сервер — на Python.   Итоги Мы рассказали вам об IT-специальностях, в которых Python пользуется наибольшим спросом. Благодаря своей универсальности, кроссплатформенности, простому синтаксису, читабельности и значительному количеству разнообразных библиотек и фреймворков этот язык программирования значительно облегчает работу программистов и тестировщиков, позволяя существенно сократить время написания кода. Сейчас Python просто незаменим в Data Science из-за своего богатейшего инструментария сбора, анализа, обработки и дальнейшей визуализации данных. DevOps инженеры в несколько строк кода могут с легкостью автоматизировать рутинные и/или масштабные процессы. BackEnd разработчики используют все возможности, которые им предоставляют веб-фреймворки для создания эффективных веб-приложений.    На ITVDN есть подборка видео курсов по языку программирования Python, а также по нескольким самым популярным технологиям, которые должен знать специалист. Комплексная программа обучения состоит из 12 курсов общей продолжительностью более 82 часов. Для формирования практических навыков написания кода мы рекомендуем использовать интерактивные тренажеры по Python. Если вам понравилась эта статья, поделитесь информацией с теми, кому она может быть интересна. Пишите в комментариях, на какие еще вопросы, связанные с выбором специальности и планированием обучения вы хотите получить ответы. Мы постараемся ответить на них в наших новых обзорах.   Смотрите также: Знакомство с Python Как стать Python разработчиком?

Верстка сайтов и веб-программирование привлекают большое количество новичков в мир IT. Это связано с достаточно низким порогом вхождения. Количество желающих стать фронтендщиком с каждым годом увеличивается, вследствии чего растут и требования к кандидатам. Какие технологии необходимо изучить, чтобы стать FrontEnd разработчиком в 2021 году? Давайте разберемся.   HTML5 & CSS3 HTML5 и CSS3 — это фундаментальные технологии, без знания которых не обойтись ни одному веб-разработчику. С помощью языка гипертекстовой разметки HTML создается разметка (каркас) каждой интернет-страницы. Затем язык стилей CSS преображает сайт и придает ему привлекательный и эффектный внешний вид. Помимо этого, необходимо владеть: кроссбраузерной адаптивной версткой, чтобы уметь создавать сайты под мобильные устройства, планшеты и широкоформатные экраны и для различных браузеров; семантической версткой для повышения качества разметки и улучшения поисковой индексации сайта; валидной версткой, которая предполагает полное соответствие кода разработчика всем стандартам W3C — организации, которая создает и внедряет технологические стандарты для World Wide Web. Уделите особое внимание верстке под мобильные устройства, так как современный веб-потребитель очень много времени проводит в смартфоне. Существует даже специальный подход, при котором сначала верстается веб-сайт под мобильные устройства, а только потом под десктопы — называется Mobile First.  Это общие требования по верстке. Теперь же рассмотрим более детально требования конкретно по языку стилей. Здесь вы должны знать основные свойства CSS3: фоны, градиенты, тени, анимации, трансформации, переходы, а также технологии Flex и Grid, о которых мы еще поговорим. Хорошее владение HTML и CSS уже позволяет заниматься версткой сайтов и зарабатывать деньги. Именно с этих двух базовых технологий начинается путь к профессии FrontEnd разработчика. Качественно изучить HTML и CSS вы сможете при помощи следующих наших курсов: HTML5 & CSS3 Стартовый; HTML5 & CSS3 Базовый; HTML5 & CSS3 Углубленный.   Flex и Grid CSS Технологии верстки надежных адаптивных веб-страниц, которые позволяют легче создавать динамические сайты и удобнее структурировать их содержимое. Лучше всего Flex-верстку в действии показывает интерактивный сайт flexboxfroggy.com, а Grid-верстку - cssgridgarden.com. На нашем ресурсе также есть курсы, которые хорошо объясняют темы Flex и Grid верстки: “Верстка сайта на CSS Grid”, “Верстка сайта на FlexBox CSS”.   Bootstrap 4 Популярная HTML/CSS платформа для разработки адаптивных веб-приложений, которую применяют при создании сайтов и интерфейсов администраторских панелей. Основные преимущества Bootstrap: высокая скорость верстки; кроссбраузерность и кроссплатформенность; наличие хорошей документации, большого сообщества и огромного количества разнообразных обучающих материалов; низкий порог вхождения (необходимо знать лишь основы HTML, CSS, JavaScript и jQuery).   Также, будет полезно знать еще 2 CSS-фреймворка: Foundation и Materialize. Первый является комплексным и профессиональным инструментом, который следует принципу Mobile First. Имеет продвинутый интерфейс и позволяет создавать действительно уникальные, элегантные и легко настраиваемые веб-сайты. Под эгидой Foundation были созданы такие веб-сервисы, как: Facebook, Mozilla, Adobe, Amazon, eBay и многие другие. Materialize исповедует принципы Material Design от компании Google, которые преследуют идеи цифровой унификации для более легкого и комфортного восприятия интерфейса. На сайте material.io можно более детально ознакомиться с идеологией материального дизайна. Фреймворк Materialize незаменим при разработке несложного многостраничного веб-сайта или лендинга за счет богатых возможностей уже готовых и встроенных компонентов и стилей. Также, Materialize предоставляет разные компоненты и варианты поведения, обычно не встречающиеся в других фронтенд-фреймворках (поведение волн, scrollFire, scrollSpy, или специфичные для мобильных устройств выдвижные меню и всплывающие подсказки и т. д.). Foundation подходит разработчикам с опытом, в то время, как Materialize — отличный выбор для начинающих девелоперов, которые хотят как можно плотнее познакомиться с материальным дизайном.   CSS препроцессоры CSS препроцессор — это программа, которая имеет свой собственный синтаксис, но может сгенерировать из него CSS код. Самыми популярными считаются SASS, Stylus, LESS и PostCSS, однако, наибольшее комьюнити имеет именно SASS. Препроцессоры предназначены для: ускорения процесса написания кода; упрощения чтения кода и дальнейшей его поддержки; минимизации рутинной работы при написании кода. Для повышения эффективности написания CSS кода вполне достаточным будет изучение лишь одного препроцессора.   Git & GitHub Git — наиболее популярная система контроля версий, которая позволяет вести историю разработки проекта с возможностью доступа к каждой сохраненной версии. Помимо этого, стоит уметь работать с сервисом онлайн-хостинга проектов, использующих систему контроля версий. В данном случае это GitHub. В тандеме с Git он позволяет разработчикам сохранять свой код онлайн, а затем взаимодействовать с другими разработчиками в разных проектах. Данные системы позволяют команде программистов работать над одним проектом одновременно, сохраняя внесенные изменения, а также отслеживать выполнение задач каждым членом группы. Git & GitHub — очень важные инструменты для любого IT-разработчика, изучением которых следует заняться как можно раньше.  Мы рекомендуем изучать Git на ITVDN при помощи курса “Основы работы с Git”.   Знания о веб-технологиях и сети интернет Чтобы качественно выполнять свою работу, фронтенд разработчик должен разбираться в вебе и понимать принципы его функционирования. Таким образом, необходимо знать: как работает интернет; протоколы HTTP/HTTPS, веб-сокеты; как работают браузеры; что такое DNS и как он работает; что такое доменное имя; что такое хостинг. Также, будет неплохо, если вы попробуете настроить сайт на каком-нибудь бесплатном хостинге, привяжете домен к этому хостингу.   JavaScript   Язык программирования, который используется как при разработке клиентской стороны веб-приложения, так и серверной. При помощи JavaScript (сокращенно — JS) можно писать даже настольные и мобильные приложения, используя определенные программные платформы и библиотеки. Этот язык позволяет: динамически изменять разметку; осуществлять интерактивное взаимодействие с пользователем; анимировать изображения; совершать валидацию форм; управлять мультимедиа и т. д. Другими словами, JavaScript “оживляет” страницу и добавляет ей функциональности. Хорошее владение данным языком программирования является обязательным для каждого FrontEnd разработчика. Сергей Росоха, Software Architect с 11-летним опыта во FrontEnd/JS, отмечает важность изучения алгоритмов и структур данных на JavaScript: “JavaScript давно уже используется не только для разработки динамических интерфейсов пользователя, но и для написания достаточно сложной бизнес-логики. Поэтому знание алгоритмов и структур данных становится критичным для JS-разработчиков. ” (источник) JavaScript использует официальный стандарт ECMAScript (сокращенно - ES), который подразумевает определенное формальное описание синтаксиса, базовых объектов и алгоритмов. На данный момент существует множество различных версий ES. Работодатели чаще всего требуют знание ES6+. Однако, вначале необходимо изучить чистый JavaScript и лишь потом вникать в новые стандарты. Как ни крути, а классику надо знать. Благодаря хорошему владению JS можно быстро разобраться в любой версии ES и затем освоить любой фреймворк или библиотеку. ITVDN предоставляет возможность изучить JavaScript с нуля до продвинутого уровня при помощи курсов: JavaScript Стартовый; JavaScript Углубленный; JavaScript: Расширенные возможности.   Линтеры Инструменты, которые позволяют анализировать качество JavaScript-кода согласно определенному стандарту ES. Они встраиваются в среду разработки и указывают на наличие несоответствий стандарту в коде, если таковые имеются. Данный механизм полезен как для одиночной разработки (для самоконтроля), так и для командной, когда каждый разработчик должен следовать одним и тем же языковым конструкциям, дабы на выходе получить единый, целостный проект. Среди известных линтеров можно выделить ESLint и Prettier.   Тестирование Jest, Cypress и Enzyme — главные инструменты модульного тестирования, которое возлагается на плечи разработчика. Но что это такое? Unit тестирование (оно же — модульное тестирование) — процесс, который заключается в создании тестов для проверки работоспособности отдельных участков написанного программистом кода. Выполняется непосредственно автором кода. Какую пользу приносит Unit тестирование: существенное сокращение багов в коде; упрощение рефакторинга кода; обеспечение качественного отделения интерфейса от реализации; лучшее понимание написанного кода; возможность протестировать мельчайшие участки кода. Все три инструмента учить не надо — достаточно научиться управляться лишь с одним из них.   Паттерны проектирования JavaScript Это лучшие практики, которые описывают типичные способы решения распространенных задач, возникающих в ходе проектирования программного обеспечения. Знание шаблонов проектирования позволяет писать более чистый, понятный и читаемый код, а также избегать “изобретения велосипеда”. Более того, владение паттернами показывает вашу грамотность, как разработчика, и повышает вашу ценность в глазах работодателя, что поможет выделиться на фоне конкурентов. Чтобы вы могли хорошенько разобраться с темой шаблонов в JavaScript, рекомендуем курс “JavaScript Шаблоны”.   Алгоритмы и структуры данных Понимание алгоритмов и структур данных — обязательные знания для любого программиста. К структурам данных относятся: стеки, очереди, связанные списки, графы и т. д. Изучив их, вы сможете управлять сложностью своих программ, делая их более доступными для понимания, а также разрабатывать высокопроизводительные программы, которые будут эффективно работать с памятью. Знание алгоритмов позволит вам создавать сложные конструкции для эффективного решения широкого спектра задач. Когда говорят об алгоритмах, обычно имеют ввиду алгоритмы сортировки и поиска: сортировки прямым включением, прямым выбором, слиянием, пирамидальная, прямой поиск, бинарный, индексно-последовательный и другие.  Важно разбираться и в нотации Big O, которая описывает сложность каждого алгоритма. Данный механизм помогает определить, при каких условиях выгоднее использовать тот или иной алгоритм. Отметим, что как новичку, вам не надо нырять вглубь этих тем. Будет достаточно теоретического владения, а также умения написать несколько алгоритмов. В разработке сайтов это не сильно нужно, но практически ни одно собеседование не обходит стороной тему шаблонов, алгоритмов и структур данных.    Фреймворки JavaScript Это инструменты, с помощью которых создаются динамические веб/мобильные/десктопные приложения на языке JavaScript. Они ускоряют разработку веб-приложений и предусматривают четко структурированную организацию кода, повышая его качество и чистоту. Самыми популярными фреймворками для фронтенд-разработки можно назвать Vue.js, React и Angular. Каждый из них предназначен для решения своего спектра задач и имеет различную степень сложности: Vue.js - самый легкий (но и с наименьшим сообществом), React - средней сложности, Angular - высокой сложности. Стоит сконцентрироваться на глубоком изучении одного фреймворка, но в то же время очень рекомендуется знать особенности и сферу применения всех вышеперечисленных технологий. Какой фреймворк все же выбрать? Мнения на этот счет расходятся. Инструментарий выбирается индивидуально под проект и трудно предугадать, какие задачи вам нужно будет решать. На данный момент наибольшей популярностью пользуется React, поскольку он сбалансирован как с точки зрения сложности, так и с точки зрения богатства функционала. К тому же, наибольшее количество вакансий припадает именно на этот фреймворк, а значит, что он интересен не только разработчикам, но и бизнесу. Каждый из фреймворков доступен для изучения на платформе ITVDN. По направлению Angular: Angular 11.0 Базовый; Angular Углубленный. По направлению React: React Базовый; React Углубленный. По направлению Vue.js: Vue.js Стартовый; Vue.js Базовый.   Инструменты управления состоянием приложения (State Management) Большие веб-приложения постоянно растут в сложности, а потому хранить данные, которые могут использоваться в разных местах становится все сложнее. Для решения этой проблемы были придуманы отдельные библиотеки, идущие параллельно с фреймворками — они служат для управления глобальным хранилищем данных всего веб-приложения и называются менеджерами состояний. Их применение уже стало стандартом во FrontEnd разработке. Для девелоперов, которые используют Vue.js, это VueX, для React-разработчиков — Redux и MobX, для Angular-девов — RxJS, NgRx.   JavaScript Core (DOM, AJAX, JSON) DOM (Document Object Model) - объектное представление исходного HTML-документа. Ключевым является понятие DOM-дерева, которое описывает структуру страницы. С помощью объектной модели JavaScript получает полную власть над HTML-документом: возможность редактировать, удалять и добавлять элементы и атрибуты HTML, менять CSS код и т. д. AJAX (Asynchronous JavaScript And XML) - это синтез технологий JavaScript и XML, который фактически представляет собой комбинацию: встроенного в браузер XMLHttpRequest-объекта (чтоб запрашивать данные с веб-сервера); JavaScript и HTML DOM (чтобы отображать или использовать данные). AJAX позволяет веб-страницам совершать асинхронное обновление, обмениваясь данными с веб-сервером. Благодаря этой технологии страница не нуждается в перезагрузке - обновляется лишь конкретная ее часть (вспомните ленту новостей в социальных сетях). JSON (JavaScript Object Notation) - это общий формат обмена данными. Позволяет совершать обмен информацией между программными продуктами, написанными на разных языках. Таким образом, клиент, использующий JavaScript, может легко передавать данные на сервер, который реализован с помощью Ruby/Java/PHP. Все три технологии являют особую ценность для каждого веб-разработчика и раскрывают организацию работы интернет-приложения.     БЭМ “Блок, Элемент, Модификатор” — методология, предусматривающая компонентный подход к разработке веб-страниц, в основе которого лежит принцип разделения интерфейса на независимые блоки. Подход БЭМ позволяет повторно использовать существующий код в создании других страниц с сохранением всех его свойств (размеры, шрифт, цвет и т. д.).      Webpack Мощный сборщик модулей, который позволяет скомпилировать в один файл несколько разных модулей. Используется во время работы над объемными проектами. Успешно применяется как во фронтенд-разработке, так и при создании бэкенд-приложений.   Gulp / Grunt Системы сборки, которые автоматизируют рутинные задачи разработчиков: минификацию кода, оптимизацию изображений, тестирование, анализ качества кода и прочее. Подходят при разработке небольших проектов.   TypeScript Кроссплатформенный строго типизированный язык, который является расширением JavaScript. Строгая типизация позволяет уменьшить количество потенциальных ошибок в исходном коде, написанном на TypeScript. Также, этот язык реализует концепции, которые близки объектно-ориентированным языкам, таким как C#, Java и подобным. TypeScript повышает скорость и удобство написания сложных комплексных программ, вследствии чего их становится легче поддерживать, масштабировать и тестировать. В большинстве случаев его необходимо изучать лишь тем, кто ориентирован на работу с фреймворком Angular.    SVG Язык разметки масштабируемой векторной графики. Изображения на странице, сделанные с помощью SVG, корректно отображаются на экранах с различным разрешением, не теряя при этом своего качества, в отличии от традиционных растровых .jpeg, .png и других.   Английский язык Знание английского языка является одним из основных требований к фронтенд-разработчику, поскольку большое количество полезной информации находится именно на англоязычных сайтах. Уровень чтения технической документации будет достаточным для комфортного пользования иностранными ресурсами.     Итоги FrontEnd разработчик — достаточно универсальный боец в мире веб-разработки. Он должен уметь и верстать, и создавать логику работы клиентской части, и понимать работу серверной части веб-приложения. Для освоения такого обширного инструментария стоит запастись временем, терпением и упорством. Перечисленные в статье средства разработки сайтов также имеют аналоги, поскольку для решения разных задач подходят разные веб-инструменты. Однако мы выбрали самые популярные и эффективные из них.   Если у вас остались вопросы о последовательности и необходимости изучения тех или иных технологий, ответы вы можете найти в видео ”Как стать FrontEnd разработчиком?”, в котором подробно рассматриваются основные технологии создания клиентских веб-приложений. Для тех, кто хочет стать FrontEnd разработчиком, на ITVDN создана комплексная программа обучения, которая включает в себя 42 видео курса.   Желаем вам успехов в достижении ваших целей! Оставайтесь с ITVDN!

Введение  CSS3 произвел революцию в мире веб разработки, поскольку он принес много новых функциональных возможностей. Эта технология продолжает развиваться и внедрять новые возможности. В Новом, 2015 году будут добавляться новые свойства, про некоторые из них мы расскажем в этой статье. CSS - маски В Webkit браузерах CSS-маски функционируют уже давно. В ноябре 2014 года была опубликована новая спецификация CSS масок, теперь мы ждем, когда поддержку данного свойства получат все браузеры. Что такое маска? Проще говоря, маской можно назвать изображение с белой или черной фигурой и прозрачным фоном. Применяя маску на изображение или элемент, мы получим маскированное изображение. Пример:  Маски можно использовать сейчас, но, к сожалению, только в браузерах Webkit отображение будет корректным. Использование масок в Webkit На движке Webkit маски выполняются очень легко, просто используйте тег mask. .element {      -webkit-mask: url('mask.png'); } Давайте попробуем создать пример. Вот наше изображение маски:  Накладывать маску будем на эту фотографию: Теперь добавим немного кода:  class="element">     src="image.jpeg" alt="" /> type="text/css"> .element {    width: 500px;    overflow: hidden; } .element img {     -webkit-mask: url(mask-image.png); } В результате мы получим вот такое изображение:  Кроме того, можно использовать свойства. Например, Вы можете установить позицию: .element img {     -webkit-mask: url(mask-image.png) 30% 30% repeat-x border-box;         /* .. тоже самое что и.. */     -webkit-mask-image: url(mask-image.png);     -webkit-mask-position: 30% 30%;     -webkit-mask-repeat: repeat-x;     -webkit-mask-box-clip: border-box;         /* Так же можно указать и размер! */     -webkit-mask-size: 30% 30%; }   CSS-исключения CSS-исключения (CSS Exclusions) - очень мощная функция, позволяющая изменить отображение контента на странице. Используя только одно свойство, можно поменять весь стиль страницы, это очень похоже на редактирование страницы в редакторе WYSIWYG. Давайте посмотрим на самое интересное свойство - “wrap-flow”. Wrap-flow Wrap-flow позволяет определить, какое количество элементов влияет на другие, когда они поверх остальных. Зачастую блоки перекрываются. С помощью wrap-flow все элементы адаптируются под верхний элемент на странице.  Wrap-flow имеет несколько настроек: auto: обычное состояние, ни один из элементов не регулируется start: все, что после элемента - удаляется end: удаляется все, что до элемента  both: удаляется контент под объектом minimum: удаляется сторона с наибольшим количеством контента maximum: удаляется сторона с наименьшим количеством контента clear: c двух сторон от объекта всё содержимое удаляется Диаграмма для помощи: Композиции и модели смешивания (Composition and Blending) Режимы смешивания в CSS стали частью официальной спецификации W3C. Это значит, что Вы можете выполнять затемнения основы (color burn) через CSS. Данная спецификация новая, так что возможны изменения прежде, чем она попадет в другие браузеры. У нее такой принцип работы: есть 2 изображения, они накладываются одно на другое с помощью абсолютного позиционирования. Это будет выглядеть так: <div class="blend">    <img src="duck.gif" alt="Duck" class="duck" width="500" height="500" style="position: absolute; top: 0; left: 0" />    <img src="penguin.gif" alt="Penguin" class="penguin" width="500" height="500" style="position: absolute; top: 0; left: 0" /> div> Пример CSS кода:  .blend {      position: relative; } .blend .duck {         mix-blend-mode: overlay; } В целом вся конструкция выглядит так:  Если Вам интересно, то можете попробовать режимы наложения прямо сейчас. Для этого Вам необходимо скачать Adobe’s experimental webkit browser Источник: http://www.inserthtml.com/2013/01/future-css3/ 

Друзья, привет! Мы с хорошими новостями для тех, кто хочет углубить свои знания стека C#/.NET и создавать качественный код, с которым будет легко осуществлять работу и масштабирование – новый видео курс "Порождающие паттерны проектирования" уже на сайте в полном объеме. Курс на украинском языке! Паттерны проектирования – это стандартизированные и общепринятые способы решения распространенных проблем в коде. В классическом каталоге «Паттерны объектно-ориентированного проектирования» так называемая "банда четырех" выделяет порождающие, структурные и поведенческие паттерны. Абстрактная Фабрика (Abstract Factory), Фабричный Метод (Factory Method), Строитель (Builder), Прототип (Prototype), Одиночка (Singleton) – порождающие паттерны (Creational patterns), решающие проблемы, связанные с созданием объектов и экземпляров классов. Они обеспечивают гибкость кода и изолируют систему от способа создания, компоновки и передачи объектов. Данный курс познакомит вас с тем, как использование паттернов избавляет от определенных проблем. Вы узнаете, что применение соответствующих паттернов может значительно улучшить дизайн программного обеспечения, сделать его более гибким и поддерживаемым, а также снизить связанность между компонентами системы. Автор курса – Владислав Рыбников, Senior .NET Developer в Innovecs, более 6 лет опыта в разработке. Курс состоит из 8 уроков общей продолжительностью 3 часа 46 минут. Структура курса: Начало работы с паттернами. Порождающие паттерны и Паттерн Одиночка. Паттерн Прототип. Использование Singleton и Prototype. Паттерн Строитель. Паттерн Фабричный Метод. Паттерн Абстрактная Фабрика. Builder и Factory Method. Что вы узнаете на данном курсе: Как с помощью порождающих паттернов решаются проблемы создания объектов. Как паттерны обеспечивают гибкость и изолируют систему от способа создания, компоновки и передачи объектов. Как порождающие паттерны позволяют скрыть сложности создания объектов от кода клиента и как это помогает упростить код клиента и избежать прямых зависимостей от конкретных классов. Как паттерн Singleton и его версия Multiton гарантируют, что в системе будет только один экземпляр определенного класса или ограниченное количество экземпляров. Как это помогает, когда необходимо обеспечить глобальный доступ к ресурсам или управлять состоянием программы. Ознакомитесь с альтернативными методами решения проблемы контроля жизни объектов с помощью Dependency Injection и IoC контейнеров. Узнаете, как Фабричные методы и Абстрактные фабрики позволяют делегировать создание объектов подклассам или фабрикам, что позволяет выбирать нужный тип объекта в зависимости от контекста выполнения. Познакомитесь с тем, как порождающие паттерны позволяют создавать объекты таким образом, что изменения в ваших классах не влияют на клиентский код. Узнаете, как это снижает зависимость между клиентом и вашими классами и делает систему более гибкой и легкой для поддержки. Поймете, как именно паттерны Builder и Prototype обеспечивают контроль над жизненным циклом объектов и как это полезно при создании сложных или изменяющихся объектов. Предварительные требования Для комфортного прохождения курса необходимы базовые знания C#/.NET и понимание принципов ООП. Курс “Порождающие паттерны проектирования” будет полезен как тем, кто только начинает изучение паттернов проектирования, так и тем, кто уже имеет определенные знания, однако хотел бы их структурировать и повторить отдельные темы. Смотрите первый урок в свободном доступе. Курс уже доступен на нашем сайте в полном объеме – к каждому уроку есть практические задания и опорный конспект. Если у вас есть активная подписка, вы можете смотреть его прямо сейчас. Курс входит в комплексные программы подготовки по специальностям: C# / .NET разработчик; ASP.NET Core разработчик; ASP.NET MVC разработчик.               

Перелік оновлено 30 жовтня 2025 року Друзі, привіт! Якщо ви вже трохи знайомі з нашим ресурсом, то, мабуть, помітили, що від початку повномасштабної війни ми активно працюємо над створенням нових українськомовних відео курсів – якісних і доступних за ціною для кожного з вас. Наразі ви можете вивчати на ITVDN такі українськомовні курси: ✅ FrontEnd + Node.js HTML5 & CSS3 Стартовий CSS Flexbox. Верстання на Grid. Практичний курс з верстки лендінгу Bootstrap 5. Шаблонізатор Pug. JavaScript Стартовий. JavaScript Базовий JavaScript Поглиблений JavaScript Шаблони Асинхронне програмування у JavaScript. TypeScript. React Базовий. React Поглиблений. Vue.js Стартовий. Angular Базовий. Тестування Angular додатків Node.js Базовий. ✅ Java Основи IntelliJ IDEA Java Стартовий. Java Базовий Java Поглиблений. SOLID принципи в Java. MySQL Базовий. JDBC & Hibernate Unit-тестування в Java з JUnit Основи Java EE Spring. Spring MVC. Spring Data. Spring Security. Створення застосунків за допомогою Spring Data Асинхронне програмування на Java ✅ .NET C# Стартовий. SQL Базовий. C# Асинхронне програмування. Універсальні шаблони C#. Unit-тестування у C#. Породжуючі патерни проєктування. Структурні патерни проєктування мовою C#. Алгоритми та структури даних мовою C# Entity Framework Core Базовий ASP.NET Core Базовий ✅ Python Python Стартовий. Python Базовий. Python Базовий 2025 Flask. Породжуючі патерни проєктування на Python ✅ Інше Основи використання Git PostgreSQL. Основи адміністрування Windows Server. Docker. React Native. Unity Стартовий. Android Базовий. PL/SQL. Unit-тестування в PHP. Триває процес публікації нових курсів: HTML5 & CSS3 Базовий Transact-SQL JavaScript Патерни Проєктування Створення проєкту на Python і Django Entity Framework 6 Усі ці курси мають безкоштовний доступ на місяць за програмою Free For Ukraine і дозволяють отримати базові знання з найпопулярніших технологій на сучасному ринку ІТ: HTML & CSS, JavaScript, TypeScript, Java, C#, Docker, SQL, MySQL, PL/SQL, Git, Vue.js, React, Node.js, Spring, Flask тощо.  За програмою Free For Ukraine українці мають можливість отримати безкоштовний доступ до усіх курсів ITVDN на 30 днів. Однак ми розуміємо, що за місяць нереально вивчити весь стек технологій з тієї чи іншої ІТ-спеціальності, тому після безкоштовного доступу рекомендуємо обрати пакет підписки “Базовий”, який дає повний доступ до усіх відео курсів на 6 місяців. Цього часу зазвичай достатньо для того, щоб пройти повне навчання з нуля до рівня спеціаліста, якщо приділяти цьому щонайменше 10 годин на тиждень. Вартість пакету “Базовий” – 89.99 USD, тобто ви отримуєте доступ до величезної бази знань всього за 15 USD на місяць. Додаткові сервіси, які входять в пакет “Базовий”: Вихідний код навчальних проєктів Презентації, опорний конспект, д/з Перевірка 10 домашніх завдань Консультації з тренером – 60 хв. Доступ до інтерактивних практикумів Онлайн тестування (16 тестів) та сертифікати за пройденими курсами Доступ до нових курсів за спеціальністю, які виходитимуть під час дії підписки Детальніше про “Базовий”

Здравствуйте! Друзья, хотим вас порадовать новым видео курсом - “Верстка сайта на CSS Grid”, который будет полезен каждому верстальщику, а также заинтересует многих FrontEnd разработчиков. CSS Grid — это удобный механизм для настройки расположения элементов на странице, использующий принцип сети или таблицы со строками и столбцами. Проще говоря, это техника верстки, которая позволяет удобно располагать элементы на сайте, при этом предоставляя возможность легкой реализации адаптивности под различные разрешения экранов. Данный курс направлен на изучение использования CSS Grid в процессе создания верстки веб-страниц. Вы познакомитесь с этой технологией, начиная с основ ее использования и базовых правил, и заканчивая рассмотрением более сложных структур. На этом курсе вы шаг за шагом узнаете о всех возможностях правил CSS Grid. Автор курса — Сластен Максим — FrontEnd Developer, опыт разработки более 6 лет. В записанных видео уроках Максим делится эффективными и удобными техниками верстки при помощи Grid, которые с большим успехом используются в сайтостроении. Структура курса: Вступление Знакомство с базовыми свойствами Grid Работа с Grid контейнером Создание Grid template и позиционирование контента Работа с дочерними элементами grid-row и columns Ordering элементов Возможности свойства auto FlexBox и Grid Адаптивность Grid и медиа-запросы Создание проекта Чему вы научитесь на данном курсе: Использовать CSS Grid при выполнении верстки ваших веб-страниц Использовать Figma для построения шаблонов для дальнейшей работы Создавать свои стили Понимать особенности и уметь применять Grid columns (столбцы) и Grid rows (строки) Понимать и применять на практике возможности объединения ячеек и именования линий Применять функцию repeat Применять grid-template-areas и разбивать грид на grid-areas Выравнивать ячейки грида с помощью правил justify-items и align-items Выравнивать контент в ячейках Использовать значения max-content и min-content Упорядочивать элементы и управлять отображением элементов в блоке Ограничивать области перемещения блоков с абсолютным позиционированием Использовать свойства flex и grid. Уметь преобразовывать флекс блоки в грид Понимать автосвойства грид, и уметь контролировать построение грида Уметь совмещать медиа запросы и правила грид блоков Использовать медиа запросы для гибкой трансформации grid layout`a Создавать готовый сверстанный проект и деплоить его на GitHub Предварительные требования Курс подойдет тем, кто уже имеет базовые знания HTML и CSS, хочет познакомиться с CSS Grid и изучить основы работы этой технологии для уверенного использования ее на практике. Смотрите первый урок курса в свободном доступе. Также, можем вам предложить ознакомиться с бесплатным вебинаром “Адаптивная верстка с FlexBox и Grid” для лучшего понимания популярных техник гибкой верстки — FlexBox и Grid, а также выявления преимуществ каждой из них. Видео курс “Верстка сайта на CSS Grid” позволяет совершенствовать навыки верстки веб-страниц, обучая востребованному и широко используемому подходу Grid. Если вы желаете не останавливаться на этом и хотите дальше развивать свои навыки верстальщика, вам также пригодятся ссылки на другие курсы по данному направлению: Bootstrap 4 HTML5 & CSS3 Базовый HTML5 & CSS3 Углубленный Практический курс по верстке лендинга