@Alex_87

Как структурировать код, архитектура проекта?

Добрый вечер! Хочу поднять вопрос, который наверняка встаёт перед многими, кто
выучил JS на уровне решении задач средней сложности, после чего задумываются о
рефакторинге кода и его архитектуре, поскольку тот же JS код находиться ибо в одном
файле или в лучшем случае разден по разным файлам

1) Проблема в том, что многие курсы рассказывают о различных web терминах, в
результате чего возникает каша, поскольку не знаешь где и что применять
Возьмём патерны проектирования, MVС, модуль и так далее. Насколько я понимаю они
и решают проблему разбивки кода...
И как понять, что такое PWA и MPA, какие стеки технологии используется в том или
ином случае? Как они укладываются в темы с патернами или вообще это всё о разном

2) Скажем, есть задача выполнить следующий проект:
https://htmlacademy.ru/skills/online-store/payment
Как подходить к оформлению кода, если мы не используем фреймворк Vue или иной...

3) В одном из видео, Дмитрий Лаврик сказал, что бэкенд программисты в последнее
время создают API для сайтов. Так намного проще создавать бэк... А Как создаются ими
подобные API? Можно ли сказать, что тем самым бэк програмисты не создают базы данных
с таблицами? Как вообще можно проанаизировать сайт и создать подобные таблицы, как
происходит этот процесс?

4) Можно ли при помощи VUE создать fullstack приложения или без создания той же
структуры базы данны никак?

Прошу скинуть информацию, статьи и помочь советом!
  • Вопрос задан
  • 125 просмотров
Решения вопроса 1
bootd
@bootd
Гугли и ты откроешь врата знаний!
Проблема в том, что многие курсы рассказывают о различных web терминах, в
результате чего возникает каша, поскольку не знаешь где и что применять
Возьмём патерны проектирования, MVС, модуль и так далее. Насколько я понимаю они
и решают проблему разбивки кода...
В текущем, современном этапе разработки такими паттернами почти не пользуются. Сейчас у нас есть import/export - вот он ваш, нативный модуль. В остальном, просто положитесь на фреймворк.

Как подходить к оформлению кода, если мы не используем фреймворк Vue или иной...

Любой клиентский фреймворк - это уже своего рода архитектура, просто нужно следовать в начале пути общепринятым правилам. В отношении vue почитать про best practices. В этой папке компоненты, в этой папке сервисы, в этой папке утилиты, в этой папке типы и т.п. Разделяйте макет на части. Отдельный компонент фильтра, который состоит из множества компонентов самого фильтра, чекбокс фильтр, фильтр диапазона и т.п. Отдельно компонент товара и т.д.

Дмитрий Лаврик сказал, что бэкенд программисты в последнее
время создают API для сайтов. Так намного проще создавать бэк

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

Можно ли при помощи VUE создать fullstack приложения или без создания той же
структуры базы данны никак?

На vue нельзя написать фулстек, как и на react. Это браузерные фреймворки(клиентские), предназначенные для работы в браузере.

База данных - это всего лишь термин, который говорит, что есть какое-то хранилище данных. Им может быть любая из популярных БД или просто файлик(или множество файликов). Просто где лежат записи. Любое ПО, в котором вы можете редактировать или создавать записи, должно иметь базу данных, иначе никак.

выучил JS на уровне решении задач средней сложности

Ну вам не кажется что из вышеперечисленного вами, вы не выучили js. Средней уровень сложности(хотя что можно считать "средним уровнем сложности" - это ещё вопрос), это наверно где-то джун+. А такие джуны уже умеют пользоваться инструментами.

Личный мой вывод:
Вы как и все начинающие окунулись в болото под названием js. Где царит хаос и анархия, когда можно всё, но не понятно как. У меня главный вопрос к таким людям, а зачем вам на данном этапе вашего развития "всё"? Ну вот серьёзно, зачем? Зачем вам сейчас знать, как устроена БД, как правильно создавать таблицы, как правильно создавать связи в них, зачем микросервисы, зачем, о госпади микрофронты, SSR, PWA, FullStack, Nodejs, Docker, Kubernetes, webpack, vite, TypeScript и прочая херня, которой полон мир фронтенда. Зачем вам всё это, если вы сами не можете ответить на этот вопрос. Зачем вам сейчас знать, как это работает. Если вы просто сайтик с чекбоксиками не можете сделать. Т.е. простая фильтрация html кода. Возьмите какую нибудь публичную rest api с фейковыми данными для своей песочницы и постройте маломальский сайтик с фильтром. Зачем вам фулстек? Почувствовать себя гением разработки? Забудьте про кучу не понятных терминов, просто выкиньте их из головы.
Зачем вам вообще vue или реакт, или им подобные? У вас в голове хоть есть понимание, зачем придуманы эти штуки, какую задачу то они призваны решать? Почему все так "дрочат" на эти SPA? Почему +- 90% вакансий фронта требуют знания SPA фреймворков? Каждый инструмент призван решать какую-то задачу, пока вы не поймёте, почему вам реально нужен этот инструмент, не трогайте его, пускай лежит до лучших времён.

Просто возьмите js или хрен с ним, возьмите vue, сделайте внутри ajax запрос, получите данные, отобразите их. Где в этих словах какие-то особенные или сложные термины? Вам идиоты напихали в голову сложных конструкций, вот вы и мучаетесь. Упростите себе жизнь, выкиньте из головы всякую хрень. Просто сядьте и пишите, не думая ни о чём! Просто берёте vue, разворачиваете как в доке написано и готово, работайте.
А когда сделаете, перекурите, а потом сядьте и посмотрите на своё творение и подумайте, как можно улучшить, возможно упростить. Не ждите быстрого успеха!

КОВАТЬ, КОВАТЬ И ЕЩЁ РАЗ КОВАТЬ! Только так можно научиться.

Никакая архитектура вас не спасёт, пока вы сами не поймете, а зачем она мне. Вот пока у вас нет понимания, что мне нужна какая-то там архитектура, т.к. вы в этот момент поняли, какую проблему вам нужно решить, вот только тогда и начинайте что-то думать в эту сторону. К этому моменту, у вас уже будет что-то структурированное в голове и понимание.
Ответ написан
Комментировать
Пригласить эксперта
Ответы на вопрос 1
Ranwise
@Ranwise
3. API это разделение фронтед и бекенд, и бекендер создает базу или использует любое другое хранилище
4. Vuejs это фронтенд, но есть облачные базы типа фаербейса, возможно с ними можно...
Ответ написан
Комментировать
Ваш ответ на вопрос

Войдите, чтобы написать ответ

Войти через центр авторизации
Похожие вопросы
30 апр. 2024, в 16:03
2500 руб./за проект
30 апр. 2024, в 15:24
3000 руб./за проект
30 апр. 2024, в 15:11
500 руб./в час