Pull to refresh
20
0
Иван @IDriuk

программист

Send message

Как в 1.5 раза повысить производительность фронтенда высоконагруженного интернет-магазина на Next.js

Level of difficultyMedium
Reading time5 min
Views8.9K

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

Читать далее
Total votes 13: ↑12 and ↓1+11
Comments18

React + Styled Components — идеальная анимация. Параметризованная анимация

Level of difficultyMedium
Reading time4 min
Views4.7K

В данной статье продемонстрирован способ реализации “параметризованной” css анимации React компонента с помощью styled components. Параметризованная потому что css анимация описывается через параметры, которые динамически рассчитываются на основе пропсов и состояний компонента при его рендеринге.

Читать далее
Total votes 8: ↑8 and ↓0+8
Comments6

8 полезных библиотек React, которые упрощают жизнь разработчику

Reading time5 min
Views15K

Для React разработано большое количество библиотек, которые позволяют без проблем работать даже с очень сложной анимацией, да и не только с ней. В подборку мы постарались добавить те из них, что способны в разы повысить скорость и эффективность работы специалиста. В статье собраны далеко не все библиотеки, которые заслуживают внимания, поэтому, если у вас есть собственный «фаворит», расскажите об этом инструменте в комментариях. Что же, приступим!

Читать далее
Total votes 26: ↑22 and ↓4+18
Comments7

Учим PixiJS на играх

Level of difficultyEasy
Reading time60 min
Views22K

В статье описал разработку 13-ти игр на PixiJS. Около 70% текста - это описание механики игр, остальное - реализация на PixiJS. Получилось много текста, т.к. описывать советы для PixiJS интереснее с примером из игр.
Самая последняя игра будет самой сложной и интересной.

Читать далее
Total votes 25: ↑24 and ↓1+23
Comments6

Как No-code и генеративный ИИ позволяют за секунды создавать новые сайты

Level of difficultyEasy
Reading time10 min
Views49K

Фронтенд и бекенд — прошлый век?

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

Создание сайта с нуля у опытного разработчика займет в среднем от 100 до 500 часов. Причем если нужен уникальный дизайн и множество картинок, это ещё и выльется в копеечку. Но, оказывается, люди без опыта и знаний уже делают сайты бесплатно, и за 10 минут (или 10 секунд, если используют один из сервисов). Не имея ни малейшего понятия о том, что такое PHP, Python или Java.

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

Читать далее
Total votes 24: ↑20 and ↓4+16
Comments22

Из чего состоит договор UX-дизайнера на фрилансе

Reading time9 min
Views2.1K

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

Важно также добавить, что я ни разу ни с кем не судился, отношений не выяснял. В работе я больше защищён грамотно выстроенными процессами и коммуникацией с заказчиком, нежели договором. За основу я когда-то взял договор, использовавшийся в компании Webmaster.spb, в которой проработал несколько лет проектировщиком интерфейсов в начале карьеры.

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

Читать далее
Total votes 6: ↑4 and ↓2+2
Comments2

Настройка Fastlane в React Native

Level of difficultyEasy
Reading time6 min
Views2.8K

Цель:
Одним скриптом загружать новые билды в TestFlight и Google Play.

Идея для статьи зародилась после того, как я потратил кучу времени на настройку Fastlane для своего проекта на React Native. Во время настройки, я так и не смог найти публикацию, которая давала бы простую инструкцию по интеграции Fastlane от А до Я. Эта статья должна стать не более чем простой инструкцией по базовой настройке Fastlane под обе платформы IOS и Android.

Читать далее
Total votes 4: ↑4 and ↓0+4
Comments0

Как изучать SQL в 2023 году

Level of difficultyEasy
Reading time7 min
Views95K

В 2023 году SQL (Structured Query Language) остается одним из самых популярных языков программирования, используемых в области баз данных и аналитики данных. Изучение SQL может быть полезным как для тех, кто только начинает свой путь в IT, так и для опытных профессионалов, которые хотят расширить свои знания и навыки. В этой статье мы рассмотрим несколько советов и ресурсов, которые помогут вам изучать SQL в 2023 году, и оставаться в курсе последних тенденций и изменений в этой области.

Согласно данным сайта Indeed.com, в 2023 году требования к кандидатам в вакансиях, связанных с базами данных и анализом данных, включают знание SQL в качестве обязательного навыка. Некоторые из таких популярных вакансий включают в себя SQL Developer, Data Analyst, Database Administrator, Business Intelligence Analyst и другие. Согласно данным сайта Glassdoor, зарплата специалистов, владеющих навыками работы с SQL, может составлять от $50 000 до $100 000 в год в зависимости от региона и уровня опыта. В связи с этим, изучение SQL может быть полезным для тех, кто хочет улучшить свои шансы на рынке труда и получать высокую заработную плату в IT-сфере.

Читать далее
Total votes 42: ↑37 and ↓5+32
Comments57

Playwright и Puppeteer в 2023 году: что выбрать

Level of difficultyEasy
Reading time11 min
Views6.8K

Дебаты по поводу выбора между Playwright и Puppeteer — это большая дискуссия, поскольку они обе являются фантастическими библиотеками Node.js для автоматизации браузера. Хотя эти библиотеки делают практически одно и то же, между Puppeteer и Playwright есть несколько заметных различий.

Читать далее
Total votes 12: ↑8 and ↓4+4
Comments2

Переходите на микрофронтовую архитектуру

Reading time9 min
Views18K

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

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

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

Полезная ссылка с подробным объяснением концепции микрофронтенда.

Читать далее
Total votes 8: ↑5 and ↓3+2
Comments21

12 важнейших сайтов для освоения CSS в 2023 году

Level of difficultyEasy
Reading time6 min
Views32K

Хотите войти в веб-разработку, но не знаете, с чего начать? Освоение CSS станет отличным стартом и, к счастью для вас, в сети существует огромное количество учебных ресурсов.
Мы провели исследование и собрали 12 наиболее актуальных сайтов, которые помогут вам продвинуться от уровня новичка до профессионала по CSS за кратчайшие сроки.

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

Так что пристегните ремни и приступайте к написанию кода!
Читать дальше →
Total votes 45: ↑45 and ↓0+45
Comments5

Пишем расширение Chrome, которое ворует вообще всё

Reading time10 min
Views24K

Пусть Manifest v3 и ограничил возможности браузерных расширений, но я считаю, что они далеко не исчерпаны. Чтобы доказать это, создадим расширение Chrome, крадущее максимально возможное количество данных.

Мы добьёмся двух целей:

  • Исследуем грани возможного для расширений Chrome
  • Продемонстрируем, что вы подвержены опасности, если не будете аккуратны с тем, что устанавливаете.

Примечание: на самом деле реализация этого расширения — злодейство. Вам не следует использовать в злонамеренных целях полномочия расширений, красть пользовательские данные и создавать зловредные браузерные расширения. Любые реализации, производные расширения или применение этих техник без разрешения Национальной баскетбольной ассоциации не рекомендуются.
Читать дальше →
Total votes 41: ↑39 and ↓2+37
Comments12

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

Reading time8 min
Views3.9K

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

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

Читать далее
Total votes 10: ↑9 and ↓1+8
Comments2

7 лучших библиотек для создания молниеносно быстрых приложений ReactJS

Reading time6 min
Views18K

ReactJS по умолчанию обладает высокой производительностью. Но время от времени у вас появляется шанс сделать его еще лучше. И замечательное сообщество React придумало для этого несколько фантастических библиотек.

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

Давайте начнем.   

.     .     .

Читать далее
Total votes 16: ↑12 and ↓4+8
Comments6

FrontEnd разработка в Docker

Reading time5 min
Views26K

Когда приходит новый разработчик, то перед ним встает задача запустить окружение для разработки. И до недавнего времени - это часто становилось похожим на танцы с бубном. Поставь 10 разных пакетов определенных версий, а еще окажется что твой собственный pet-проект требует другие версии или это даже может быть другой проект в рамках той же работы. Каждый раз из этой ситуации специалист выходил по своему, но основной проблемой помимо временных затрат на эту конфигурацию - оставалось, то что работоспособность от разработчика к разработчику или runner не гарантировалась.

К счастью - эта проблема решена в современном мире разработки, если не полностью, то в большей мере. Нам на выручку пришел Docker.

Read more
Total votes 9: ↑9 and ↓0+9
Comments6

Минимальное PWA

Reading time6 min
Views21K

Какие характеристики должны быть у web-приложения, чтобы соответствовать критерию "прогрессивное"? Понятно, что, как и обычные web-приложения, прогрессивные строятся на базе "большой тройки" web-технологий - HTML/CSS/JS. Но что именно делает web-приложения прогрессивными?

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

Читать далее
Total votes 31: ↑29 and ↓2+27
Comments11

Подготовка к собеседованиям в IT-гиганты: как я преодолела проклятье алгоритмического собеседования

Reading time12 min
Views204K

Дисклеймер:


Я не программирую с трёх лет, не знаю наизусть Кнута, не являюсь призёром олимпиад по информатике и чемпионатов по спортивному программированию, не училась в MIT. У меня за плечами образование по информатике и 6 лет опыта в коммерческой разработке. И до недавнего времени я не могла пройти дальше первого технического скрининга в IT-гиганты из FAANG (Facebook, Amazon, Apple, Netflix, Google и подобные), хотя предпринимала несколько попыток. 

Но теперь всё изменилось, я получила несколько офферов и хочу поделиться опытом, как можно к этому прийти. Речь пойдёт о позиции Software Engineer в европейских офисах перечисленных компаний.
Читать дальше →
Total votes 201: ↑196 and ↓5+191
Comments342

Flutter + arduino nano 33 BLE sense = очень простой BLE sensor

Reading time4 min
Views23K
В этой статье я хочу рассказать как сделать очень простую bluetooth метеостанцию (куда уж без нее :) ) и написать мобильное приложение на Flutter для нее.


Читать дальше →
Total votes 26: ↑26 and ↓0+26
Comments11
1
23 ...

Information

Rating
Does not participate
Location
Полтава, Полтавская обл., Украина
Date of birth
Registered
Activity