Пет проект для джуна-фронта? Хватит ли?

Question

[VladilenOk]

Всем привет, хочу для своего портфолио написать вот такой вот магазин -
https://www.figma.com/file/v2LfyORc7rTeBhUFn3y9EY/...

Из-задач которые себе поставил > сперва верстаю, потом уже накидываю на react(ssr пока не затрагиваю) поэтому беру "голый" реакт, а не next. Бэк хочу сперва посадить на firebase, а потом уже перенести на nest(но это после того как будет готово все на 100%).

Возникли вопросы:

1. Будет ли лучше, если сверстаю всё без использования библиотек вроде Bootsrap, или Material? Или для потенциального работодателя в принципе без разницы использую ли я "готовую верстку" из компонентного набора. С самой версткой сложностей нет, поэтому хотел написать всё с нуля, что бы показать еще и навыки отрисовки шаблона.

2. По мимо фронта который будет выдавать данные, хочу реализовать простую админку с логикой > аутентификация - добавление товара, добавление работы в портфолио и прочее, но непонятно одно, в макете довольно много описывающего текста, который идет в виде заглушек. Как делают на "работе", просто хардкод текста в код? Или этот текст тоже заносится в базу данных?
Например:


3. Нужен ли на нем ТС? (С ТС знаком очень поверхностно на уровне базовой типизации, джейнериков). Боюсь затронув ТС утонуть в нем, и написать еще больше говнокода, чем вышло бы без него.

4. Будет ли это хорошим проектом для новичка что бы показать работодателю навыки, или магазины это избитая тема, и для того что бы вылезти из конкуренции брать что-то более сложное?

Comments

[FeST1VaL]

Это же макет набросок как по мне... так что верстать его такое себе... тут нету цветового оформления. Тк скорее всего это набросок

1. мне кажется без разницы.
2. Я бы заносил в базу. По сути делаешь чтобы все можно было редактировать)
3. ...
4. Мне кажется без разницы. По сути могут посмотреть почему бы и нет...Но от вопросов все равно не отделаетесь и скорее всего тестовое задание все равно дадут)

[WbICHA]

А где, собственно, фронт? Кроме наброска макета сайта я ничего не вижу.

[VladilenOk]

FeST1VaL, А как в базе тогда всё это записывается? Допустим портфолио - коллекция данных с объектами, юзеры - тоже самое, как правильно в базе оформляется такой вот пример который выше? Отдельно создавать под каждую секцию коллекцию вида
interior_steps = [ {id: 1, title: 'dfdfdfdf' , description: 'kfjfkjkfjkfj'} , {id: 2, title: 'dfdfdfdf' , description: 'kfjfkjkfjkfj'} , ]

Так?

[VladilenOk]

WbICHA, https://www.figma.com/file/v2LfyORc7rTeBhUFn3y9EY/...

Ссылка было неправильная, в figma был и прототип и верстка.

[VladilenOk]

FeST1VaL, Вопросы в принципе не смущают, да и тех задание. Просто что бы прорваться через поток откликов, нужно хоть что-то написать объемное. И решил как раз магазин, что бы работодатель мог глянуть код, а далее уже интервью и задание на их усмотрение. Т.к мне кажется без пет проекта будет сложнее пробиться через поток потенциальных нанимателей.

[FeST1VaL]

VladilenOk, ну что то типо того. Почему бы и нет... только счетчик отдельный) и добавил бы show какой то) вдруг будут скрывать какие то пункты итд)

Ну в любом случае наличие портфолио это плюс)

[Михаил Кочетков]

1. Зависит от того, куда Вы планируете идти. Приложения бывают разные и условия в них тоже.
Например, есть приложение, которое представляет из себя дашборд компании для внутреннего учета статистик и отображения сотрудникам. Предоставляет какие-то автоматизированные возможности документооборота и т. д. В общем, сосредоточено на бизнес задачах. Скорее всего на таком проекте дизайнера не будет, каких-то сложный визуалов тоже, а вот сделать быстро и дешево определенно руководство захочет. Поэтому там во главу угла встанут готовые UI библиотеки и на собесе Вас захотят на знание этого дела проверить.
Другой вариант, какой-то стартап направленный на публичность и клиентов с крутым дизайнером, который сделал то, что еще никто и никогда не делал. Модифицировать в таком случае готовые компоненты будет не рентабельно, поэтому для такого проекта Вас будут проверять на умение кастомной верстки.
Так же могут на какой-то проект искать человека, который бы вел библиотеку UI компонентов непосредственно для проектов компании. Там тоже нужно будет уметь верстать, но еще важнее - нужно будет хорошо знать как такие библиотеки строятся.
Так что в итоге - как Вам больше хочется, а тестовое все равно будете делать)
2. Если текст меняется раз в полгода, его проще захардкодить и предкомпилировать (Gatsby). Обычно на лендингах это так. Менять сезонные фразы и так далее проще просто на самом коде лендинга, а не тратить на это ресурсы сервера и базы. Плюс, не будет возникать ситуации, что текст не подгрузился) Как именно реализовывать - вариантов много. Я порекомендовал бы сразу писать бэк на NestJS, если вы с ним знакомы. NestJS имеет много чего готового, так что трудностей возникнуть не должно. Однако пишите сначала либо бэк, либо фронт. Как говорится, большого слона стоит жрать по частям)
3. TypeScript нужен всегда, привыкайте это брать за правило. Есть компании и команды, которые принципиально разрабатывают на JS, но это их дело и, возможно, у них есть на это причина. Для себя часто использую аналогию в плане JS, что он подобен ASM. По сути это низкоуровневый язык браузера. Однако зачем на нем писать? TS помогает программисту писать качественный и самодокументируемый код. Так же вносит определенный элемент строгости, потому что часто в большом проекте можно забыть и заслать что-то туда, куда это засылать не нужно. Плюс не забываем о маловажном, но полезном факте - TS дает возможность IDE предоставлять качественный статический анализ кода. Отсюда и автодополнения, и вспомогательные проверки и так далее. Например, поменяли модель, которая приходит с бэка. Изменили ее тип на фронте. А компилятор Вас сразу уведомит, что такой-то компонент у Вас теперь работает некорректно. Самодокументирование кода позволяет меньше запоминать и больше смотреть. Забыли, что принимает на вход какая-то функция? Не нужно смотреть в ее содержимое, достаточно посмотреть на тип аргумента. В JS для этого приходится документировать каждую функцию и описывать типы в комментариях) В целом, тут сказать можно еще много, но в основном TS обусловлен бизнес требованиями, а не какой-то производительностью и прочее. А работать приходится именно с бизнесом) К тому же, если Вы освоите TS - писать на JS тоже станет проще)
4. Работодатель всегда ищет человека на какую-то задачу. Никто не станет искать сотрудника просто так. А соответственно и тестировать Вас будут именно на эту задачу. Едва ли это будет интернет-магазин) Портфолио позволит лишь сложить первое впечатление о кандидате и понять, чем он увлекается. Поэтому лучше делать небольшие и тематические проекты, к которым лежит душа и про которые Вы можете что-то интересное рассказать. Разрабатывать огромный никому не нужный интернет-магазин это отчасти просто тратить время. Почитайте вакансии, попробуйте найти какие-то тестовые. Обычно они направлены на какую-то конкретную идею. Постарайтесь эту идею реализовать. Главное не попасться на тестовое, которое составил HR. Тогда оно будет просто типовое или скопированное с какого-то типового)

В остальном, удачи Вам в ваших начинаниях. Всегда лучше делать что-то, чем не делать ничего)

P. S. Извиняюсь за очепятки)

[Дима Долготер]

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

[VladilenOk]

Дима Долготер, Спасибо за совет))

Answer 1

[acwartz]

1. Будет ли лучше, если сверстаю всё без использования библиотек вроде Bootsrap, или Material? Или для потенциального работодателя в принципе без разницы использую ли я "готовую верстку" из компонентного набора. С самой версткой сложностей нет, поэтому хотел написать всё с нуля, что бы показать еще и навыки отрисовки шаблона.

ну тогда у вас тут полноценный пункт 0 - создать UI-фреймворк с блэкджеком и гуслями. Надо ли говорить что он должен хорошо работать везде?
В работе над 1м шагом вы будете постоянно возвращаться в нулевой и все к переписывать, усложнять и дробить, т.к. будет нужно больше возможностей на первом этапе.

Если хотите что-то нормальное, забейте на материал и buttstrap, и возьмите UIKit

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

Да, в базе данных. Разметка опускается на уровень т.н. BBCode'ов, за которыми стоит красивая вставка теста в любой стилистики UI где на этапе помещения текста в UI, все BB-коды заменяются на элементы UI.
Таким образом потом можно заменить стиль на сайте и оформление текстов не страдает т.к. от юзера скрыты все аспекты CCS.

3. Нужен ли на нем ТС?

А почему нет?

4. Будет ли это хорошим проектом для новичка что бы показать работодателю навыки, или магазины это избитая тема, и для того что бы вылезти из конкуренции брать что-то более сложное?

Ну напишите вы свой как-то поделку на энтерпрайз проект через 5 лет, и чего? Тот же магазин можете допиливать и допиливать, зачем сразу лезть в то что не потяните изначально?