Веб-разработка *

Предлагаем вашему вниманию подборку с ссылками на новые материалы из области фронтенда и около него.

Предыстория

Мне поступила задача по настройке CI. Было принято решение использовать трансформацию конфигурационных файлов и конфиденциальные данные хранить в зашифрованном виде. Зашифровать и расшифровать их можно с использованием Key Container.

Key Container

В каждой ОС Windows есть наборы сгенерированных ключей. Ключ генерируется либо на учетную запись, либо на машину. Ключи, сгенерированные на машину, можно посмотреть по этому пути C:\ProgramData\Microsoft\Crypto\RSA\MachineKeys. Сюда и отправится ключ который мы создадим далее.

В своем предыдущем посте я описал основные моменты при разработке другой opensource библиотеки. Забыл упомянуть еще один: если никому не рассказывать про библиотеку, какая бы нужная она ни была, скорее всего никто про нее так и не узнает.

Итак, встречайте trava.js — сочная валидация на пользу проекту. К слову траву мы используем уже больше полугода, и я подумал, пришло время рассказать вам о преимуществах ее использования. Уже даже подсушили, так что задержите дыхание. И вперед.

Материал, перевод которого мы сегодня публикуем, посвящён рейтингу скорости сайтов, который можно вычислить с помощью Google PageSpeed Insights.

Ни для кого не секрет то, что скорость сайта в наше время стала одной из его важнейших характеристик. Чем быстрее сайт загружается и готовится к работе — тем выше может быть доход, который он приносит своему владельцу. Ускорение сайта означает снижение числа пользователей, которые, едва зайдя на этот сайт, покидают его, устав ждать загрузки его материалов. Особую значимость быстродействию сайта придаёт тот факт, что теперь показатели Google PageSpeed используются как один из факторов ранжирования сайтов в результатах поиска. В результате сегодня многие организации уделяют скорости своих сайтов самое пристальное внимание.

В рамках практически любого онлайн-продукта можно встретиться с задачей, которая требует применения того или иного сервиса, связанного с картами, геокодированием, гео-позиционированием. Лично я уже почти 10 лет работаю над онлайн-каталогом недвижимости, а также в рамках ряда других проектов есть опыт использования специфичных функций различных онлайн гео-сервисов.

В этой статье я рассмотрю гео-задачи, которые наиболее часто встают перед программистами, сделаю небольшой обзор сервисов, предлагающих решения для этих задач, и поделюсь опытом использования этих сервисов.

Также рассчитываю на участие комментаторов — если заметите в обзоре неточность в описании, отсутствие вашего хорошего сервиса или вам просто есть что добавить к уже написанному — пишите в комментариях, я буду собирать всё в основной текст, чтобы на будущее всегда иметь под рукой хороший список инструментов на все случаи жизни.

Привет, меня зовут Артём, я руководитель одной из групп разработки интерфейсов в Яндексе. Неделю назад на Я.Субботнике я рассказал, как мы использовали SVG для создания внутреннего календаря. Это расшифровка моего доклада, несколько историй из реализации виджета календаря: масштабирование, заливка паттерном, маски, символы и особенности формата.



— В Яндексе работает много народу, все в разных городах, в разных часовых поясах, и нужно понимать, когда твои коллеги заняты, а когда ты можешь с ними встретиться и поговорить. Мы решили спроектировать календарь, который поможет это узнать.

Я давно уже занимаюсь разработкой web-приложений. Очень давно. Свои первые web-приложения в среде Lotus Domino я создавал в те времена, когда слово "google" ещё не было глаголом, а для поиска информации в интернете люди использовали Yahoo! и Rambler. Я же пользовался Infoseek'ом — у них был сужающийся поиск и не такой безобразно перегруженный интерфейс, как у Yahoo!

Разработка приложений, любых приложений, не только для web'а — работа творческая. Вряд ли кто-то будет спорить с этим утверждением. А красота в творчестве, это как практика в научном познании — критерий истины. Но если научная практика объективна и базируется на измерениях, то красота — предмет субъективный, зависит от того, кто смотрит. Вот я и задался вопросом, а что для меня лично является красивым web-приложением?

(на КДПВ глаз не мой, глаз женский, но, IMHO, женский глаз на КДПВ более уместен, чем мужской, ведь это же — КДПВ!)

Под катом мои собственные критерии того, какое web-приложение на данный момент может считаться красивым. Очень субъективное изложение, обусловленное моим персональным опытом. Возможно кому-то мои критерии прекрасного покажутся критериями уродства. Не удивляйтесь, просто у вас другой опыт.

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

Если, скажем, через полгода после того, как был написан некий «одноразовый» скрипт, кто-то спросит его автора о том, почему этот скрипт даёт сбои, об этом может не знать и автор скрипта. Происходит подобное из-за того, что к такому скрипту не была написана документация, из-за использования параметров, жёстко заданных в коде, из-за того, что скрипт ничего не логирует в ходе работы, и из-за отсутствия тестов, которые позволили бы быстро понять причину проблемы.



При этом надо отметить, что превратить скрипт, написанный на скорую руку, в нечто гораздо более качественное, не так уж и сложно. А именно, такой скрипт довольно легко превратить в надёжный и понятный код, которым удобно пользоваться, в код, который просто поддерживать как его автору, так и другим программистам.

Автор материала, перевод которого мы сегодня публикуем, собирается продемонстрировать подобное «превращение» на примере классической задачи «Fizz Buzz Test». Эта задача заключается в том, чтобы вывести список чисел от 1 до 100, заменив некоторые из них особыми строками. Так, если число кратно 3 — вместо него нужно вывести строку Fizz, если число кратно 5 — строку Buzz, а если соблюдаются оба этих условия — FizzBuzz.

Мы проанализировали мобильные версии ТОП-20 интернет-магазинов России по 44 факторам. Получили адскую таблицу из единиц и нулей, чуть не растворились к ней, но собрались с силами и описали, как и чем «достают» покупателя в топовом сегменте мобильного e-Commerce.

Привет, я Алексей, full-stack разработчик платформы Vimbox. Когда я пришел в Skyeng, здесь решали, стоит ли тратить время на систему автотестов и попросили меня поделиться опытом с предыдущей работы. А такой опыт у меня был: к моменту ухода с предыдущего места мы написали на php и крутили больше 3 тысяч тестов. В итоге я сделал небольшую внутреннюю презентацию, рассказывающую о граблях, на которые успел наступить за несколько лет разработки этих автотестов, борьбы за их скорость, читабельность кода и общую эффективность. Презентация показалась коллегам полезной, поэтому я переложил ее в текст, чтобы оказаться полезным также и более широкой аудитории.

Для начала – термины, о которых пойдет речь в статье:

• Приемочный тест – end-to-end тест: здесь браузер или эмулятор браузера исполняет сценарий
• Модульный тест (юнит тест) – тест метода
• Функциональный тест – тест контроллера или компонента, если речь о фронтенде
• Фикстура – состояние тестового окружения, необходимое для работы теста (глобальные переменные, данные в БД и прочие участники сценария теста)

Привет! Мы продолжаем серию митапов Backend United. Четвёртая встреча называется «Окрошка», и посвящена она будет инцидентам. Вместе с коллегами из Tutu.Ru, Ozon и Авито поговорим про работу с инцидентами, об инструментах для улучшения incident response и о ценности техдолга.

Встреча пройдёт 10 августа, начало в 12:00. Регистрируйтесь сами и приглашайте коллег. Под катом — тезисы выступлений, ссылки на регистрацию и видеотрансляцию митапа.

Классическое PHP-приложение — однопоточность, тяжелая загрузка (если вы, конечно, не пишите на микрофреймворках) и неизбежная смерть процесса после каждого запроса… Такое приложение тяжелое и медленное, но мы можем дать ему вторую жизнь гибридизацией. Чтобы ускорить — демонизируем и оптимизируем утечки памяти, чтобы добиться большей производительности — внедрим собственный сервер РНР-приложений RoadRunner на Golang, чтобы добавить гибкости — упростим PHP-код, расширим стек и разделим ответственность между сервером и приложением. По сути, заставим наше приложение работать, как если бы мы писали его на Java или другом языке.

Благодаря гибридизации ранее медленное приложение перестало страдать 502 ошибками под нагрузками, уменьшилось среднее время ответа на запросы, производительность увеличилась, а деплой и сборка стали проще за счет унификации приложения и избавления от лишней обвязки в виде nginx + php-fpm.


Антон Титов (Lachezis) — технический директор и соучредитель SpiralScout LLC с опытом активной коммерческой разработки на PHP в 12 лет. Последние несколько лет активно внедряет Golang в стек разработки компании. Об одном из примеров Антон рассказал на PHP Russia 2019.

Модульность является одним из ключевых принципов разработки программного обеспечения с 1960-х годов. Применение этого принципа приносит в программирование много полезного. Модульность способствует эффективному использованию принципа разделения ответственностей, что ведёт к улучшению возможностей по созданию, многократному использованию, компоновке кода.

В наше время применение принципа модульности в проектировании ПО приняло новую форму, воплотившуюся в компонентах. Это — разработка, основанная на компонентах (Component Driven Development, CDD). Современные библиотеки и фреймворки для разработки пользовательских интерфейсов, такие как React, Vue и Angular, а также CDD-ориентированные инструменты наподобие Bit, позволяют создавать приложения, опираясь на модульные компоненты. В распоряжении программиста оказываются паттерны и инструменты, необходимые для разработки компонентов в изоляции и построения композиций компонентов.

Компонент — это чётко очерченный независимый фрагмент интерфейса приложения. В качестве примеров компонентов можно привести такие сущности, как кнопки, слайдеры, окна для вывода сообщений чатов. Понимая особенности CDD и умея применять этот подход к разработке, мы можем использовать компоненты в качестве основы приложений. Это, при создании программных проектов, даёт нам всё то полезное, что означает применение принципов модульного программирования.

Если присмотреться к тому, что происходит сейчас в сфере веб-компонентов, можно заметить, что CDD становится стандартизированным подходом к разработке фронтенда.

Материал, перевод которого мы сегодня публикуем, представляет собой руководство по разработке, основанной на компонентах.

Свежая подборка со ссылками на новости и материалы. В выпуске: PHP 7.4.0 beta 1, PhpStorm 2019.2, PSR-12, обзор RFC предложений из PHP Internals, новости с Laracon US, подкасты, порция полезных инструментов, и многое другое.

Приятного чтения!

Предлагаем вашему вниманию подборку с ссылками на новые материалы из области фронтенда и около него.

Предисловие

Вы видели эти статьи тысячу раз:

• «10 вещей, которые нужно создать чтобы стать лучшим разработчиком.»
• «Лучшие фреймворки для изучения в 2019.»
• «Сделайте это чтобы стать разработчиком Rockstar.»
• «Прочитайте эти десять технических книг, и Вы станете успешным разработчиком.»

Что они говорят – так это что Вы должны выучить «reactjs» или «node». Создать 1.000.000.000 приложение ToDo. Прочитать «Ускоренный Курс Python» и – бум, Вы лучший разработчик.

Это всё (теоретические) технические знания. Вам они нужны, но думаете ли Вы, что парикмахер, умеющий держать ножницы технически правильно – хороший? Есть больше навыков для оценки, в каждой профессии!

Давайте поговорим об, как мне кажется, упущенных из виду навыках.

Tic Tac Toe, часть 0: Сравнение Svelte и React
Tic Tac Toe, часть 1: Svelte и Canvas 2D
Tic Tac Toe, часть 2: Undo/Redo с хранением состояний
Tic Tac Toe, часть 3: Undo/Redo с хранением команд
Tic Tac Toe, часть 4: Взаимодействие с бэкендом на Flask с помощью HTTP
Tic Tac Toe, часть 5: Бэкенд на С++ Boost.Beast, HTTP
Tic Tac Toe, часть 6: Flask и Celery/RabbitMQ
Tic Tac Toe, часть 7: pytest и Travis CI

Оформил содержание цикла статей в таком виде, на одной странице. Дать ссылку в каждой статье на одну страницу с содержанием проще, чем изменять каждую прошлую статью, добавляя ссылку на новую статью.

Всё больше и больше проектов и команд используют TypeScript. Однако просто применять TypeScript и выжимать из него максимум пользы — это очень разные вещи.

Представляю вам список высокоуровневых передовых практик использования TypeScript, которые помогут получить максимум преимуществ от применения этого языка.

Всем привет!

Так сложилось, что я из той самой службы контроля качества. Недавно наша команда писала большую фичу. Немного порефлексировав, решил создать такую вот статью-шпаргалку для фронтендеров. Она напомнит на что стоит обратить внимание перед передачей задачи в тестирование.

Доброго времени суток, уважаемые читатели и писатели!

Сегодня я расскажу, как в проекте передо мной возникла задача по изготовлению адаптивного слайдера и что из этого получилось

О статье и для кого она

Данную статью я пишу не столько потому, что желаю получить отклик сообщества на решение данной проблемы, но и потому, что решение вопросов статьи кажется мне фундаментальным для понимания адаптивности слайдера в вебе. Если кто то уже писал подобные компоненты просьба откликнуться и поделиться схожим опытом