Тёмный

Лучшая Front-end Архитектура в 2023 

Евгений Паромов | Front-end
Подписаться 10 тыс.
Просмотров 14 тыс.
50% 1

▫️▫️▫️▫️
Курс по FSD: paromovevg.ru/courses/fsd
▫️▫️▫️▫️
Мой telegram канал:
t.me/cleanfrontend
В этом видео мы разберём, что изменилось в FSD после релиза, какие у него есть преимущества, и почему я считаю FSD лучшей Front-end архитектурой на данный момент
00:56 - Зачем мне архитектура?
04:16 - Что такое FSD
12:24 - Почему FSD лучшая Архитектура
17:08 - Что нового в FSD 2.0
21:46 - Стоит ли мне использовать FSD?

Наука

Опубликовано:

 

18 окт 2023

Поделиться:

Ссылка:

Скачать:

Готовим ссылку...

Добавить в:

Мой плейлист
Посмотреть позже
Комментарии : 47   
@ihorsudenko864
@ihorsudenko864 8 месяцев назад
Красавчик как говорится )
@pedromachado9049
@pedromachado9049 9 месяцев назад
Чувак, ты прекрасен!
@izzy7541
@izzy7541 9 месяцев назад
Спустя время отказался от fsd. fsd не даёт архитектуру по сути, это просто расположение папок и файлов, всё остальное не продумано и подходит лишь для тудушек (посмотрев примеры из доки, понял что нет строгих правил, просто общий тон). Чуть проект станет большим, вы начнёте испытывать проблемы с выделением слоёв, ведь связей будет огромное количество, а у fsd на это 1 ответ - отходите от доки и выдумывайте что-то от себя. Ну так себе архитектура получается. Теперь делю всё посто на модули и не испытываю вообще проблем, так что мне не понравилось. Посмотрите на nestjs, вот это архитектура. А fsd скорее методология. Для меня лично fsd сегодня даёт больше минусов, чем существенных плюсов.
@dimeliora
@dimeliora 9 месяцев назад
Сами авторы FSD это именно так и называют - методология) Nestjs - да-а, сразу хочется пойти и ангуляр пощупать)
@yandexroot
@yandexroot 9 месяцев назад
Поддержу. Первое, что сразу пришло в голову, когда увидел схему Евгения (Layers->Slices->Segments), то, что вот каждую такую схему (три колонки) положить в модули проекта (пример для телеком компании: Modules->(Hosting|Servers|Colocation|Domains)->Layers->Slices->Segments. И тогда будет конфета.
@izzei-1614
@izzei-1614 9 месяцев назад
FSD всегда позиционировалась как методология, а в несте псевдо-полная и корявая архитектура
@CJIu3eHb
@CJIu3eHb 9 месяцев назад
@@yandexroot Ну да, мне видится проблема с таким классическим FSD, что если надо выкинуть какой-то функционал (который можно объединить в модуль), то будешь выпиливать все это по всем слоям и слайсам.
@yandexroot
@yandexroot 9 месяцев назад
Да, именно.@@CJIu3eHb
@nikolaizarezako9344
@nikolaizarezako9344 9 месяцев назад
С пылу с жару! Красавчик. Только хотел вернуться к ФСД)
@adamburke4496
@adamburke4496 9 месяцев назад
По поводу Pages я бы добавил, что Pages желательно делать максимально плоским, то есть содержать минимум логики, соответственно, вся логика прописывается на уровнях ниже.
@user-hq3oz3tg8p
@user-hq3oz3tg8p 9 месяцев назад
Если почитать дискус в группе FSD, то так же находятся мнения, что наоборот pages должна быть связующим слоем из features/entities и жонглировать ими (а соотвественно содержать много логики в некоторых случаях) Ну и на практики, это бывает удобно и необходимо, так не нужно размазывать логику по features/entities и потом ее искать, так как она вот лежит в pages, который покрывают конкретный кейс
@adamburke4496
@adamburke4496 9 месяцев назад
@@user-hq3oz3tg8p для того что вы описали - есть widgets
@dim3143
@dim3143 8 месяцев назад
Я в презентации видел наоборот, нижние слои абстрактные, а app и pages уже содержат предметную логику приложения
@tototomay
@tototomay 9 месяцев назад
Если правильно понял, то внутри одной entity можно создавать сколько угодно ui компонентов и переиспользовать их друг - в друге. А от других entity нельзя использовать компоненты на том же уровне, верно?
@RowdyKGZ
@RowdyKGZ 9 месяцев назад
Лайк
@_oxios_
@_oxios_ 9 месяцев назад
16:58 Поиметь стандартизацию и комьюнити)) Без обид чисто орнуть написал) Спасибо за контент, жду еще ;-)
@wolfern5449
@wolfern5449 6 месяцев назад
Вот возникла интересная делема как подбирать архитектуру под full-stack архитектуру для приложения на next.js14 с серверными компонентами ? У нас там и и front и back все рядом, если есть у кого-нибудь решения, пишите!
@paromovevg
@paromovevg 6 месяцев назад
В следующем моём видосе в конце, будет прям оооочень много по этой теме. Получаетсся интересный вариант декомпозиции fullstack приложения
@sergeykadantsev9217
@sergeykadantsev9217 9 месяцев назад
А могут ли слайсы импортировать модельки других слайсов? Напимер есть слайс cart и соотвественно cartModel. Есть другой слайс order и orderModel которая содержит cartModel из слайса cart. Order не может существовать без cartModel. Ну не заводить же еще оду модельку orderCart.
@paromovevg
@paromovevg 9 месяцев назад
Есть 3 стандартных решения этого вопроса 1. Использовать id 2. Копипастить типы 3. Разрешить кросс импорт на уровне entities То что одно не может существовать без другого, не значит что они плотно связаны И даже если плотно связаны, может развязать? Тогда получится как раз более гибкая и расширяемая архитектура
@adamburke4496
@adamburke4496 9 месяцев назад
У меня по FSD есть вопрос, где держать UI-логику? То есть подразумевается, что она у нас в компонентах, но для чистоты, хотелось бы выносить UI-логику, то есть тут напрашивается что-то типа ViewModel, но в стандарте такого нет. Хотя по идее, никто же не запрещает создавать новые segments.
@paromovevg
@paromovevg 9 месяцев назад
Создавать костюмные сегменты можно, и даже нужно
@dim3143
@dim3143 8 месяцев назад
UI размазан по всему приложению. Каждый модуль например фичей, является автономной сущностью и содержит в себе ui, model(store) и api. То есть MVC существует не на уровне приложения, а на уровне каждого модуля
@ozevas
@ozevas 9 месяцев назад
Приветоси, оплатил курс. Когда придет сообщение в тг или почту?)
@paromovevg
@paromovevg 9 месяцев назад
Сегодня)
@1mpos380
@1mpos380 9 месяцев назад
Я так понимаю, что FSD для ангуляра не работает? Только не давно стал его изучать, и когда искал какие есть альтернативы fsd, для ангуляра ничего не нашёл
@paromovevg
@paromovevg 9 месяцев назад
В примерах в доке FSD есть пример на ангуляре. Но от себя утверждать не могу, потому что не работал на нем
@valikirr
@valikirr 2 месяца назад
архитектура она архитектура - она работает незавизимо от выбранного фреймворка на фронтенде. Использую сам на ангуляре fsd
@tototomay
@tototomay 9 месяцев назад
А как допустим использовать fsd в nuxt 3 проекте? По идее можно вместо components добавить слои features, entities, shared. pages остается неизменным, и в целом весь роутинг остается за обработкой nuxt'a. В остальных случаях ничего не мешает делить компоненты на слайсы. Да и вообще объединять логику, модели, ui в некий модуль - это очень логичный подход. Попробую чаще использовать в своих проектах.
@daveyjonesx
@daveyjonesx 9 месяцев назад
Можно pages офнуть и работать через defineNuxtPage
@rea1m_
@rea1m_ 9 месяцев назад
widgets - лучше не использовать, громоздкая фигня, которую трудно мейнтейнить) Только shared, entities, features, pages, app. Более уникальная логика будет находиться в сегментах под pages, при этом корневой файл страницы должен быть чистым, а что можно переиспользовать будет упаковано в более нижние слои)
@dim3143
@dim3143 8 месяцев назад
А я использую, мне нравятся) виджеты это по сути нарезанные куски разметки Pages содержащие в себе фичи и entities и shared
@yundon8182
@yundon8182 7 месяцев назад
иногда без них не обойтись
@biLLie_wiLLie
@biLLie_wiLLie 9 месяцев назад
Звучит как Вячеслав дизайн))
@ruslankozik1020
@ruslankozik1020 9 месяцев назад
Духаст Вячеславыч
@valikirr
@valikirr Месяц назад
хотел купить курс с зарубежной картой, но 5тыщ рублей, переводятся с какого-то рака в тенге (32тыщ), а это уже не 5 а 6 тыщ рублей. что за конвертация такая жесткая?
@paromovevg
@paromovevg Месяц назад
Платежная система такие комиссии ставит( добавил ещё способ оплаты в USD, там поменьше комиссия должна быть
@tanercoder1915
@tanercoder1915 2 месяца назад
Буду адвокатом дьявола, но как запутанная организация папок (читай fsd) вдруг стала архитектурой?
@paromovevg
@paromovevg 2 месяца назад
Архитектура - совокупность важнейших правил организации кода. Разделение кода по модулям (папка просто явный способ) Определение правил взаимодействий (запреты импортов) Архитектура на уровне приложения. Солюшн архитектура тоже архитектура просто на другом уровне
@puhd4167
@puhd4167 2 месяца назад
Новичков погружать в это легче не стало, слои не очевидны, шерд это ваще сюр
@user-nk8vh1eq7r
@user-nk8vh1eq7r 4 месяца назад
17:00 поиметь стандартизацию и комьюнити, ааххах, хорош
@loginov2030
@loginov2030 8 месяцев назад
Купил бы курс, если бы не аллергия на реакт
@popuguytheparrot_
@popuguytheparrot_ 9 месяцев назад
Клоун.
@saber1in
@saber1in 8 месяцев назад
в nextjs папка app занята cry..)
@Niachan666
@Niachan666 3 месяца назад
Ты случаем не водолей, 25 минут болтовни
@user-tl5js5ow3d
@user-tl5js5ow3d 21 день назад
Твое мнение никому не интересно тк ты дурачок, а парень красавчик, затронул ядро архитектурного подхода.
Далее
Викторина от МАМЫ 🆘 | WICSUR #shorts
00:58
НОВЫЕ ФЕЙК iPHONE 🤯 #iphone
0:37
Просмотров 353 тыс.