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

Мы, в компании Linkurious, занимаемся работой над Linkurious Enterprise. Это — веб-платформа, которая, используя возможности графов и средства их визуализации, призвана помогать компаниям и органам власти, расположенным по всему миру, бороться с финансовыми преступлениями.

Одна из главных возможностей Linkurious Enterprise — это простой в освоении и использовании интерфейс визуализации графов, рассчитанный на неспециалистов.



В 2015 году, разочарованные возможностями существующих JavaScript-библиотек для визуализации графов, мы приступили к разработке собственной библиотеки — Ogma.

Ogma — это JS-библиотека, отличающаяся высоким уровнем производительности в плане рендеринга и выполнения вычислений, которая нацелена на визуализацию сетевых структур. Возможно, вы видели, как сетевые структуры визуализируются с помощью других JavaScript-инструментов, вроде D3.js или Sigma.js. Нам возможностей этих инструментов не хватало. Нам было важно, чтобы используемое нами решение обладало бы некоторыми специфическими возможностями, чтобы оно соответствовало бы определённым требованиям к производительности. Ни того, ни другого в сторонних библиотеках мы не нашли. Поэтому мы и решили разработать собственную библиотеку с нуля.

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

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

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

Позже я заметил, что технологии стали подводить всё чаще и стал меньше на них полагаться.

Мой опыт разработки игры «Змейка» на Brython



«Погоди, что?» – думаю, большинство читателей отреагирует на заголовок именно так.

В смысле «просто использовать Python в браузере»?

Все знают, что в браузерах работает только JavaScript.

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

Да, это Python!

А теперь, давайте поговорим о том, как и насколько хорошо это работает, а также обсудим ряд других альтернатив JavaScript.

Знакомство с Brython

Brython — это реализация Python3, написанная на JavaScript, которая позволяет писать код на Python для веба.

По сути, это JavaScript-библиотека, которая преобразует ваш код на Python в эквивалентный JS и исполняет его в рантайме.

Поскольку написание браузерного кода на Python звучит круто, я решил попробовать.

Сегодня, в четвёртом уроке учебного курса по Vue, мы поговорим о том, как выводить на страницу списки элементов.

Тема старая и уже, как выяснилось, подзабытая.

Недавно у меня была короткая работа по разработке ТЗ на модернизацию давно существующего проекта. И, в частности дело касалось стилизации пресловутых <input type="checkbox">. Выяснилось, что исполнитель, программист «на все руки» даже не понял, что я ему на словах объяснял как это сделать. Пришлось делать примеры и, как результат, появился этот текст.

Напомню, что сейчас checkbox и radiobox разные сайты изображают по-разному. Бывает, что не отмеченный input сразу и не разглядишь – такой он «дизайнерский красивый», а у последних версий Chrome выбранные checkbox стали гнусного цвета циан.

Мы продолжаем рассматривать October CMS и её особенности. Мы в LOVATA уже 6 лет работаем с этой системой и за это время убедились в том, что её растущая популярность абсолютно заслуженная.

Сегодня мы подготовили перевод еще одной статьи, на этот раз авторства Andriy Haydash. Данная статья посвящена созданию кастомной функциональности через плагины. Предыдущую статью, посвященную сравнению October CMS и WordPress, вы можете найти здесь.

Вы можете стать более ценным специалистом, изучив лучшие инструменты для разработки веб-приложений на React.



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

И снова привет! В прошлом посте мы начали рассматривать процесс управления зависимостями в JavaScript, разобрали основы: что такое npm-пакет, как выглядит манифест пакета, в каких полях прописываются зависимости и в принципе что такое дерево зависимостей, а также основы семантического версионирования (semver). Если вы пропустили предыдущий пост, то рекомендую начать с него.

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

Лето. Вот список веселых и интересных идей для тренировки навыков программирования.

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

Клон чата на YouTube (только чат)

Я выбрал эту задачу, так как YouTube так распространен, и любой приличный работодатель потребует от вас реализовать аналогичные функции, хотя и в гораздо меньшем масштабе.

Об основных ошибках junior-разработчиков, использующих React. На чем сыпятся джуны, и как с этим жить. Перевод статьи «Mistakes Junior React Developers Make» от специалиста Frontend практики «Рексофт».

Привет!

Тинькофф-журнал выпускает статьи уже 5 лет. За это время из блога на Вордпрессе он вырос в большую самодельную систему из десятков проектов и инструментов. Я в Т—Ж управляю разработкой и сегодня в общих чертах расскажу об архитектуре журнала и сервисах, на которых тот работает.

Продолжаем наш учебный курс по Vue, которые порекомендовала Наталья Теплухина, Staff Engineer в Gitlab и Core Team Member фреймворка Vue (Q/A сессия с Наташей прошла в нашем инстаграм, а расшифровку можно прочитать здесь).

На третьем уроке речь пойдёт об условном рендеринге. О том, как выводить что-либо на странице только в том случае, если выполняется какое-то условие.

Доброго времени суток, друзья!

Представляю Вашему вниманию перевод заметки «How to Parse URL in JavaScript: hostname, pathname, query, hash» автора Dmitri Pavlutin.

Унифицированный указатель ресурса или, сокращенно, URL — это ссылка на веб-ресурс (веб-страницу, изображение, файл). URL определяет местонахождения ресурса и способ его получения — протокол (http, ftp, mailto).

Например, вот URL данной статьи:

https://dmitripavlutin.com/parse-url-javascript

Часто возникает необходимость получить определенные элементы URL. Это может быть название хоста (hostname, dmitripavlutin.com) или путь (pathname, /parse-url-javascript).

Удобным способом получить отдельные компоненты URL является конструктор URL().

В этой статье мы поговорим о структуре и основных компонентах URL.

Клон doodle-place

doodle-place — это онлайн-мир, населенный анимированными каракулями. Вы можете бродить и просматривать каракули, созданные пользователями по всему миру, или внести свой вклад.

Чему вы научитесь, сделав клон doodle-place:

• Использованию API для Canvas в JavaScript для рисования графики вроде каракулей на экране.
• Методам работы с 2D-графикой и API WebGL
• Работе с пользовательским вводом, например, с рисунками, и сохранению результатов в базе данных.

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

Подборка новых статей о Laravel. Вникнем в Полиморфные отношения на примере пиццы. Узнаем о Пайплайн — тайном пакете фреймворка. Поиграемся в Laravel-песочнице. Научимся ловить события изменений атрибутов модели. Продебажим http-запросы в DebugBar. Пропатчим пакеты в вендоре.

Я пользовался методом управления проектами Scrum (скрам) с самого начала карьеры. Я изучал скрам в колледже. Тогда он считался лучшим методом управления разработкой программного обеспечения. Когда я начал работать, мне нравилось всё, что имеет отношение к скраму: ежедневные встречи, планирование, ретроспективные совещания, спринты и так далее. В конце концов, я пользовался на практике тем, чему меня учили.



Но через несколько лет я начал кое-что замечать: в последние дни спринта все бросаются доделывать всё то, чем занимались в предыдущие две недели, стремясь избежать переноса задач на будущее. Часто те, кто так поступали, брали на себя ненужный риск.

Почему? Разве какие-то задачи не могут подождать до следующей недели? Так ли важно доделать абсолютно всё до выходных? Нет, не так уж это и важно. А всё это происходит из-за того, что «Переносы задач — это плохо».

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

Как им это удалось? Как они превратились из тех, кто не может без посторонней помощи открыть PR, в тех, к кому обращаются за помощью другие? Что сделало людей, просящих советов, людьми, охотно дающих советы другим? Как ученики превратились в учителей?



Я задал им эти вопросы. Вот что они на них ответили.

Предлагаем вашему вниманию идеи/задачи (не решения) для самостоятельного изучения и оттачивания мастерства.

График цен на акции в стиле Robinhood

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

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



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