Результати пошуку за запитом: Курс - Практикум по frontend разработке*
З чого розпочати вивчення JavaScript?
Автор: Дмитро Охріменко
JavaScript – прототипно-ориентированный язык программирования, который используется для написания сценариев, выполняемых специальным программным обеспечением. JavaScript часто используется при написании сценариев для веб приложений, но в последнее время язык начал активно применяться и в других областях разработки – в серверных приложениях (node.js), на мобильных платформах (PhoneGap) и даже для разработки приложений для Windows (Windows Store with JS). Как вы видите, язык достаточно активно используется и входит в 10 популярных языков программирования, поэтому многие начинающие разработчики и уже опытные изучают этот язык программирования. В сети можно найти самоучители, книги с примерами кода и видео уроки по JavaScript в достаточном количестве. Но проблема в том, что уроков для начинающих и других учебных материалов очень много, и у большинства возникает проблема - «что и в какой последовательности учить?». Задача данной статьи помочь вам найти правильный путь в изучении JavaScript.
Каждый для себя выбирает наиболее удобную и эффективную форму обучения – это могут быть книги по JavaScript и самоучители для самостоятельного обучения, очные курсы программирования, где тренер может ответить на вопросы, или видео уроки по JavaScript и примеры JavaScript кода. Какой бы из подходов вы ни выбрали – главное, последовательно и планомерно следовать программе обучения и максимально много практиковаться, так как без практики запомнить и научится применять большое количество разнообразных языковых конструкций достаточно тяжело.
Если вы выберите самостоятельное изучение, обязательно приобретите следующие книги по JavaScript. Настольная книга любого JavaScript разработчика – Дэвид Флэнаган «JavaScript Подробное руководство». Вторая книга, которая позволит вам правильно организовывать свой код - Стоян Стефанов «JavaScript Шаблоны», но она пригодится вам позже, когда вы разберете примеры JavaScript кода из предыдущей книги.
В изучении JavaScript можно выделить несколько этапов:
Изучение языковых конструкций: переменные, циклы, условные конструкции, функции.
Освоение объектов и массивов.
Изучив основы работы с языковыми конструкциями и основными типами данных, можно перейти к освоению главной задачи JavaScript – манипулированию DOM дерева. Вы должны научится работать с элементами, которые находятся на странице, динамически создавать новые узлы и изменять существующие.
Изучение шаблонов проектирования и кодирования, которые позволят разрабатывать понятный и сопровождаемый код.
Изучение дополнительных библиотек и фреймворков, например, jQuery.
Изучая материалы книги Дэвида Флэнагана, вы сможете пройти первые 3 этапа, а книга Стояна Стефанова поможет научиться правильно организовывать JavaScript код. В дополнение к книгам вам могут помочь видео уроки по JavaScript для начинающих и JavaScript для профессионалов.
Початок кар'єри в ІТ
Автор: Олександр Марченко
Введение
Пожалуй, все давно знают, что эра технологий уже наступила, и произошло это уже давно. На сегодняшний день невозможно создать производство чего-либо без использования информационных технологий.
Насколько целесообразным является выбор именно Информационных технологий в качестве своей профессиональной сферы, решать каждому из Вас. Но Вам будет очень трудно найти что-то более динамичное и захватывающее. Также стоит помнить, что и уровень зарплат по-прежнему сохраняет статус наиболее привлекательных, практически во всех современных экономиках развитых государств.
Что нужно знать о построении своей карьеры? Все решают Ваши знания и отношения с другими людьми. Причем, влияние этих двух аспектов абсолютно равноправное.
Если Вы отдадите должное внимание построению нужных связей и знакомств, будете постоянно пополнять свой круг общения новыми приятными и полезными знакомствами, и, главное, не забудете поддерживать старые отношения, то всегда будете оставаться в более выгодных условиях.
И наоборот, тот, кто будет разбрасываться знакомствами, ставить свои приоритеты выше других, вести себя неподобающе в современном обществе, в итоге приобретет дурную славу, которая очень быстро распространиться по локальному ИТ-сообществу и за его пределами.
Первым шагом в построении карьеры, скорее всего будет трудоустройство на первую работу. И тут придется ответить на самый страшный вопрос: «Где взять 2 года опыта?»
Порой этот вопрос звучит следующим образом: «Где я обзаведусь опытом работы в реальных проектах, если я только учусь/только что выпустился/работаю в другой сфере/не имел опыта с этой платформой?». И это абсолютно правильный вопрос, поскольку работодатель хочет нанять надежного профессионала, а не дилетанта.
Попробуем найти ответы на этот вопрос, и вот несколько вариантов:
Принимайте участие в хакатонах и OpenSource проектах
Данного рода активности позволят Вам обзавестись своими личными проектами. Их Вы сможете развивать, при этом, без сомнений, улучшите свои профессиональные навыки и обзаведетесь полезными знакомствами. Ведь они могут сыграть ключевую роль в Вашем будущем.
Анализируйте чужой код
Доступ к которому все также легко получить на OpenSource проектах. Вы не сможете стать профессионалом и создавать свои решения до тех пор, пока не сможете полностью понимать чужие. Это все равно как учиться писать, не имея навыков чтения.
Участвуйте в стажировках
Большинство крупных компаний с огромным удовольствием берут на стажировки студентов, которые проявляют потенциал. Вам никто не даст участвовать в крупных и критически важных проектах, но зато Вы сможете проявить себя в реальных условиях, да еще и сделать это под чутким руководством более опытных коллег. Дополнительным бонусом стажировок является пусть и незначительная, но возможность получения приглашения на работу. Для этого нужно постараться, но никто и не говорил, что будет легко.
Кроме всего прочего не забывайте о постоянной работе над собой. Если Вы хотите оставаться востребованным на рынке труда специалистом, Вам необходимо оставаться в курсе последних событий ИТ-мира и непрерывно совершенствоваться. Для Вас не должно быть открытием то, что работа - это рутина, а вот обучение зачастую приносит больше удовольствия. Так превратите свою работу в непрерывное развитие, и Вы не пожалеете!
Що таке нативні та кросплатформні програми? Плюси і мінуси.
Автор: Армен Маїлян
Что такое нативные приложения?
Что из себя представляют кроссплатформенные приложения?
Какие инструменты для разработки кроссплатформенных приложений применяют чаще всего?
Преимущества и недостатки нативного подхода
Преимущества и недостатки кроссплатформенных приложений
Вывод
Мировая статистика использования смартфонов показывает абсолютное преобладание всего двух мобильных операционных систем. Так, по данным портала statista.com, во втором квартале 2018 OS Android была установлена на 88% всех используемых смартфонов, а iOs – на 11.9%. Данные портала netmarketshare.com, в свою очередь, показывают на апрель 2019 для OS Android – 69.63%, а для iOs - 28.50%.
По состоянию на март 2019 в Google Play Store находилось более 2 600 000 приложений. В Apple App Store, по данным на июль 2018 – 2 450 220 приложений. В течение последних лет количество доступных приложений растет на сотни тысяч в год. По прогнозам statista – к 2020 году объем рынка мобильных приложений приблизится к 190 млрд $. При таком, постоянно растущем количестве конкурентов, перед разработчиками мобильных приложений встает вопрос - какой подход использовать в разработке, чтобы новые, конкурентоспособные приложения:
разрабатывались быстро;
получались качественными и надежными;
легко обновлялись и поддерживались;
легко задействовали все необходимые возможности платформы.
Фактически, рынок заставляет разработчика делать выбор между разработкой кроссплатформенных приложений и разработкой нативных приложений. Рассмотрим детальнее, что представляет из себя каждый из указанных подходов.
Что такое нативные приложения?
Нативные приложения (от англ. native - родной) разрабатываются под конкретную аппаратно-программную платформу и пишутся на языках, созданных для данной платформы. И iOs, и Android имеют свои SDK (от англ. software development kit — набор средств разработки) и свой стек технологий, завязанные на определенный язык программирования. Например, родными языками для Android являются Java и Kotlin, для iOS, соответственно - Swift и Objective-C.
Нативные приложения создаются специально для запуска на целевой платформе - с поддержкой всех нативных технологий и аппаратных возможностей конкретной платформы.
Что из себя представляют кроссплатформенные приложения?
Как следует из названия, кроссплатформенность подразумевает создание приложений, которые могут работать в различных операционных системах. После написания кода приложения его можно развернуть на разных устройствах и платформах, не беспокоясь о проблемах несовместимости. Это универсальный подход, который широко используется для экономии времени и денег на разработку. Часто для этого используются специализированные кроссплатформенные фреймворки.
Примером такой разработки является применение фреймворка Xamarin для создания приложений, работающих не только на Windows. Благодаря использованию Mono (опенсорс реализации платформы .Net), проекты, написанные на C#, успешно запускаются на Unix-like системах – iOs, Android, Linux.
Какие инструменты для разработки кроссплатформенных приложений применяют чаще всего?
Ссылаясь на статистику appfigures.com можно выделить такие инструменты:
Как мы видим наиболее часто применяемым инструментом разработки кроссплатформенных мобильных приложений на конец 2017 года был Cordova – 39.89%. Вторым по частоте применения инструментом является Unity – 30.93%. Третьим – Adobe Flash с 10.39%. Следом идут Cocos2D – 9.37%, Xamarin – 4.5%, Appcelerator – 3.79%, Corona – 2.68%, React Native – 1.85%.
Итак, стоит ли вам инвестировать в разработку отдельных нативных приложений на несколько платформ сразу, или убивать двух зайцев одним выстрелом, разрабатывая кроссплатформенные приложения? Или может стоит вообще сосредоточиться только на одной платформе и не обращать внимание на другую, пока не достигнут успех среди приложений первой?
По данным портала appfigures.com на начало 2018 года количество приложений, присутствующих на обеих популярных платформах, было вполне ощутимым:
450 тысяч приложений на обеих платформах. Это более 28% приложений в Apple App store и 14% в Google Play Store. Это выглядит достаточно весомой частью, чтобы задуматься об присутствии на обеих платформах и попытке экономии используя кроссплатформенную разработку.
По данным того же портала, многие уже существующие приложения расширяют свой рынок, выходя, со временем, на другой платформе. При че чаще приложения выходят дополнительно на Android, выпускаясь изначально под iOs.
Можно также наблюдать тенденцию к снижению процента кроссплатформенных приложений за 2016 – 2017 годы.
Так стоит ли потратить деньги на разработку двух нативных приложений, идеально соответствующих каждой платформе, или есть смысл сэкономить ресурсы и получить одно – кроссплатформенное?
Давайте рассмотрим плюсы и минусы каждого из указанных подходов.
Преимущества и недостатки нативного подхода
Плюсы нативных приложений
Высокая производительность
Поскольку технологии, используемые при разработке платформозависимых приложений, напрямую связаны с этой платформой, собственный нативный код имеет прямой доступ ко всем функциям операционной системы.
Это, более простое взаимодействие приложения с собственными функциями мобильных устройств, повышает общую производительность приложения, особенно при представлении графического или мультимедийного контента.
Следовательно, создание нагруженных приложений с использованием нативного кода может снизить время отклика, вероятность сбоев и зависаний.
Максимальное использование возможностей платформы
Нативные приложения задумываются и разрабатываются, чтобы решать конкретные задачи на конкретной платформе. Это приводит к лучшему соответствию возможностей приложений аппаратным возможностям устройств, включая Bluetooth, NFC, камеру, GPS и т. д.
Эта соответствие необходимо, когда приложение должно использовать такие данные, как физическое и географическое местоположение и др.
Лучший пользовательский интерфейс
Поскольку нативные приложения напрямую интегрируются с мобильной операционной системой, воспринимая и используя все доступные возможности «железа», пользователи могут перемещаться по привычному интерфейсу без особых хлопот, что приводит к положительному пользовательскому опыту (UX) и стабильному повторному использованию. К примеру сейчас, при большом количестве разнообразных вариантов разрешений экранов смартфонов очень важно иметь приложение, оптимизированное под такой экран, чтобы пользователю было удобно этим приложением пользоваться.
Лучшее позиционирование в магазинах приложений
Качество пользовательского опыта является важным рейтинговым показателем в магазинах приложений. Если приложение имеет высокую оценку пользовательского опыта, оно будет более высоко оценено магазином приложений, что ведет к большему числу рекомендаций для разной аудитории и увеличению доходов от приложения, соответственно.
Есть предположение, что в магазинах приложений сами механизмы ранжирования будут лучше представлять приложения именно нативные для платформы, из-за их заведомо более высокой производительности и простоты использования.
Минусы разработки нативных приложений
Дороговизна и затраты времени на разработку
Без сомнения, создание отдельных приложений сразу под каждую из нескольких операционных систем может значительно продлить процесс разработки. Один и тот же программный код не может быть развернут на разных платформах, и программистам потребуется больше времени для преобразования и перезаписи кода, что увеличивает затраты и время разработки.
Если компания хочет для каждой из платформ создавать отдельные приложения, она может оказаться вынуждена нанять дополнительных программистов-специалистов. Например, один разработчик будет сосредоточен на разработке приложений для iOS, а другой - на разработке приложений для Android, что еще больше увеличивает расходы.
Несовместимость с другой мобильной операционной системой
Вам придется заранее согласиться с несовместимостью вашего приложения с другими ОС. Когда разрабатывается приложение под конкретную ОС, его разработчики используют язык, специфичный только для этой операционной системы: например, Objective-C или Swift - для iOS, для различных мобильных устройств на базе Android - Kotlin и Java. В этом контексте нативное приложение, которое изначально написано для iOs, не будет совместимо с устройствами на базе Android и наоборот.
Упущенные возможности
Разработка приложений, ориентированных только на одну платформу, может привести к упущенным возможностям. Особенно если другие платформы заранее не принимаются во внимание. Заведомое сокращение целевого рынка может привести к потере дохода.
Плюсы и минусы кроссплатформенных приложений
Как следует из названия, кроссплатформенность влечет за собой создание приложений, которые могут работать в различных операционных системах. После написания кода приложения его можно развернуть на разных устройствах и платформах, не беспокоясь о проблемах несовместимости. Это универсальный подход, который широко используется для экономии времени и денег.
Вот некоторые преимущества и недостатки использования кроссплатформенного подхода в разработке мобильных приложений.
Плюсы кроссплатформенных приложений
Один код доступен для повторного использования на других платформах
Основным преимуществом кроссплатформенной разработки мобильных приложений является тот факт, что один и тот же код может использоваться на разных мобильных платформах. В отличие от разработки нативного приложения, для кроссплатформенного приложения не требуется использование отдельного технического стека для каждой операционной системы.
Повторное использование кода позволяет легко развертывать приложение на другой платформе, так как возможности приложения, реализованные на одной платформе, будут работать и на других платформах.
Разработка кроссплатформенных приложений экономически эффективна
Одна команда может реализовать нужную идею сразу на всех платформах, используя единый технологический стек. Это приводит к меньшим затратам ресурсов.
Простое и быстрое развертывание
Разработчикам кроссплатформенных приложений не нужно изучать несколько технологических стеков различных платформ перед созданием своих приложений, им нужно хорошо освоить один стек разработки и особенности его применения.
Поскольку нет необходимости создавать разные кодовые базы, начальное развертывание на целевых платформах происходит намного быстрее.
Кроме того, будущие изменения в приложении могут выполняться одновременно, без внесения индивидуальных изменений на каждой платформе.
Кроссплатформенные приложения покрывают более широкую аудиторию
Кроссплатформенные приложения предлагают разработчикам больше возможностей для охвата более широкой аудитории, поскольку такие приложения достигают пользователей всех типов и мобильных устройств, независимо от их операционной системы. Это значительно рентабельнее для бизнеса, чем присутствие только на одной платформе.
Кроссплатформенные приложения допускают одинаковый интерфейс и UX
Тогда как производительность важна для любого мобильного приложения, его внешний вид (UI) и ощущения (UX) так же важны. Использование единой общей команды разработчиков и единого кода позволяет компаниям использовать одинаковый внешний вид приложения на всех платформах. То есть один и тот же пользовательский интерфейс и UX будет одинаково выглядеть на всех платформах.
Недостатки кроссплатформенной разработки приложений
Кроссплатформенные приложения не являются такими гибкими, как нативные приложения
Хотя задачи приложения будут реализовываться на всех платформах, скорее всего вы не сможете адаптировать готовое приложение для использования максимальных возможностей каждой из платформ.Работа с унифицированным стеком технологий не обеспечит такой же гибкости настройки и оптимизации, как применение стека технологий, индивидуального для каждой ОС.
Кроссплатформенные приложения не работают так же хорошо, как нативные приложения
Использование одного универсального стека технологий приносит в жертву гибкость. Однако потеря гибкости в разработке будет означать потерю возможности улучшить производительность. Поскольку кроссплатформенные приложения отказываются от некоторой гибкости, эти приложения не будут работать так же хорошо, как нативные приложения.
Возможное несоответствие UI в различных платформах
Внешний вид интерфейса приложения и правильная настройка UI для соответствия функционала в обеих системах может доставить проблем. К примеру, у каждой системы имеются свои требования к дизайну элементов UI. В определенных случаях эти требования могут оказаться взаимоисключающими.
Отправка кроссплатформенных приложений в соответствующие Магазины приложений может иметь сложности.
Механизм добавления вашего приложения, являющегося кроссплатформенным, в Apple App Store и в Google Play Store будет отличаться. Требования этих магазинов приложений к представленным у них продуктам различны. Прохождение всех проверок и выполнение всех правил для соответствия обоим магазинам будут вызывать определенные сложности.
Вывод
Подведем краткие итоги. Попробуем сузить наш достаточно сложный выбор между нативной разработкой и кроссплатформенной.
Обратите внимание на стратегию продвижения приложения и на его предполагаемый функционал. Если вам сразу нужен будет охват большей аудитории и у приложения функционал не является сложным - проще и дешевле воспользоваться кроссплатформенным подходом. Если вашему приложению необходимо использовать специфические особенности платформы, при этом нет необходимости в одновременном присутствии сразу и в Apple App Store, и в Google Play Store – разрабатывайте под выбранную платформу нативное приложение. И если ваши успехи покажут вам, что можно захватывать новый рынок – у вас уже будут средства на разработку под вторую платформу. Другие промежуточные варианты будут компромиссами и могут склонять чашу весов как к нативным, так и к мультиплатформенным решениям.
Используйте выбранный вами подход для построения качественных и полезных приложений. С нашей стороны можем порекомендовать ряд видеокурсов.
Для создания кроссплатформенных игр очень удобным инструментом является Unity и на ITVDN вы найдете серию видео курсов по разработке игр на Unity.
Если вы хотите попробовать себя в разработке кроссплатформенных приложений с использованием такого инструмента, как Xamarin, вам могут оказаться полезными такие уроки на портале ITVDN.com, как Xamarin. Легкий старт и Разработка пользовательского графического интерфейса (GUI) на C# под Android (Xamarin).
Если вы планируете в дальнейшем разработку нативных приложений под Android, мы рекомендуем начать с таких курсов - Java Starter и Java Essential.
Также смотрите на ITVDN видео курсы по специальности Android Developer и iOS Developer.
Правила застосування основних тегів HTML5
Автор: Антон Гончаров
Введение
Все мы уже знаем (ну или что-то слышали об) основных правила применения элементов разметки HTML5. Появилось много "плюшек" и “вкусностей” в новой спецификации HTML. Вместе с тем, появились новые элементы разметки. Но не все помнят/знают, как их использовать правильно.
Коротко остановлюсь на главных нововведениях HTML5:
Новые элементы: header, footer, section, article, video, audio, progress, nav, meter, time, aside, canvas;
Новые значения для атрибута type тега ;
Новые атрибуты HTML5 для элементов, такие как: dragable, contenteditable, hidden, contextmenu, data-*, dropzone, role, spellcheck[8] и т.д.;
Атрибуты class, dir, id, lang, style, tabindex, title, существовавшие в HTML4, теперь можно применять ко всем елементам HTML разметки;
Устаревшие элементы HTML страницы, которые частично поддерживаются и не рекомендуются к ипользованию: acronym, applet, basefont, big, center, dir, font, frame, frameset, isindex, noframes, strike, tt, u.
Итак, более детально рассмотрим, как же правильно использовать основные новые теги.
Элемент
Элемент <main>содержит главную информацию вашего сайта. Такие повторяющиеся элементы как логотип, окно поиска, меню навигации не рекомендуется вкладывать в <main>. Также не стоит помещать сам элемент <main> внутрь элементов <article>, <aside>, <header>, <footer> или <nav>.
Элемент
В элемент <article> следует помещать тот контент, который может быть удален без ущерба для всего сайта. К примеру, краткое описание новостей, рекламный баннер, статья, комментарии. Можно вкладывать <article> в <article>, что будет связывать вложенные элементы <article> с родительским.
Элемент
Элемент <header>, как понятно из названия, используется для оглавления отдельного контента или всей страницы. Должен содержать заглавие, дату статьи и т.д.
Элемент
Элемент <footer> служит для предоставления информации об авторе статьи/страницы, ссылки на авторские права и т.д. Обычно является прямым потоком тега <body> (помещается сразу за элемент <body>).
Элемент
Этот элемент содержит информацию об окружающем контенте, дополнительную информацию пользователю. Может содержать такой элемент, как <nav>, сноски, ссылки и т.д.
Элемент
Предназначен для предоставления контактной информации о статье или всей странице. Стоит отметить, что этот элемент часто помещают в
, для размещения ссылок для связи с авторами страницы.
Элемент
Элемент <nsfw> (англ. - Not Safe For Work – небезопасно для отработки) используется для размещения на странице контента сомнительного характера. Часто этот тег используют для размещения порнографии. Чтобы браузер не отображал такой контент, используют CSS код
nsfw {display: none ;}
Элемент
Элемент предназначен для размещения видео контента на странице. Для корректного отображения контента стоит прописать дополнительно атрибуты width, height, src, controls. Ваш код будет выглядеть примерно так:
<video width="840" height="480" src="../video/myVideo.mp4" controls> video>
Если же Вы хотите разместить у себя на странице видео, которое расположено на сайте youtube.com.
Вам стоит зайти на страницу c видео, правой кнопкой мыши нажать на видео, и из выпадающего меню выбрать “Получить код для встраивания”.
Копировать код из “попап” окошка.
В разметке вашего сайта, в нужном вам месте, кликнуть правой кнопкой мыши и выбрать “Вставить”.
У вас получится примерно такой код:
<iframe width="854" height="510" src="https://www.youtube.com/embed/_giinWWrNlQ" frameborder="0" allowfullscreen>iframe>
В свою очередь, элемент > создает область, которая позволяет загружать любой документ в себя.
Элемент
Элемент <audio> позволяет добавить на страницу аудио дорожки.
Также в HTML5:
Реализована возможность добавления на станицу геолокационных карт, а также определения местоположения пользователя в данный момент.
Теперь мы можем рисовать с помощью технологии canvas. А также использовать 3D графику.
Стало возможным просто перетягивать документы и прикреплять к письму.
И еще много новых "плюшек", которые вы можете узнать и научиться их использовать, пройдя наши курсы в учебном центре CyberBionic Systematics.
Всем удачи и хорошего кода)
Прості події
Автор: Костянтин Чорний
Введение
При разработке компьютерных систем и программ, в том числе таких, в которых функционирует множество оригинальных сущностей и их дублей – экземпляров, возникает проблема отслеживания связей взаимодействия между этими объектами. И чем больше появляется этих объектов , тем сложнее вписать их в структуру приложения. Да, можно сказать что здесь явные проблемы с архитектурой и так не должно быть, но все равно мы наталкиваемся на проблему создания крупной многообъектной системы с гибкими динамическими связями и адаптивным поведением. Лучшее решение – событийно-ориентированное программирование!
Итак, событие – это внезапное происшествие, появление которого нельзя предугадать, а можно только к нему готовиться. В подобном русле работает и человеческих мозг. Он ожидает появления события и, когда оно происходит, как-то на него реагирует.
Давайте рассмотрим небольшой мысленный эксперимент. Представьте дорогу, пешеходный переход и светофор, который регулирует переход в данном месте. Светофор – это объект, который порождает событие. Он по воле своего внутреннего устройства будет включать или отключать зеленый свет, который будет разрешать пешеходам переход через улицу.
В это время на тротуаре начинают собираться люди. Каждый человек – это объект, содержащий специфическое поведение, которое называется обработчиком события. В данном случае этот обработчик будет отвечать за пересечение улицы и будет вызываться во время возникновения события. У каждого человека обработчик разный, ведь все люди переходят через улицу по-разному. Один будет идти быстро, другой медленно, третий - смотреть на машины, которые стоят на перекрестке, а четвертый - следить за таймером, который будет отсчитывать секунды. Но каждый из них не предполагает, когда конкретно произойдет это событие, потому все они ждут на тротуаре.
Когда человек подходит к переходу, он подписывает свой обработчик события перехода дороги на конкретное событие этого светофора. Если человек передумает переходить или, например, отойдет поговорить по телефону, то он не будет выполнять свой обработчик, если событие возникнет.
И, наконец, когда светофор включается на зеленый, все люди начинают переходить дорогу. Возникло событие – выполнился обработчик.
Что-же нам позволяет сделать событийную модель? Она разрешает динамически изменять связи между объектами и не только расторгать или устанавливать их, но и менять характер самого действия.
Давайте рассмотрим пример создания события на языке C#.
namespace TrafficLight
{
// Светофор
public class Light
{
// Событие появления зеленого света
public event EventHandler Green;
// Метод который вызывает событие
public void SwichToGreen()
{
Green.Invoke(this, new EventArgs());
}
}
// Человек
public class Human
{
public string Name { get; private set; }
public Human(string name)
{
Name = name;
}
// Метод обработчик события перехода через дорогу
public void CrossingTheRoad(object sender, EventArgs e)
{
Console.WriteLine(this.Name + " crossing!");
}
}
class Program
{
static void Main(string[] args)
{
// Создание светофора
Light light = new Light();
// Создание людей
Human human1 = new Human("Alex");
Human human2 = new Human("Bob");
Human human3 = new Human("Alice");
// Подписка на событие
light.Green += human1.CrossingTheRoad;
light.Green += human2.CrossingTheRoad;
light.Green += human3.CrossingTheRoad;
// Вызов события
light.SwichToGreen();
Console.ReadKey();
}
}
}
Таким образом, язык C# позволяет быстро и легко создавать приложения, которые используют событийную модель. Более подробно узнать о событиях Вы можете в двенадцатом уроке курса C# Базовый.
Для практики можете создать небольшую игру с игровыми объектами, взаимодействующими посредством событий.
Розробка під Android - поради початківцям
Автор: Армен Маїлян
Овладейте языком
Хорошие навыки работы со средой разработки и другими правильными инструментами разработки
Знание компонентов приложения
Понимание фрагментации, Android-приложений, потоков, загрузчиков и задач
Правильный выбор необходимых инструментов разработки и последние советы
Вывод
Разработка приложений под различные мобильные платформы (Android, iOs) – это то, на что ориентируются многие опытные и начинающие разработчики программного обеспечения. Ведь именно приложения делают телефоны «умными» смартфонами. Благодаря своим преимуществам приложения кардинально изменили возможности и функции вчерашних «звонилок». Выбирая разработку под Android как целевую платформу, у нас есть выбор между Java и Kotlin - основными языками программирования для этой платформы. Сейчас мы не будем вдаваться в детали их различий, и отвечать на вопрос «на чем писать приложения для Android?». Мы уже затрагивали этот вопрос недавно в соответствующей статье «Kotlin vs Java: что лучше для Android-разработки?». Сегодня мы остановимся на Java. Попробуем сформулировать основные советы в разработке приложений под андроид для начинающих.
Овладейте языком
На сегодняшний день Java и XML являются двумя основными языками, используемыми при разработке приложений под Android. Поэтому знание и владение этими языками программирования и разметки является необходимым условием для разработки приложения под Android. Задав себе вопрос «с чего начать программирование под андроид?», вы получите достаточно простой ответ – изучите основной язык разработки и основы ООП.
Знания основ языка программирования Java должны включать в себя:
• Понимание и применение пакетов (Packages) в Java;
• Общее понимание ООП, понятия объектов и классов;
• Понимание механизмов наследования, понимание и умение работать с интерфейсами;
• Работа со строками и числовыми значениями, работа с дженериками;
• Понимание функционирования коллекций и работы с ними;
• Параллелизм.
Правильное понимание Java и XML поможет вам создать/разработать более надежное и элегантное приложение для Android.
Хорошие навыки работы со средой разработки и другими правильными инструментами разработки
Очень важно, чтобы, прежде чем приступить к полноценной разработке своего приложения, вы были хорошо знакомы с инструментами автоматизации сборки, а также с таким инструментом, как IDE - интегрированной средой разработки. В основном рекомендуется использовать Android App Studio IDE или Eclipse в качестве среды разработки. Применение их поможет вам изучить основы разработки и поможет вам улучшить качество вашего кода. Также советуем вам изучить такие механизмы как Apache Maven, Apache Ant и Gradle, поскольку они предоставляют собой мощный набор инструментов, помогающих управлять вашими сборками.
В процессе разработки важно, чтобы вы умели использовать инструменты и концепции контроля версий. Изучите git, а затем создайте репозиторий git-source (создав учетную запись в Bitbucket или GitHub). Чтобы получить представление об основных понятиях и условиях работы платформы, вы можете воспользоваться Git Pocket Guide.
Знание компонентов приложения
Компоненты приложения — при разработке андроид-приложений выступают в роли основных строительных блоков. В свою очередь каждый из таких блоков представляет из себя отдельную точку, с помощью которой в ваше приложение может войти система. Хотя каждый из компонентов существует как отдельная сущность и играет свою отдельную роль, есть ряд компонентов, которые зависят друг от друга. При этом не все из них окажутся фактическими точками входа.
Среди компонентов приложения выделяют пять разных типов, каждый из которых выполняет определенную роль и имеет свой собственный жизненный цикл, согласно которому он будет создаваться и уничтожаться. Они включают:
Операции (Activity): это компонент андроид, представляющий один экран с пользовательским интерфейсом (к примеру, приложение для работы с электронной почтой может иметь одну Activity, отображающую список входящих писем, другую Activity - составляющую e-mail, и третью - читающую эти письма). Операции работают вместе, чтобы сформировать единый пользовательский опыт в андроид-приложении. Несмотря на это, каждая из Activity является независимой.
Службы: компонент приложения в андроид, работающий в фоновом режиме и обеспечивающий выполнение длительных Activity и удаленных процессов. Этот компонент пользовательский интерфейс не предоставляет (например, пока пользователь обращается к интерфейсу другого приложения, он может проигрывать музыку в фоне).
Поставщики содержимого или Content providers: компонент андроид-приложения, управляющий общим перечнем данных приложения. Используя этот компонент данные, хранимые в базе данных SQLite, в Интернете или файловой системе, могут быть запрошены или изменены (если допускает поставщик содержимого). Этот компонент также применим как для записи, так и чтения тех данных, что являются частными, а не общими для вашего приложения.
Широковещательные приёмники или Broadcast receivers: компонент андроид-приложения, отвечающий на широковещательные сообщения, общие для системы. Большая часть таких сообщений происходят от системы. Broadcast receivers могут создавать в строке состояния уведомления, которые предупреждают пользователя, когда происходит широковещательное событие, хотя и не имеют пользовательского интерфейса. Как правило такой приёмник выполняет только минимальный объем работы, выступая для других андроид-компонентов в роли шлюза.
Активация компонентов: асинхронное сообщение, также имеющее название - намерение (Intent). Активирует 3 из 4 компонентов (то есть сервисы, Broadcast receivers и Activity). Intents также связывают отдельные компоненты друг с другом во время выполнения, вне зависимости от того, принадлежит ли вашему приложению данный компонент или нет.
Понимание фрагментации, Android-приложений, потоков, загрузчиков и задач
Android — это фрагментированный рынок с множеством видов устройств и различных версий операционной системы. Обратите внимание, что, чем больше ваше устройство поддерживает различных устройств и/или версий, тем больше оно требует обслуживания и тестирования и, соответственно, больше будет сопутствующих расходов. Вам также потребуются соответствующие шрифты, ресурсы и макеты, которые помогут обеспечить наилучшее взаимодействие с различными характеристиками экрана. Вы придется держать во внимании всё множество поддерживаемых Android датчиков и средств пользовательского интерфейса.
Распределение версий Android по данным statista.com
Иногда, для выполнения фоновых задач, вам приходится использовать службы, которые должны выполняться непрерывно. Но, в ряде случаев, применение их может оказаться невозможным. Если вы хотите создать отличный и удобный пользовательский интерфейс, всегда следите за тем, чтобы поток никогда не блокировался. Поэтому длинные операции (вычисления, ввод-вывод, сеть и т. д.) должны выполняться асинхронно в фоновом режиме (в основном в другом потоке выполнения). Вот почему важно изучить средства параллелизма языка Java.
Правильный выбор необходимых инструментов разработки и последние советы
Что нужно для создания приложения на андроид? Чтобы начать программировать под Android, вам подойдут весьма простые инструменты — это персональный компьютер с Mac или OS Windows, Linux. Сами же инструменты разработки ( IDE Eclipse, плагин ADT и Android SDK) – распространяются бесплатно.
Android имеет некоторые уникальные параметры, которые вам следует учитывать при написании приложений под Android. Среди них:
Производительность и скорость отклика: вы всегда должны реагировать на ввод пользователя в течение пяти секунд, в противном случае приложение выдаст ошибку ANR (ANR: application not responding - приложение не отвечает). Единственный доступный вариант - принудительно закрыть приложение.
Пользователи заметят лаги более 100 мс: как уже упоминалось выше, поток пользовательского интерфейса никогда не должен блокироваться, потому что он только один.
Ограниченные ресурсы: Wake-Lock (механизм, который заставляет устройство выполнять определенные действия, несмотря на рекомендацию менеджера батареи перевести устройство в спящий режим), следует использовать с осторожностью. Не обращайтесь лишний раз к элементам оборудования (например, GPS или акселерометру), потому что такие действия быстро разряжает аккумулятор.
Вывод
Мы с вами рассмотрели ряд простых советов для тех, кто начинает программировать под андроид. Надеемся, что данные рекомендации помогут вам создавать новые высококачественные приложения.
Если вы только раздумываете над направлением, в котором вам следует развиваться – рекомендуем посмотреть видео «Как стать Android разработчиком». В этом видео вы также сможете получить подходящие для вас ответы на вопрос «как начать программировать под Android?». Если вы уже определились с направлением развития и желаете получать знания в сфере разработки под Android - рекомендуем вам ознакомиться с нашим курсом подготовки Android Developer. Если вы уже имеете определенные навыки в разработке и ищете дополнительных знаний по отдельным технологиям - вам наверняка будет полезен курс «Автоматизация сборки проектов с помощью Apache Maven».
В свой очередь портал ITVDN.com желает вам успехов в обучении, интересных проектов и высокой зарплаты.
По материалам статьи от Эшна Верна.
Створюємо Telegram-бота на Python. Частина 2
Автор: Армен Маїлян
Чат боты — это новый инструмент взаимодействия разработчика с пользователем. Их все чаще внедряют для совершенно различных целей. Новостные ленты, обработка налоговых деклараций, сохранение файлов – боты становятся удобным интерфейсом взаимодействия c различными сервисами.
В прошлой статье мы рассмотрели, как написать простейшего чат-бота на Python и запустить его на своем компьютере. Сегодня мы рассмотрим, как того, написанного нами бота, разместить на внешнем сервере в сети Интернет.
В качестве места размещения мы будем использовать бесплатный сервис Heroku.
Установка и настройка Git
Для дальнейшей работы нам понадобится установить Git, зарегистрироваться на GitHub и создать репозиторий с именем нашего приложения. В нашем случае это MyFirstTestBot.
Скачать версии Git, соответствующие вашей операционной системе, можно по следующим ссылкам для macOS и для Windows. На Linux Git можно установить, выполнив такую команду:
sudo apt-get install git-all
Далее, желательно использовать виртуальную среду. Если она не установлена, при установке Python вы можете ее установить, выполнив команду:
pip install virtualenv
Создадим новую папку для нашего приложения и связи его с GitHub. В нашем случае это папка PythonApplication1 в корне диска C.
Выполним клонирование репозитория. Для этого находясь в нашей папке в консоли выполним команду, введя ссылку на ваш репозиторий:
git clone https://github.com/your_github_account/your_repository_name
После выполнения этой команды в нашей папке с именем PythonApplication1 мы получили еще одну папку – MyFirstTestBot.
В консоли перейдем в корень диска C и выполним команду:
virtualenv PythonApplication1
Если команда не выполняется, и вы на экране консоли видите «"virtualenv" не является внутренней или внешней командой…» - вам следует настроить системную переменную PATH и добавить в нее адреса расположения вашей папки с Python и подпапки со скриптами (в моем случае C:\Users\B\AppData\Local\Programs\Python\Python37-32\Scripts).
Будем в дальнейшем пользоваться консолью Git, которую мы установили ранее:
После выполнения этого скрипта в нашей папке будет такое содержимое:
Поместим скрипт в папку, полученную в результате выполнения команды git clone (папка MyFirstTestBot). Имя файла с нашим скриптом - mftb.py
Теперь запустим наше виртуальное окружение. Перейдем в консоли в папку C:\PythonApplication1 и выполним команду:
source C:\PythonApplication1\Scripts\activate
Если все сработало нормально – в консоли приглашение командной строки будет начинаться с имени нашей папки (PythonApplication1):
Перейдём в нашу папку репозитория и выполним команду:
pip install requests
Создадим список зависимостей для Heroku, введя команду:
pip freeze > requirements.txt
Обратите внимание – в файле requirements.txt указываются требования к серверу Huroku. Там должно быть приблизительно такое содержимое:
Если вы не продолжаете проект из предыдущей статьи, а создали новый – не забудьте указать все зависимости.
В папке MyFirstTestBot создадим файл с именем Procfile без расширения. В теле этого файла пропишем:
web: python mftb.py
В папке MyFirstTestBot создадим также файл с именем __init__.py без содержимого.
Содержимое нашей папки MyFirstTestBot теперь такое:
Отправим в GitHub репозиторий наш набор изменений. Для этого выполним следующую серию команд, с указанием ссылки на ваш репозиторий:
git init
git add .
git commit -m “first commit – ваше сообщение комментарий к коммиту”
git push -u https://github.com/your_github_account/your_repository_name
Код нашего бота теперь загружен на GitHub и нам остается загрузить его на Heroku, где будет хоститься наш бот.
Рекомендуется ознакомиться с основами работы с Heroku по ссылке. По той же ссылке следует скачать установщик интерфейса командной строки (CLI) от Heroku и запустить его.
После установки CLI зарегистрируемся на Heroku через веб браузер.
Далее подключимся к Heroku через консоль используя команду:
heroku login
Нас попросят подключиться через браузер к сайту Heroku и залогиниться там. Нужно будет ввести ваши данные.
Выполним команду для создания приложения в Heroku:
heroku create
Дальнейшие наши команды отправят наш проект на сервер Heroku и укажут необходимую настройку:
git push heroku master
heroku ps:scale web=1
Последняя команда запустит наше приложение на сервере:
heroku open
Теперь наше предложение установлено и запущено на сервере. Мы можем проверить это, пообщавшись с нашим ботом в Telegram:
Как мы видим – все работает. Если по каким-то причинам бот не запустился, нужно ввести в консоли команду:
heroku logs –tail
И смотреть на коды ошибок на сайте.
Резюме.
В прошлой статье мы с вами посмотрели, как можно создать простого Telegram бота. Теперь мы опубликовали его на удаленном сервере. Наш чатбот работает, и мы можем к нему обращаться, используя привычный мессенджер. Конечно, этот вариант бота далек от идеала, но для учебных целей, как первый проект бота, он подойдет.
Попробуйте создать своего бота с другим набором предопределенных ответов. В дальнейшем вы сможете создавать более продвинутых чатботов, работающих с нейросетями и другими элементам искусственного интеллекта.
Чаще всего востребованные библиотеки для работы ботов сейчас пишут на Python. Именно поэтому мы рассмотрели этот простой пример. Для дальнейшего развития вас как квалифицированного Python разработчика мы рекомендуем ознакомиться с курсом подготовки Python-разработчика на портале ITVDN.
Як правильно скласти ТЗ англійською
Автор: Віктор Осадчий
Составляем ТЗ на английском
О важности правильно составленного и правильно понятого технического задания в работе любой IT-команды говорить не стоит. Вопрос в том, как правильно написать его на английском. А если вы работаете в международной команде, это потребуется обязательно. Без паники! EnglishDom расскажет, как написать ТЗ на английском и не наделать ошибок. Итак, обо всех важных моментах - по порядку.
SRS structure. Структура ТЗ
В техзадании обязательно присутствуют следующие разделы:
introduction - вступление,
overall description - общее описание,
specific requirements - специфические требования, а также возможны и appendices - приложения.
Поговорим о каждом разделе отдельно.
В introduction, помимо purpose - цели, может быть включен еще и scope - объем работ, definitions - термины, специфичные и принятые для этого ТЗ, и раздел overview, который дает общее представление о наполнении и структуре будущего проекта - identify the product, describe the content and the structure.
Overall description - это раздел, который включает многое:
product perspective - функционал будущего продукта, который описывает все внешние интерфейсы - describes all external interfaces,
functions - главные функции продукта (summary of major functions),
constraints, or anything that limits our options - возможные ограничения,
use cases - сценарии использования.
specific requirements - все, что можно назвать требованиями, идет в этот раздел. Собственно, это и есть его основной частью - body of the document.
Итак, структура ТЗ в общем виде должна выглядеть так:
Introduction: purpose / scope / definitions
Overall description: product perspective / functions / constraints / use cases
Specific requirements: all the possible requirements = body of the document
Useful phrases: identify / limit options, content, structure, product, external interfaces
Overview is a section that identifies the product and describes the content and the structure. - Общее представление - это раздел, который определяет проект и описывает наполнение и структуру.
Anything that limits our options is described in the constraints. - Все, что как-либо лимитирует варианты действий, указано в разделе “ограничения”.
All the possible requirements usually identify the body of the document. - Все возможные требования определяют главную часть документа.
Характеристики ТЗ
Есть несколько ключевых характеристик ТЗ.
Первое - оно должно быть correct - правильным, то есть up to the required standards for the quality, database integrity and so on - соответствовать требуемым стандартам по качеству, целостности базы данных и т.д.
Второе - unambiguous and complete - недвусмысленным и полным, чтобы четко описать проект и его функционал - describe what is the future project created for.
Третье - consistent and detailed - последовательным и детальным, подробно описывающее, каким будет взаимодействие с людьми, оборудованием и другими внешними интерфейсами - how it interacts with people, hardware and other external interfaces.
Четвертое - modifiable and traceable - поддающееся изменениям и их отслеживанию, то есть the one you can edit and control.
Ряд фраз, которые вам пригодятся:
imposed on an implementation - обязательный к внедрению,
main considerations - ключевые факторы,
operation environment - рабочая среда.
Итак, ТЗ должно быть:
Correct: up to the required standards for the quality / database integrity
Unambiguous and complete: describe what is the future project created for
Consistent and detailed: how it interacts with people, hardware and other external interfaces
Modifiable and traceable: the one you can edit and control
Полезные фразы: imposed on an implementation / main considerations / operation environment.
SRS typical mistakes. Как не испортить ТЗ
Столько деталей и нюансов, подпунктов, что сложно не ошибиться. Мы расскажем, чего стоит избегать.
Первое: ambiguity - неясность. don’t give too much or too little information that may not be verified - не стоит давать чересчур много или мало информации, которую, к тому же, еще и проверить нельзя.
Второе: requirements on users - требования к пользователям. Запомните, you can only assume what user will do - нельзя заставить пользователя, можно только предположить, что он будет делать.
Третье: unnecessary or invented terms - термины, которые не нужны или выдуманы. Avoid any extra terms if you can say it simple - избегайте лишней терминологии, если все можно сказать проще.
Бесполезные и ненужные в ТЗ вещи: forward reference - ссылка наперед, contradiction - противоречие, noise - лишняя информация, silence - недостаточное описание.
В общем, придерживайтесь структуры, избегайте лишней информации, используйте ключевые фразы - и ваше ТЗ будет идеальным!
Если же вы сомневаетесь в своем знании английского - в EnglishDom есть специальный курс “Английский для IT”, где вы сможете подтянуть все важные для it-шника темы. Научитесь писать резюме и CV, проходимть собеседования, обсуждать проекты и проводить переговоры, переписываться в чате, писать ТЗ и деловые письма, понимать носителей языка и читать зарубежные блоги.
Застосування мультикласів у CSS
Автор: Олександр Марченко
Введение в мультиклассы.
В данной статье мы познакомимся с так называемыми сложными селекторами, особенностями их применения. Для более простого восприятия материала рекомендуем просмотреть пятый видео урок из курса HTML & CSS.
Для начала вспомним, что таблицы стилей собираются из наборов правил, которые содержат один или несколько селекторов и конечно же содержат блок определений. Блок определений ограничен фигурными скобками и содержит в себе перечень свойств и выбранных для них значений.
Селектором может быть любой элемент или HTML-тег, для которого возможно задание неких правил форматирования. Принцип определения селекторов довольно простой и имеет следующий синтаксис: Name {Style_rules}.
Здесь Name – это имя любого элемента на вашей странице, а Style_rules – описание правил стиля, которые вы собираетесь применить к элементу.
Отдельно обратим ваше внимание на универсальный селектор, который используют, когда требуется установить стиль абсолютно для всех элементов, присутствующих в веб-документе. Он имеет следующий синтаксис:
<head>
<title>CSS title>
<style>
/*Используем универсальный селектор, который обозначается "*" */
* {
color:forestgreen;
}
style>
head>
<body>
Text1
<p>Text2p>
<div>Text3div>
<br />
<span>Text4span>
body>
В случае, когда необходимо одновременно задать один стиль для двух и более элементов, их перечисляют через запятую:
<head>
<title>CSStitle>
<style>
/*Используем перечисление селекторов p, div */
p, div {
color:forestgreen;
}
style>
head>
<body>
Text1
<p>Text2p>
<div>Text3div>
<br />
<span>Text4span>
body>
В случае, когда необходимо задать уникальное имя для элемента и по нему изменить его стили или обратиться через JavaScript, целесообразно использовать идентификатор, изредка называемый «ID селектором».
Поскольку при создании html-документа невозможно отказаться от определенной иерархии вложенности, важно задуматься о том, чтобы стили для вложенных элементов применялись корректно. Целесообразно воспользоваться конструкцией из вложенных селекторов. В самом простом случае получим следующую конструкцию: name1 name2 {Style_rules}, где name1 – родительский элемент, name2 – дочерний (вложенный) тег. При этом подразумевается следующая разметка <name1><name2>...name2>name1>.
<head>
<title>CSStitle>
<style>
div p {
background-color: darkgrey;
color: red;
font-size: 20px;
}
style>
head>
<body>
<p>Параграф 1 p>
<div>
<p>Параграф 2 p>
div>
body>
Стоит помнить, что стили, предопределенные для тега div, также возымели бы свое действие на содержимое тега p, также допускается произвольный уровень вложенности тегов.
Данная конструкция имеет следующий синтаксис: #Name { Style rules }. Стоит помнить, что имена идентификаторов должны быть уникальными, дабы не вызывать коллизий при обращениях, начинаться с латинских символов, в них разрешено включать символы дефиса и нижнего подчеркивания «-», «_». Когда необходимо применить стили из идентификатора определенному тегу, используется атрибут id, которому передается значение – имя идентификатора без решетки.
<head>
<title>CSStitle>
<style>
#id1 {
background-color: #ffd800;
color: #ff0000;
font-size: 40px;
}
style>
head>
<body>
<p id="id1">Параграф 2 p>
body>
Порой при определении идентификатора используется конструкция name#id_name {Style rules}, где name может обозначать любой тег. Подобная конструкция ограничивает возможность применения стилей, определенных в идентификаторе только к тегам, одноименным указанному в определении.
Что касается применения классов, они актуальны тогда, когда необходимо задать правила форматирования для определенного селектора или же для нескольких элементов. Существуют следующие варианты использования классов:
.class_name {Style rules}
Класс, определенный таким образом, можно связать с любым тегом, достаточно воспользоваться атрибутом class и передать в его значении имя нашего класса.
Name.class_name {Style rules}
Таким образом накладываются ограничения на применение правил из класса лишь в одноименных тегах Name.
<head>
<title>CSStitle>
<style>
.myFirstClass {
background-color: darkcyan;
color: darkgreen;
font-size: 40px;
}
div.mySecondClass {
background-color: darkcyan;
color: darkgreen;
font-size: 20px;
}
style>
head>
<body>
<p class="myFirstClass">Параграф 1 p>
<p class="mySecondClass">Параграф 1p>
<div class="mySecondClass">Параграф 1 div>
body>
Работая с классами, стоит помнить о том, что любому элементу можно добавить сразу несколько классов, просто перечисляя их в атрибуте class без каких-либо знаков пунктуации, через пробел. При этом к текущему элементу будут применятся стили, описанные в каждом из классов в блоке правил.
<head>
<title>CSStitle>
<style>
.myFirstClass {
background-color: darkcyan;
}
.mySecondClass {
color: darkgreen;
font-size: 20px;
}
style>
head>
<body>
<p class="myFirstClass mySecondClass">Параграф 1 p>
body>
Прибегая к мультиклассам, стоит помнить об особенности их работы с повторяющимися правилами, т.е. одноименными свойствами, которые описаны в разных классах и имеют различные значения.
Укажем несколько одинаковых свойств с разными значениями и посмотрим, какие из них будут применены к элементу:
<style>
.myFirstClass {
background-color: darkcyan;
color: darkgreen;
font-size: 40px;
}
.mySecondClass {
background-color: darkgrey;
color: red;
font-size: 20px;
}
style>
Как видим, значения спорных свойств были взяты из того класса, который был описан в коде ниже. Если сменим их очередность, получим следующий результат:
<style>
.mySecondClass {
background-color: darkgrey;
color: red;
font-size: 20px;
}
.myFirstClass {
background-color: darkcyan;
color: darkgreen;
font-size: 40px;
}
--style>
Что касается порядка обьявления используемых классов в атрибуте class непосредвенно в самом теге, он не имеет значения:
<p class="myFirstClass mySecondClass">Параграф 1p>
<p class="mySecondClass myFirstClass">Параграф 1p>
Эти две строки возымеют одинаковое воздействие на форматирование параграфа.
Що таке патерни проєктування у програмуванні
Автор: Влад Сверчков
Що таке патерн (шаблон) проєктування.
Коли використовують шаблони.
Якими бувають патерни проєктування.
Породжуючі.
Структурні.
Патерни поведінки.
Як обрати шаблон?
Висновки.
Програмісти-початківці завжди приходять до точки, коли їхній код перетворюється на “спагеті”. Його важко читати, він містить масу самоповторень, зайвих функцій, а додавання нового функціоналу перетворюється на десяте коло пекла.
Один із найкращих засобів запобігання цьому – використовувати патерни проєктування (Design Patterns). Чи є це срібною кулею, які переваги та недоліки патернів існують, і які з них необхідно знати розробникам? Відповіді розбираємо нижче.
Що таке патерн (шаблон) проєктування?
Патерни – це типові архітектурні рішення проблем, котрі часто зустрічаються під час розроблення ПЗ. Їхня інша назва – шаблони, і що цікаво – людство дуже часто оточує себе шаблонами у повсякденному житті:
однакові гнізда розетки та форми вилок у приміщеннях – універсальне рішення для електроживлення;
виделки та ложки – інструменти споживання майже будь-якої їжі;
чашки – ємності для розміщення будь-якої рідини і так далі.
Людина завжди прагне спростити традиційну діяльність, і це не могло обійти стороною програмування.
Ідеї створення універсальних правил для якісної розробки існували ще до 90-х років минулого століття, але дійсно проривною стала праця "Design Patterns: Elements of Reusable Object-Oriented Software" (1994) авторства Еріха Ґамма, Річарда Гелма, Ральфа Джонсона та Джона Вліссідеса, які іменують себе як "Банда чотирьох" (Gang of Four, GoF).
У книзі описано 23 патерна та їхнє застосування в об'єктно-орієнтованому дизайні. Ця праця стала фундаментальною і тепер патерни gof складають кістяк багатьох обговорень якісного коду.
Коли використовують патерни
В розробці шаблони використовують при необхідності приведення коду до наступних критеріїв:
Читабельність – інші розробники мають без складнощів розуміти написане.
Масштабованість – легкість у створенні нового функціоналу.
Підтримуваність – оновлення кодової бази має проходити якомога плавніше.
Також вони здатні підвищити швидкість і продуктивність розробника – патерни це дійсно дозволяють. Вони гарно справляються і з наступними задачами:
зменшення кількості потенційних помилок та вузьких місць;
спрощення рефакторингу;
зменшення технічного боргу;
покращення комунікації девелоперів з іншими програмістами, проєктними менеджерами, власниками тощо.
Необхідність використати шаблони проектування зростає разом зі збільшенням кодової бази, особливо при комерційному розробленні – коли створюване ПЗ має приносити прибуток.
Важливо пам’ятати, що використання патернів інколи є геть недоречним. Подекуди воно може значно ускладнити читабельність, громіздкість і масштабованість коду. Наприклад, нескладний функціонал, який нечасто використовується і займає мало місця в коді, не потребує pattern-втручання. А от репетативний код, що вирішує класичні задачі (сортування, перебір даних тощо) – ідеальний претендент на застосування шаблону.
Аби не помилитися спершу з’ясуйте контекст вашої проблеми, а вже потім обирайте патерни програмування, які найкраще задовольняють вимогам.
Якими бувають патерни проєктування
У своїй книзі GoF виділяють три великі сімейства:
Сімейство
Короткий опис
Породжуючі патерни або Creational Patterns
Надають найкращі способи створення об'єктів. Вони абстрагуються від процесу конкретизації і роблять вашу систему незалежною від створення, компонування та представлення її об'єктів.
Популярні приклади: “Абстрактна фабрика” (Abstract Factory), “Одинак” / “Одиночка” (Singleton), “Прототип” (Prototype), “Фабричний метод” (Factory Method).
Структурні патерни або Structural Patterns
Фокусуються на композиції об’єкту. Допомагають переконатися в тому, що зміна частини системи не потягне за собою необхідність змін в інших її складових.
Популярні приклади: “Проксі” (Proxy), “Адаптер” (Adapter), “Компонувальник” (Composite), “Фасад” (Facade).
Патерни поведінки або Behavioral Patterns
Зона відповідальності – алгоритми та обмін інформацією між об’єктами.
Популярні приклади: “Відвідувач” (Visitor), “Ітератор” (Iterator), “Ланцюжок обов’язків” (Chain of Responsibility), “Стратегія” (Strategy).
Розглянемо більш детально деякі з них.
Породжуючі
Породжуючі патерни – це надійні помічники у створенні об’єктів таким чином, аби в майбутньому з ними було максимально легко працювати.
Дамо короткий опис деяких шаблонів:
Патерн Одинак / Сінглтон забезпечує наявність лише одного екземпляру класу з глобальною точкою доступу. Singleton поширений в задачах конфігурацій або логування в застосунках, де потрібен єдиний контрольований доступ.
Шаблон Прототип дозволяє створювати нові об'єкти шляхом копіювання існуючих екземплярів. Використовується Prototype в ситуаціях, коли створення об'єкта надто дороге, наприклад, при клонуванні складних або ресурсоємних об'єктів.
Фабричний метод визначає інтерфейс для створення об'єктів, але дозволяє підкласам самостійно визначати тип створюваних об'єктів. Fabric Method корисний у багатофункціональних застосунках, де класи повинні мати можливість вибирати тип об'єктів, наприклад, при роботі з різними форматами документів, системами онлайн платежів тощо.
Абстрактна фабрика визначає інтерфейс для створення сімейств пов'язаних об'єктів без вказівки їх конкретних класів. Використовують Abstract Factory для створення різних компонентів інтерфейсу користувача, які повинні працювати разом і забезпечувати єдиний стиль (світла / темна тема вебсайту тощо).
Розглянемо приклад на патерні Singleton. Уявіть собі просту програму – музичний плеєр. Він дозволяє користувачам відтворювати музичні файли. Однак водночас має працювати лише один екземпляр плеєра – можливість відкриття декількох одночасно повинна бути недоступна. Цього можна досягти за допомогою шаблону Singleton.
Простий приклад коду мовою C#:
public class MusicPlayer
{
private static MusicPlayer _instance;
private MusicPlayer()
{
// Ініціалізуємо музичний плеєр (наприклад, завантажуємо плейлисти)
}
public static MusicPlayer Instance
{
get
{
if (_instance == null)
{
_instance = new MusicPlayer();
}
return _instance;
}
}
public void PlaySong(string songPath)
{
// Запустити пісню
}
public void PauseSong()
{
// Поставити на паузу
}
public void StopSong()
{
// Зупинити відтворення пісні
}
}
// Отримуємо екземпляр MusicPlayer
MusicPlayer player = MusicPlayer.Instance;
// Використовуємо функціонал MusicPlayer
player.PlaySong("C:\\Users\\yourUsername\\Music\\mySong.mp3");
player.PauseSong();
player.StopSong();
Щоразу як в різних ділянках проєкту вам треба буде створювати екземпляр плеєру для відповідної взаємодії, ви завжди працюватимете лише з одним і тим самим екземпляром, уникаючи дублікації.
Якщо ви програмуєте мовою сі шарп, детально розібрати популярні патерни проєктування C# з прикладами ви можете за посиланням.
Структурні
З короткого опису в таблиці легко дійти висновку, що структурні патерни дозволяють сформувати надійну, масштабовану та підтримувану архітектуру проєкту. Коротке знайомство:
Проксі забезпечує об'єкт-посередник для контролю доступу до іншого об'єкта. Зазвичай шаблон Proxy використовують для реалізації “лінивого” завантаження, коли об'єкт створюється або ініціалізується лише при зверненні до нього (наприклад, завантаження картинок з високою роздільною здатністю).
Адаптер дозволяє об'єктам з несумісними інтерфейсами працювати разом. Застосовується патерн Adapter для інтеграції нових компонентів в існуючу систему без зміни її коду. Підходить для використання нової бібліотеки у старому застосунку.
Компонувальник використовується для ієрархічного компонування об'єктів для подальшої роботи з ними як з єдиним об'єктом. Використовується для створення деревоподібних структур, як-от файлові системи або GUI, де кожен вузол може бути як простим, так і Composite об'єктом.
Фасад (Facade) надає спрощений інтерфейс для взаємодії зі складною системою або набором класів. Він зменшує складність роботи з підсистемами і надає користувачам єдиний вхідний інтерфейс для виконання рутинних операцій.
Вивчити саме структурні патерни проєктування C# (з прикладами) ви можете за посиланням.
Поведінкові
Патерни поведінки в першу чергу визначають зв’язки між об’єктами і те, як вони здійснюють обмін інформацією. Наприклад:
Патерн Відвідувач (Visitor) дозволяє додавати нові операції до об'єктів без зміни їхніх оригінальних класів. Використовується для взаємодії з об’єктами зі складною структурою, коли внесення додаткової логіки в оригінальні класи невиправдано ускладнює код.
Ітератор / Iterator надає зручний механізм послідовного та простого доступу до елементів колекції, незважаючи на складність її побудови. Даний патерн поведінки популярний при обході елементів контейнерів, як-от списки або масиви – він надає універсальний інтерфейс для різних типів колекцій.
Ланцюжок обов’язків або ж патерн Chain of Responsibility дозволяє передавати запит ланцюжком обробників, поки один з них не обробить запит. Незамінний при обробці запитів на сервері, де кожен обробник може передати запит наступному обробнику в ланцюжку: перевірка при авторизації на сайті, оброблення подій у GUI тощо.
Для входу в патерни проєктування книга від Gang of Four буде гарною точкою відліку. Ви познайомитеся з класикою та академічним розкриттям теми, використовуючи патерни gof. Якщо ж ви хочете збагатити свої знання шаблонів, але віддаєте перевагу мові Java, рекомендуємо відео курс “Патерни проектування Java”.
Як обрати патерн?
Спочатку ви маєте проаналізувати задачу – для більшої зрозумілості виконайте її декомпозицію, розбивши на декілька складових. При цьому використовуйте системний підхід: прорахуйте, як ваше рішення вплине на весь проєкт, які елементи воно зачепить зараз, і який вплив воно матиме на додавання нового коду.
Якщо ви вже працюєте в ІТ-компанії, ваші колеги, тімлід або архітектор можуть підказати вам доцільність використання того чи іншого патерну, розкрити нюанси вже існуючої архітектури, кодового стилю та багато іншого.
Лише після ретельного аналізу можна переходити до підбору шаблону, зважаючи на усі переваги та недоліки. До речі, в цих задачах гарними помічниками будуть безкоштовні AI-асистенти на кшталт ChatGPT, Gemini та ін.
Також не забувайте про використання інших методик покращення кодової читабельності, масштабування й чистоти:
SOLID принципи – вони регламентують 5 основних засад створення структурованого, якісного коду. Нещодавно ми проводили вебінар, на якому розбирали кожен принцип в деталях, запрошуємо до перегляду! А якщо вас цікавить прикладний характер SOLID принципів на Java, можете пройти даний відео курс.
GRASP (General Responsibility Assignment Software Patterns) – патерни для об’єктно-орієнтованого проєктування. Вони не мають вираженої структури і носять більш абстрактний характер, аніж патерни gof.
DRY (Don’t Repeat Yourself) – головна ідея даного принципу полягає у створенні коду, який не матиме дублікацій в проєкті.
KISS (Keep It Simple, Stupid) – регламентує написання якомога простішого коду, аби його можна було легко читати і розуміти.
Рефакторинг – повернення до вже написаного коду з метою його покращення без зміни функціональності.
Інші техніки, що залежать від проєктів.
Висновки
Патерни грають ключову роль в сучасному розробленні. Вони акумулюють в собі найкращі практики створення кодової бази таким чином, аби досягнути максимальної легкості та ефективності розроблення, особливо на великих проєктах.
Звісно, не завжди їхнє використання є доречним – потрібно аналізувати задачі і продумувати наслідки застосування того чи іншого шаблону, аби не отримати величезну валізу без ручки.
Розвивайте вашу експертизу в області патернів – це win-win стратегія. З одного боку перед працедавцями ви постанете як досвідчений та висококваліфікований спеціаліст, а з іншого – ваші програмні рішення матимуть елегантний характер і відзначатимуться легкістю в читанні, підтримці та масштабуванні.
Чи використовуєте ви патерни в своїй розробницькій діяльності? Можливо, тільки вивчаєте? Залишайте в коментарях ваші відповіді!