Please open Telegram to view this post
VIEW IN TELEGRAM
😁12💯2
ChatGPT с этим промптом превращается в мощный парсинг-инструмент: скрин → код.
Что нужно сделать:
Промпт:
You're a professional web developer and UI/UX expert.
I’m going to upload an image of a website design or component. Please:
1. Analyze the layout and design from the image.
2. Generate clean, responsive HTML and CSS (Tailwind is fine too).
3. Add comments in the code to explain your logic.
4. Ask me any questions if something in the image isn’t clear.
Output everything inside code blocks and make sure it's mobile-friendly.Работает отлично для:
— hero‑секций
— форм логина/регистрации
— табличек с ценами
— админок и портфолио
#буст
Please open Telegram to view this post
VIEW IN TELEGRAM
🔥5❤2⚡2
Наш подписчик работал над крупным корпоративным SPA на React с использованием Emotion для стилизации компонентов. В какой-то момент приложение стало заметно «тормозить» после нескольких переключений между разделами:
«Заглянув в DevTools, увидел, что <head> заполняется дублирующимися <style>-тегами. Оказалось, я каждый раз создавал новый Emotion-cache при рендере, и старые стили не удалялись — вечером перенёс провайдер кеша в корень приложения, и лаги исчезли.»
#междусобойчик
Please open Telegram to view this post
VIEW IN TELEGRAM
🤔4❤2👾1
Proglib Academy — это место, где вы превращаете теорию в практику. Здесь ваши знания становятся проектами для портфолио, а вы — более уверенным специалистом.
Выберите курс, который поможет сделать следующий шаг ⬇️
🚀 Для тех, кто начинает путь в IT:
— Основы IT для непрограммистов
— Программирование на Python (обновлённый)
— Frontend-разработчик с нуля: HTML, CSS, JavaScript
🧠 Для будущих и настоящих Data Scientist'ов:
— ML для старта в Data Science (начинается в сентябре)
— Базовые модели ML и приложения
— Математика для Data Science
— AI-агенты для DS-специалистов (скоро второй поток)
🛠️ Для опытных разработчиков, готовых к росту:
— Алгоритмы и структуры данных
— Архитектуры и шаблоны проектирования
Независимо от вашей цели, у нас есть курс, который поможет её достичь. Переходите в Proglib Academy, выбирайте свой путь и инвестируйте в навыки, которые всегда будут в цене!
Выберите курс, который поможет сделать следующий шаг ⬇️
🚀 Для тех, кто начинает путь в IT:
— Основы IT для непрограммистов
— Программирование на Python (обновлённый)
— Frontend-разработчик с нуля: HTML, CSS, JavaScript
🧠 Для будущих и настоящих Data Scientist'ов:
— ML для старта в Data Science (начинается в сентябре)
— Базовые модели ML и приложения
— Математика для Data Science
— AI-агенты для DS-специалистов (скоро второй поток)
🛠️ Для опытных разработчиков, готовых к росту:
— Алгоритмы и структуры данных
— Архитектуры и шаблоны проектирования
Независимо от вашей цели, у нас есть курс, который поможет её достичь. Переходите в Proglib Academy, выбирайте свой путь и инвестируйте в навыки, которые всегда будут в цене!
😁4👍2
why-did-you-render — это дебаг-библиотека для React, которая показывает, что именно вызвало лишний ререндер компонента.
В консоли видно, какие пропсы или состояние изменились — даже если данные по сути остались теми же. Это помогает быстро вычислить узкие места
Что умеет:
— Сравнивает старые и новые пропсы/стейт
— Подсвечивает !==-сравнения, где изменения фиктивны
— Работает с функциями и классами, включая memo, useMemo, useCallback
Пример использования:
import React from 'react';
import whyDidYouRender from '@welldone-software/why-did-you-render';
whyDidYouRender(React, {
trackAllPureComponents: true
});
#буст
Please open Telegram to view this post
VIEW IN TELEGRAM
🔥12👍5❤3⚡3
В JavaScript одну и ту же функцию можно объявить по-разному — и это влияет на поведение кода.
В карточках разобрали:
Please open Telegram to view this post
VIEW IN TELEGRAM
Please open Telegram to view this post
VIEW IN TELEGRAM
2❤6👍2🥱2
Please open Telegram to view this post
VIEW IN TELEGRAM
😁5💯4
Какая команда активно продвигала React на старте?
Anonymous Quiz
23%
Twitter
22%
Airbnb
12%
Netflix
42%
Instagram
🤔3🌚3
🧐 Зоопарк моделей в ML: с чего начать?
Открываешь статью по машинному обучению — и в тебя летят слова: трансформеры, бустинги, SVM, регрессии.
Кажется, придётся учить всё это, иначе в ML не пустят.
Хорошая новость: 90% задач можно закрыть 2–3 классическими методами. Разберёшь их — уже сможешь собирать работающие проекты. А хайповые названия подождут.
Важно: не распыляйся на всё подряд. Начни с базового — это фундамент, на котором держится остальное.
👉 Успей попасть на курс «ML для старта в Data Science»
Открываешь статью по машинному обучению — и в тебя летят слова: трансформеры, бустинги, SVM, регрессии.
Кажется, придётся учить всё это, иначе в ML не пустят.
Хорошая новость: 90% задач можно закрыть 2–3 классическими методами. Разберёшь их — уже сможешь собирать работающие проекты. А хайповые названия подождут.
Важно: не распыляйся на всё подряд. Начни с базового — это фундамент, на котором держится остальное.
👉 Успей попасть на курс «ML для старта в Data Science»
🔥2
Не всегда баги в логике — часто проблемы в визуале: съехавшие элементы, неверные отступы, несогласованные цвета, низкая читаемость. Эти инструменты помогут протестировать именно UI.
Браузер для фронтендеров, который позволяет одновременно тестировать адаптивность, доступность и дизайн на разных экранах.
Среда для разработки и изолированного тестирования UI-компонентов, что помогает находить визуальные баги ещё до интеграции.
Инструмент для визуального регрессионного тестирования, автоматически фиксирует и сравнивает изменения интерфейса между версиями.
Проверяет контрастность текста и фона на соответствие стандартам WCAG, чтобы интерфейс был читаем для всех пользователей.
Расширение для Chrome, позволяющее прямо в браузере изменять CSS, проверять позиционирование и оперативно тестировать UI.
#свежак
Please open Telegram to view this post
VIEW IN TELEGRAM
🔥4👍2❤1