AlexeyPerfilev

AlexeyPerfilev

Опытный фронтенд-разработчик с 4-летним практическим опытом разработки высокопроизводительных и масштабируемых веб-приложений с использованием Vue.js или React. Опыт в разработке одностраничных приложений (SPA), серверного рендеринга и интеграции с RESTful API.
На Пикабу
в топе авторов на 659 месте
1998 рейтинг 3 подписчика 0 подписок 22 поста 3 в горячем
1047

Как один программист случайно уничтожил компанию одной строкой кода3

Привет, Пикабу! Сегодня я расскажу вам историю, от которой у любого программиста волосы встанут дыбом. Это история о том, как одна маленькая ошибка привела к гигантским последствиям.

  1. Дело было в 2016 году. Главный герой - разработчик по имени Марвин (имя изменено), работавший в хостинг-провайдере Gitlab.

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

  3. У Gitlab случилась небольшая проблема с производительностью базы данных. Марвин решил её починить.

  4. Он собирался удалить временную базу данных на одном из серверов. Команда была простая: rm -rf /var/lib/postgresql/9.6/pg_xlog/*

  5. Но случилось страшное - Марвин случайно запустил эту команду НЕ на том сервере!

  6. Результат? 300 ГБ данных пользовательских проектов были моментально и безвозвратно удалены.

  7. Осознав ошибку, Марвин немедленно остановил процесс. Но было уже поздно - данные исчезли.

  8. Команда Gitlab бросилась восстанавливать данные из резервных копий. И тут выяснилось, что система резервного копирования... не работала последние 6 месяцев!

  9. 18 часов непрерывной работы, паники и стресса. Инженеры Gitlab пытались спасти то, что осталось.

  10. В итоге им удалось восстановить большую часть данных, но около 5000 проектов были потеряны навсегда.

  11. Gitlab проявила удивительную прозрачность в этой ситуации. Они вели прямую трансляцию процесса восстановления и открыто рассказали о случившемся.

  12. Несмотря на ошибку, Марвина не уволили. Компания признала, что проблема была в системе, а не в конкретном человеке.

Мораль истории:

  1. Всегда дважды (а лучше трижды) проверяйте, на каком сервере выполняете команды.

  2. Регулярно проверяйте работу системы резервного копирования.

  3. Ошибки случаются со всеми, даже с профессионалами.

  4. Прозрачность и честность могут спасти репутацию даже в самой сложной ситуации.

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

А у вас были случаи, когда маленькая ошибка приводила к большим последствиям? Расскажите в комментариях!

UPD уточнение: #comment_324862867

Рабочий бэкап сделанный за 6 часов

Они не теряли 5000 проектов навсегда, чё за выдуманная хрень, они потеряли изменения, комменты и тд сделанные в 5000 проектах в течение этих 6 часов

On January 31st 2017, we experienced a major service outage for one of our products, the online service GitLab.com. The outage was caused by an accidental removal of data from our primary database server.

This incident caused the GitLab.com service to be unavailable for many hours. We also lost some production data that we were eventually unable to recover. Specifically, we lost modifications to database data such as projects, comments, user accounts, issues and snippets, that took place between 17:20 and 00:00 UTC on January 31. Our best estimate is that it affected roughly 5,000 projects, 5,000 comments and 700 new user accounts.

https://habr.com/ru/companies/slurm/articles/321074/
https://about.gitlab.com/blog/2017/02/10/postmortem-of-datab...
https://about.gitlab.com/blog/2017/02/01/gitlab-dot-com-data...

Показать полностью

Знаете ли вы, что первый в мире веб-браузер умел то, чего не умеют современные?1

Представьте себе браузер, в котором можно не только просматривать, но и редактировать любую веб-страницу. Фантастика? А вот и нет!

В 1990 году Тим Бернерс-Ли (да-да, тот самый создатель Всемирной паутины) разработал браузер под названием WorldWideWeb (позже переименованный в Nexus).

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

Представьте, если бы сейчас в Chrome или Яндекс.Браузере можно было бы просто взять и отредактировать любой сайт, который вы посещаете...

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

А теперь вопрос к нашим программистам и веб-разработчикам: как думаете, почему от этой идеи отказались? И нужна ли такая функция в современных браузерах?

Жизнь фронтендера: когда твой код – это искусство, а браузер – холст

Привет, Пикабу! Сегодня я хочу рассказать вам о захватывающем мире фронтенд-разработки. Готовы погрузиться в пучину тегов, стилей и скриптов? Поехали!

1. HTML: скелет нашего цифрового тела

Представьте, что вы скульптор, но вместо глины у вас теги. Каждый <div> – это маленькая вселенная, а <p> – повествование целой истории. А когда вы случайно забываете закрыть тег, это как забыть застегнуть ширинку – вроде работает, но что-то не так.

2. CSS: макияж для вашего сайта

CSS – это как модный журнал для вашего HTML. Хотите, чтобы ваш сайт выглядел как топ-модель на подиуме? Просто добавьте немного flexbox и grid, и вуаля! Хотя иногда CSS больше похож на игру "Угадай, почему этот элемент съехал на 2 пикселя влево".

3. JavaScript: душа вашего сайта

Если HTML – это тело, а CSS – одежда, то JavaScript – это душа вашего сайта. Именно он заставляет всё двигаться, реагировать и иногда падать с криком "Uncaught TypeError". Но когда вы наконец-то заставляете всё работать идеально, чувствуете себя настоящим волшебником!

4. Фреймворки: когда вы устали изобретать велосипед

React, Vue, Angular – выбирайте свой яд. Эти ребята обещают сделать вашу жизнь проще, и они действительно это делают... после 10 часов настройки и 100 ошибок при сборке.

5. Отладка: детективная работа 21 века

Кто сказал, что программисты не детективы? Попробуйте найти ошибку в 1000 строк кода! Это как искать иголку в стоге сена, только стог постоянно меняет форму, а иголка превращается в стог.

Заключение

Быть фронтендером – значит быть немного художником, немного волшебником и чуточку мазохистом. Но когда вы видите, как ваш код оживает в браузере, понимаете – оно того стоило!

А вы, дорогие читатели, сталкивались с миром фронтенд-разработки? Поделитесь своими историями в комментариях!

Показать полностью

Исповедь фронтендера: Когда твой код – это комедия ошибок

Привет, Пикабушники! Сегодня я хочу поделиться с вами своими приключениями в мире фронтенд-разработки. Готовьтесь смеяться и плакать одновременно!

1. CSS – мой личный босс из ада

Кто сказал, что CSS прост? Это как игра "Твистер", только вместо конечностей ты двигаешь div'ы и span'ы. Один неверный ход – и твой сайт выглядит как произведение современного искусства. Абстракционизм, знаете ли.

2. JavaScript: когда твой код живет своей жизнью

Я: пишу простую функцию JavaScript: "Хм, а что если я буду работать только по четным вторникам?" Я: в панике проверяю документацию JavaScript: "Шучу! Я просто забыл закрывающую скобку. Упс!"

3. Совместимость браузеров – мой персональный квест

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

4. Фреймворки: выбери меня! Нет, меня!

React, Vue, Angular... Иногда мне кажется, что я на шоу "Холостяк", только вместо роз раздаю свое время и нервные клетки.

5. Отладка: детективная история с открытым финалом

Я – Шерлок Холмс мира кода. Мой Watson – это консоль браузера. Вместе мы расследуем загадочное исчезновение рабочего кода после "небольших изменений".

Вывод

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

P.S. Если вы фронтендер и узнали себя в этом посте – добро пожаловать в клуб! У нас есть печеньки и бесконечный запас кофе.

Показать полностью

Битва титанов: Выбираем state менеджер для React (осторожно, можно подавиться попкорном от накала страстей!)

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

Раунд 1: Redux - дедушка, который ещё о-го-го!

Плюсы:

  • Предсказуемость состояния (если вы экстрасенс и можете предсказать, что произойдет после 20 действий)

  • Отличная документация (которую никто не читает)

  • Огромное комьюнити (в основном состоящее из людей, задающих вопрос "Зачем здесь столько кода?")

Минусы:

  • Многословность (пишешь 100 строк кода, чтобы изменить одну переменную)

  • Кривая обучения (напоминает американские горки, только вместо адреналина - отчаяние)

Раунд 2: MobX - хипстер в мире state менеджмента

Плюсы:

  • Меньше кода (настолько меньше, что иногда забываешь, что вообще что-то написал)

  • Реактивность из коробки (магия, не иначе!)

  • Удобство использования (если вы фанат декораторов и любите украшать свой код, как новогоднюю ёлку)

Минусы:

  • Может быть сложно отлаживать (где эта чертова переменная изменилась?!)

  • Менее предсказуемое поведение по сравнению с Redux (сюрприз за сюрпризом, прямо как в коробке конфет Forrest Gump)

Раунд 3: Recoil - новичок, который хочет всех удивить

Плюсы:

  • Простота использования (настолько просто, что даже ваша бабушка смогла бы написать atom)

  • Оптимизация производительности (React, ускоряйся!)

  • Поддержка от Facebook (ну, вы знаете, те ребята, которые создали React и подарили нам бесконечные часы дебагинга)

Минусы:

  • Относительно новый (использовать в продакшене - все равно что прыгать с парашютом, сделанным из простыней)

  • Меньше экосистема (найти готовое решение сложнее, чем номер телефона на старой Nokia)

Раунд 4: Zustand - минималист, который пытается всех помирить

Плюсы:

  • Крошечный размер (настолько маленький, что можно случайно удалить, очищая корзину)

  • Простой API (настолько простой, что даже джуниор на собеседовании не запутается... наверное)

  • Отлично работает с TypeScript (наконец-то, можно перестать гадать, какого типа эта переменная!)

Минусы:

  • Может быть недостаточно для сложных приложений (как пытаться построить небоскреб из Lego)

  • Меньше встроенных функций (придется самим изобретать велосипед, но с квадратными колесами)

Итог: Кто же победил?

А победил... барабанная дробь... тот, кто подходит именно вашему проекту! Ведь в мире React, как и в мире покемонов, нужно выбирать своего стартовика с умом.

А теперь предлагаю всем высказаться в комментариях! Какой state менеджер вы предпочитаете и почему? Может быть, вы вообще используете useContext и useReducer и смеетесь над всеми этими библиотеками? Или, может, вы фанат Context API и считаете, что остальное - лишний геморрой?

Давайте устроим настоящую битву! Но помните: код до добра не доводит, а вот чувство юмора - запросто!

P.S. Если в процессе дискуссии вы увидите разработчика, катающегося по полу и кричащего "Да зачем вообще нужен state management?!", не пугайтесь. Просто дайте ему печеньку и почешите за ушком. Возможно, он пытался управлять состоянием большого приложения без специальных инструментов.

Показать полностью

TypeScript: Друг или враг разработчика?

Привет, Пикабушники! Сегодня хочу поднять тему, которая вызывает много споров в мире веб-разработки – TypeScript. Давайте обсудим, действительно ли он так хорош, как о нём говорят, или это просто очередной хайп?

Что такое TypeScript?

Для тех, кто не в курсе: TypeScript – это язык программирования, созданный Microsoft как надстройка над JavaScript. Он добавляет статическую типизацию и другие фичи, которых не хватает в чистом JavaScript.

Плюсы TypeScript:

  1. Статическая типизация: Помогает ловить ошибки на этапе компиляции, а не в рантайме.

  2. Улучшенная поддержка IDE: Автодополнение и рефакторинг работают намного лучше.

  3. Лучшая читаемость кода: Типы делают код более понятным, особенно в больших проектах.

  4. Современные возможности языка: TypeScript часто внедряет новые фичи раньше, чем они появляются в JavaScript.

Минусы TypeScript:

  1. Дополнительный этап компиляции: Увеличивает время разработки и усложняет процесс сборки.

  2. Крутая кривая обучения: Новичкам может быть сложно разобраться во всех тонкостях типизации.

  3. Излишняя "многословность": Иногда приходится писать больше кода, чем в JavaScript.

  4. Проблемы с некоторыми библиотеками: Не все JavaScript-библиотеки имеют качественные типы.

Вопросы для обсуждения:

  1. Используете ли вы TypeScript в своих проектах? Почему да или почему нет?

  2. Если используете, с какими трудностями вы столкнулись при переходе с JavaScript?

  3. Считаете ли вы, что преимущества TypeScript перевешивают его недостатки?

  4. Есть ли проекты, для которых вы бы не рекомендовали использовать TypeScript?

Давайте обсудим! Делитесь своим опытом и мнением в комментариях. И помните: в программировании нет универсальных решений, всё зависит от конкретной задачи и команды.

Показать полностью

Почему я считаю, что эра JavaScript-фреймворков подходит к концу

Привет, Пикабу! Сегодня хочу поделиться мыслями, которые наверняка вызовут бурю эмоций у фронтендеров. Готовы? Поехали!

Смелое заявление

Я считаю, что эра больших JavaScript-фреймворков (React, Angular, Vue) подходит к концу. Да-да, я сказал это.

Почему я так думаю?

  1. Сложность: С каждым обновлением фреймворки становятся всё сложнее. Новичкам всё труднее входить в разработку.

  2. Производительность: Ванильный JavaScript и небольшие специализированные библиотеки часто работают быстрее.

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

  4. Переусложнение простых задач: Для создания простой страницы приходится поднимать целую инфраструктуру.

  5. WebComponents: Нативные веб-компоненты становятся всё мощнее, уменьшая потребность в фреймворках.

Что дальше?

Я предвижу возвращение к более простым решениям:

  • Ванильный JavaScript для простых проектов

  • Микрофреймворки для конкретных задач

  • Серверный рендеринг и прогрессивное улучшение

Мой опыт

Недавно я отказался от использования React в пользу ванильного JS и WebComponents для небольшого проекта. Результат? Сайт стал быстрее, код - чище, а разработка - приятнее.

Вывод

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

А что думаете вы? Согласны ли вы, что эра больших фреймворков подходит к концу? Или я совершенно не прав? Давайте обсудим в комментариях!

P.S. Готов к горячим спорам. Фронтендеры, не сдерживайте эмоции! 😉

Показать полностью

Фронтенд в 2024: Что нового?

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

1. Компонентный подход набирает обороты

React, Vue и Angular продолжают доминировать, но появляются новые игроки. Svelte и Solid.js привлекают внимание своей производительностью и простотой.

2. Серверные компоненты

React Server Components и похожие технологии в других фреймворках позволяют рендерить часть UI на сервере, улучшая производительность и SEO.

3. WebAssembly становится мейнстримом

Все больше разработчиков используют WebAssembly для высокопроизводительных вычислений в браузере.

4. CSS-in-JS эволюционирует

Новые решения, такие как Vanilla Extract и Panda CSS, предлагают типобезопасность и улучшенную производительность.

5. Микрофронтенды для масштабирования

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

6. Веб-компоненты возвращаются

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

7. Производительность в приоритете

Core Web Vitals и другие метрики производительности становятся ключевыми для SEO и UX.

Какие тренды вы замечаете в своей работе? Делитесь в комментариях!

Показать полностью
Отличная работа, все прочитано!