🤔Чистая архитектура во фронтенде: для чего нужна, как выглядит идеальная архитектура фронтенда и чем могут помочь такие инструменты, как Bit и Nx
Главные преимущества чистой архитектуры во фронтенде — это удобство сопровождения и масштабируемость.
📌Почему это так важно и какие инструменты могут нам в этом помочь?
🔸Важность архитектуры: несмотря на сомнения многих, архитектура фронтенда так же критична, как и бэкенда. Она помогает в выполнении бизнес-требований, сокращает риски и упрощает понимание проекта.
🔸Многоуровневая архитектура: пример выше показывает, как использовать слои — от API до глобального хранилища и домена.
🔸Полезные инструменты. Bit и Nx — инструменты, которые помогут вам обеспечивать правильные зависимости между слоями и поддерживать чистоту кода.
🔸Принципы и анти-паттерны: не забудьте о SOLID, KISS и DRY, когда работаете с компонентами. И остерегайтесь типичных ошибок, таких как импорт ненужных библиотек или добавление бизнес-логики в шаблоны.
🔸И помните, что даже с идеальной архитектурой вам все равно потребуется уделять внимание код-ревью и постоянному совершенствованию.
Главные преимущества чистой архитектуры во фронтенде — это удобство сопровождения и масштабируемость.
📌Почему это так важно и какие инструменты могут нам в этом помочь?
🔸Важность архитектуры: несмотря на сомнения многих, архитектура фронтенда так же критична, как и бэкенда. Она помогает в выполнении бизнес-требований, сокращает риски и упрощает понимание проекта.
🔸Многоуровневая архитектура: пример выше показывает, как использовать слои — от API до глобального хранилища и домена.
🔸Полезные инструменты. Bit и Nx — инструменты, которые помогут вам обеспечивать правильные зависимости между слоями и поддерживать чистоту кода.
🔸Принципы и анти-паттерны: не забудьте о SOLID, KISS и DRY, когда работаете с компонентами. И остерегайтесь типичных ошибок, таких как импорт ненужных библиотек или добавление бизнес-логики в шаблоны.
🔸И помните, что даже с идеальной архитектурой вам все равно потребуется уделять внимание код-ревью и постоянному совершенствованию.
What is a Clean Frontend Architecture_ _ Bits and Pieces.pdf
5 MB
☝️Pdf-файл для тех, у кого не открывается Medium.
⚒Radix Primitives — низкоуровневая библиотека UI-компонентов, ориентированная на доступность, настройку и удобство разработки.
Вы можете использовать эти компоненты либо в качестве базового уровня вашей системы дизайна, либо внедрять их постепенно.
На скриншоте — статистика проекта за последние 28 дней.
Вы можете использовать эти компоненты либо в качестве базового уровня вашей системы дизайна, либо внедрять их постепенно.
На скриншоте — статистика проекта за последние 28 дней.
DOM, DI и View: разбираемся в деревьях в Angular
Деревья в Angular легко перепутать: они похожи и иногда даже имеют прямое соответствие. Александр Инкин, фронтенд-разработчик команды Angular UI Kit, разобрал их различия и объяснил, какие фичи помогут избежать трудностей.
🔗Читать
Деревья в Angular легко перепутать: они похожи и иногда даже имеют прямое соответствие. Александр Инкин, фронтенд-разработчик команды Angular UI Kit, разобрал их различия и объяснил, какие фичи помогут избежать трудностей.
🔗Читать
Хабр
DOM, DI и View: деревья в Angular
Чтобы стать продуктивным разработчиком на Angular, потребуется понимание различных деревьев, из которых состоит приложение. На первый взгляд легко можно спутать дерево инжекторов DI и DOM-дерево...
#холивар
🤔В современной фронтенд-разработке масштабируемость и поддерживаемость кода играют критически важную роль, особенно при работе над крупными и долгосрочными проектами.
На практике разработчики сталкиваются с различными проблемами, связанными с увеличением сложности кода, интеграцией новых функций и обеспечением его эффективного взаимодействия с другими частями системы.
💬С учетом этого, какие конкретные подходы, паттерны проектирования или инструменты вы применяете, чтобы обеспечить масштабируемость вашего кода?
Как вы структурируете свои проекты, чтобы они оставались легко поддерживаемыми, даже когда команда разработчиков растет или технологии меняются?
🤔В современной фронтенд-разработке масштабируемость и поддерживаемость кода играют критически важную роль, особенно при работе над крупными и долгосрочными проектами.
На практике разработчики сталкиваются с различными проблемами, связанными с увеличением сложности кода, интеграцией новых функций и обеспечением его эффективного взаимодействия с другими частями системы.
💬С учетом этого, какие конкретные подходы, паттерны проектирования или инструменты вы применяете, чтобы обеспечить масштабируемость вашего кода?
Как вы структурируете свои проекты, чтобы они оставались легко поддерживаемыми, даже когда команда разработчиков растет или технологии меняются?
#перечитываястарое
⚒️Prettier — инструмент для форматирования кода, который обеспечивает единообразный стиль.
Он анализирует ваш код и переписывает его по определеннвм правилам. В поддержке: JavaScript, TypeScript, Flow, JSX, JSON, CSS, SCSS, Less, HTML, Vue, Angular, GraphQL, Markdown и YAML.
🔗GitHub
⚒️Prettier — инструмент для форматирования кода, который обеспечивает единообразный стиль.
Он анализирует ваш код и переписывает его по определеннвм правилам. В поддержке: JavaScript, TypeScript, Flow, JSX, JSON, CSS, SCSS, Less, HTML, Vue, Angular, GraphQL, Markdown и YAML.
🔗GitHub
GitHub
GitHub - prettier/prettier: Prettier is an opinionated code formatter.
Prettier is an opinionated code formatter. Contribute to prettier/prettier development by creating an account on GitHub.
🔍🤖 40 сервисов на базе AI, которые помогут найти работу в 2023 году
Как составить резюме, оптимизировать сопроводительное письмо и найти вакансию в 2023 году? Использовать сервисы на основе искусственного интеллекта. Какие именно — рассказываем в этой статье.
🔗 Читать статью
🔗 Зеркало
Как составить резюме, оптимизировать сопроводительное письмо и найти вакансию в 2023 году? Использовать сервисы на основе искусственного интеллекта. Какие именно — рассказываем в этой статье.
🔗 Читать статью
🔗 Зеркало
🚀 Опубликованы результаты опроса State of CSS 2023!
Все как обычно: много цифр и данных, которые однозначно стоит проанализировать.
В новом отчете вы можете настраивать диаграммы с помощью собственных фильтров.
🔗 Смотреть отчет
Все как обычно: много цифр и данных, которые однозначно стоит проанализировать.
В новом отчете вы можете настраивать диаграммы с помощью собственных фильтров.
🔗 Смотреть отчет
#холивар
😎Первый проект в карьере разработчика — самый волнительный и запоминающийся.
💬А вы помните свои впечатления от первого проекта и стек, на котором он был написан? Как бы вы подошли к своему первому проекту с нынешним опытом?
😎Первый проект в карьере разработчика — самый волнительный и запоминающийся.
💬А вы помните свои впечатления от первого проекта и стек, на котором он был написан? Как бы вы подошли к своему первому проекту с нынешним опытом?
💼🚫 Устроился на работу, но она разонравилась: 8 советов, что делать
Несколько советов, как адаптироваться и понять, стоит ли оставаться или лучше уволиться.
🔗 Читать статью
🔗 Зеркало
Несколько советов, как адаптироваться и понять, стоит ли оставаться или лучше уволиться.
🔗 Читать статью
🔗 Зеркало
Разбираемся с работой DDD на практике
Станисла Батурин, фронтенд-разработчик в Тинькофф, за много лет изобрел целый «магазин» велосипедов и костылей, пока не познакомился с разработкой, основанной на модели предметной области (Domain-Driven Design). Его наблюдения о DDD — в статье.
🚀А те, кто хочет изучить метод от и до, могут посмотреть разбор книги Влада Хононова Learning Domain-Driven Design от книжного клуба Code of Architecture.
Станисла Батурин, фронтенд-разработчик в Тинькофф, за много лет изобрел целый «магазин» велосипедов и костылей, пока не познакомился с разработкой, основанной на модели предметной области (Domain-Driven Design). Его наблюдения о DDD — в статье.
🚀А те, кто хочет изучить метод от и до, могут посмотреть разбор книги Влада Хононова Learning Domain-Driven Design от книжного клуба Code of Architecture.
Хабр
Как DDD работает для меня
Привет! Меня зовут Станислав, я фронтенд-разработчик компании Тинькофф. Занимаюсь разработкой веб-приложений и написал десятки тысяч строк кода, массу велосипедов и костылей, пока не познакомился с...
Мок-собеседование — это один из эффективных инструментов подготовки к собеседованию на вакантную позицию.
📌Ловите небольшую подборку и сохраняйте в заметки:
🌐 Мок-собеседование для джуна-фронтендера: собеседование с лайвкодингом / Собеседует Никита Дубко, руководитель службы разработки в HR Tech Яндекса, ведущий подкаста Веб-стандарты
🌐 Собеседование на позицию фронтенд-разработчика для X5Tech / Собеседует Максим Ульянов, руководитель направления frontend-разработки в X5Tech
🌐 Мок-собеседование на позицию джуна-фронтендера (раз и два) / Собеседует Никита Козлов
🌐 Мок-собеседование на позицию фронтенд-разработчика с практическим акцентом на React и JS (раз и два) // Ulbi TV
📌Ловите небольшую подборку и сохраняйте в заметки:
Please open Telegram to view this post
VIEW IN TELEGRAM
Паттерны реактивности в современном JavaScript
«Реактивность» — это то, как системы реагируют на обновление данных. Существуют разные типы реактивности, но в рамках этой статьи, реактивность — это когда мы что-то делаем в ответ на изменение данных.
Реактивность часто ассоциируется с фреймворками, но можно многому научиться, реализуя реактивность на чистом JavaScript. Мы можем смешивать и играть с этими паттернами для лучшей обработки обновления данных.
👀 Читать
«Реактивность» — это то, как системы реагируют на обновление данных. Существуют разные типы реактивности, но в рамках этой статьи, реактивность — это когда мы что-то делаем в ответ на изменение данных.
Реактивность часто ассоциируется с фреймворками, но можно многому научиться, реализуя реактивность на чистом JavaScript. Мы можем смешивать и играть с этими паттернами для лучшей обработки обновления данных.
Please open Telegram to view this post
VIEW IN TELEGRAM
Кривые Безье активно используются в компьютерной графике для рисования плавных изгибов, CSS-анимации и других сферах.
Это довольно простая для понимания вещь, которую стоит изучить один раз, а затем чувствовать себя комфортно в мире векторной графики и продвинутых анимаций.
Сегодня для вас не просто статья, а гайд от фронтенд-разработчика, который использует кривые Безье на практике. Он включает видео, анимацию и интерактивные компоненты.
Please open Telegram to view this post
VIEW IN TELEGRAM
#css
🤩Ожидание (слева)
🤔Реальность (справа)
🤩Ожидание (слева)
.toppings {
display: grid;
place-items: center;
}
.slices {
display: grid;
grid-template:
"slice1 slice2"
"slice3 slice4";
}
.slice:nth-child(1) {
grid-area: slice1;
border-top-left-radius: 100%;
}
.slice:nth-child(2) {
grid-area: slice2;
border-top-right-radius: 100%;
}
.slice:nth-child(3) {
grid-area: slice3;
border-bottom-left-radius: 100%;
}
.slice:nth-child(4) {
grid-area: slice4;
border-bottom-right-radius: 100%;
}
🤔Реальность (справа)
.pizza-topping {
float: right;
}
❗«Библиотека программиста» продолжает поиски контент-менеджера для ведения телеграм-каналов
Ищем человека, который грамотно пишет, разбирается в контенте и в одной из этих тем:
👉С++
👉Frontend
👉мобильная разработка
👉тестирование
Мы предлагаем частичную занятость и полностью удаленный формат работы — можно совмещать с основной и находиться в любом месте🌴
Подробнее о вакансии и форма для отклика — по ссылке.
Ждем вас в команде!
Ищем человека, который грамотно пишет, разбирается в контенте и в одной из этих тем:
👉С++
👉Frontend
👉мобильная разработка
👉тестирование
Мы предлагаем частичную занятость и полностью удаленный формат работы — можно совмещать с основной и находиться в любом месте🌴
Подробнее о вакансии и форма для отклика — по ссылке.
Ждем вас в команде!
📖 ТОП-10 книг по JavaScript в 2023 году
Популярные книги по изучению JavaScript на русском языке, опубликованные за последние несколько лет.
🔗Читать статью
🔗Зеркало
Популярные книги по изучению JavaScript на русском языке, опубликованные за последние несколько лет.
🔗Читать статью
🔗Зеркало