Россия

<h3>Техническое задание: Верстка сайта на tailwind</h3><h3>1. Введение</h3>Цель:  Окружение: NodeJS18, SailsJSСтек разработки: EJS, TailwindБюджет: 20000 рубУсловия:<ol><li>Проект будет опубликован под лицензией MIT</li><li>По вопросам архитектуры модуля консультироваться с представителем заказчика</li><li>Все данные будут доведены (бекенд разработчиком) во view в ejs.</li><li>Ручное функциональное тестирование будет проводится заказчиком</li><li>Сайт собирается в докер, и автоматически разворачивается для просмотра и тестирования заказчиком (Эта система настраивается заказчиком)</li><li>Разработка через систему версии кода git</li><li>Любые контроллеры и серверную логику будет делать представитель заказчика</li><li>Есть примеры реализованных проектов.</li><li>Есть возможность созвониться или задавать вопросы в чате по технической части и организации процесса</li><li>Есть тестировщик который будет выявлять баги во время разработки</li></ol> Требования:<ol><li>Предоставить полностью рабочие страницы, это включает разрендренные данные, JS скрипты на страницах.</li><li>Для фронтенд скриптов использовать VUE, REACT, VANILA JS (jquery не разрешается) это не SPA</li><li>Серверный рендеринг организовать на EJS</li><li>Установить SEO теги, и использовать общепринятые рекомендации по верстке для поисковой оптимизации</li><li>Для стилей использовать фреймворк tailwind</li><li>Предоставить рабочий докер контейнер</li><li>Все должно быть упаковано в webpack (есть пример)</li><li>Осуществить исправление багов после ручного тестирования. </li><li>Выбирать приоритет скорость над архитектурой, если есть возможность что то ускорить или упростить (даже ценой переделки дизайна) это надо предлагать.</li><li></li></ol> Описание:  Верстка для двух основных страница: Главная и Услуга.Для внутренних страниц будут переиспользовать блоки Главной и Услуги. Для нескольких блоков будут минимальные изменение (в описании указано какие именно) Запуск в 2 этапа:1й - Главная страница2й - Страница услуги и внутренние Ссылка на макет: <a href="https://www.figma.com/file/8Tt64CAbYDfyp7JoCfI32M/%D0%94%D0%BE%D0%B1%D1%80%D0%BE%D0%BC%D0%B5%D0%B4-%D0%B4%D0%BB%D1%8F-%D0%B2%D0%B5%D1%80%D1%81%D1%82%D0%BA%D0%B8?type=design&amp;node-id=0%3A1&amp;mode=design&amp;t=LYfFVsFF0MjF08l9-1">https://www.figma.com/file/8Tt64CAbYDfyp7JoCfI32M/%D0%94%D0%BE%D0%B1%D1%80%D0%BE%D0%BC%D0%B5%D0%B4-%D0%B4%D0%BB%D1%8F-%D0%B2%D0%B5%D1%80%D1%81%D1%82%D0%BA%D0%B8?type=design&amp;node-id=0%3A1&amp;mode=design&amp;t=LYfFVsFF0MjF08l9-1</a> Главная страница состоит из блоков:1. Хедер (одинаковый для всех страниц, далее в описании не фигурирует)- логотип кликабельный, при нажатии открывается главная страница- Кнопка записи отрывает сервис <a href="https://app.medesk.ru/">https://app.medesk.ru/</a>- Соцсеть если не указана в админке - не отображается соответствующая иконка2. FAB чат-бот (одинаковый для всех страниц, далее в описании не фигурирует)- При нажатии открывается телеграм, то есть на сайте окошка чата не будет3. Баннер- Кнопка записи отрывает сервис <a href="https://app.medesk.ru/">https://app.medesk.ru/</a>4. Услуги клиники- услуг может быть разное количество, если в последнем ряду 3шт, то располагается как и в предыдущих, если 2 или 1, то растягиваются от края до края блока (в дизайне будет показано в отдельном фрейме)- при нажатии на одну из услуг откроется текстовая страница (со списком ссылок)5. Популярные процедуры- карусель бесконечная, пролистывание по одному- кнопка "подробнее" открывает страницу услуги- кнопка "записатья" отрывает сервис <a href="https://app.medesk.ru/">https://app.medesk.ru/</a>6. Акции- акций в блоке показывается 5 штук, но по факту может быть больше, поэтому при обновлении страницы показывать разные акции- кнопка "подробнее" открывает страницу акции- кнопка "записатья" отрывает сервис <a href="https://app.medesk.ru/">https://app.medesk.ru/</a>- кнопка "все акции" открывает разводящую страницу акций7. Статьи- статей в блоке показывать 3 последние статьи- кнопка "читать все статьи" отрывает разводящую страницу статей8. Сертификат- кнопка "подробнее" открывает страницу описания сертификата9. Специалисты- показаны 3 первых специалиста, карусель бесконечная, пролистывание по одному- кнопка "подробнее" открывает страницу акции- кнопка "записатья" отрывает сервис <a href="https://app.medesk.ru/">https://app.medesk.ru/</a>10. Отзывы- верхний ряд кнопок - это переход на сервисы с отзывами- нижний ряд карточек отзывов - это текст добавляемый через админку- кнопка "читать полностью" в карточках открывает сервис отзывов- карусель бесконечная, пролистывание по одному, пролистываются только карточки отзывов, кнопки (продокторов, гугл, яндекс) зафиксировані11. Форма записи- оба поля обязательны для заполнения- после отправки формы показать надпись, что отправлена (по макету)12. Футер (одинаковый для всех страниц, далее в описании не фигурирует)- логотип кликабельный, при нажатии открывается главная страница- Соцсеть если не указана в админке - не отображается соответствующая иконка- все ссылки под линией открывают соответствующие текстовые страницыСтраница Услуги состоит из блоков:1. Заголовок2. Баннер3. Текстовый блок4. Кнопка записи на прием- отрывает сервис <a href="https://app.medesk.ru/">https://app.medesk.ru/</a>5. Показания к процедуре- Открыт только первый блок, при нажатии на другие меняется текст открытого блока- Если блоков нечетное количество, то в последнем ряду растягивается от края до края (показано в макете)6. Преимущества процедуры7. Фото и видео 8. Стоимость процедур9. Форма записи- аналогично главной10. Специалисты - аналогично главной11. Часто задаваемые вопросы- аналогично блоку показания к процедуре12. Отзывы- аналогично главной13. О клинике14. Фото клиники14. Преимущества клиники15. Лицензии16. Карта Внутренние страницы:1. О нас -  состоит из блоков из страницы Услуга- О клинике- Фото клиники- Преимущества клиники- Лицензии- Карта2. Разводящая для услуг - состоит из блоков из страницы Услуга- Заголовок- Баннер- Блок с редактируемым текстом(условно назовем эту страницу текстовой)3. Специалисты - состоит из блока из страницы Услуга- Специалисты ( не использовать прокрутку, показать все карточки на одной странице. если карточек в последнем ряду меньше трех, то выравнивать по левой стороне)4. Сертификат - состоит из блоков из страницы Услуга- Заголовок- Баннер- Блок с редактируемым текстом5. Разводящая страница Акции - состоит из блока главной страницы- Акции (левая карточка не растягивается на две строки. если карточек в последнем ряду меньше трех, то выравнивать по левой стороне)6. Разводящая страница Статьи - аналогично разводящей Акции- отличие карточек в отсутствии описания и одна кнопка "подробнее"7. Отзывы - состоит из блока главной страницы- Отзывы 8. Контакты - состоит из блока из страницы Услуга- Контакты (добавить заголовок)

<h3>Техническое задание: Верстка сайта на tailwind</h3><h3>1. Введение</h3>Цель:  Окружение: NodeJS18, SailsJSСтек разработки: EJS, TailwindБюджет: 20000 рубУсловия:<ol><li>Проект будет опубликован под лицензией MIT</li><li>По вопросам архитектуры модуля консультироваться с представителем заказчика</li><li>Все данные будут доведены (бекенд разработчиком) во view в ejs.</li><li>Ручное функциональное тестирование будет проводится заказчиком</li><li>Сайт собирается в докер, и автоматически разворачивается для просмотра и тестирования заказчиком (Эта система настраивается заказчиком)</li><li>Разработка через систему версии кода git</li><li>Любые контроллеры и серверную логику будет делать представитель заказчика</li><li>Есть примеры реализованных проектов.</li><li>Есть возможность созвониться или задавать вопросы в чате по технической части и организации процесса</li><li>Есть тестировщик который будет выявлять баги во время разработки</li></ol> Требования:<ol><li>Предоставить полностью рабочие страницы, это включает разрендренные данные, JS скрипты на страницах.</li><li>Для фронтенд скриптов использовать VUE, REACT, VANILA JS (jquery не разрешается) это не SPA</li><li>Серверный рендеринг организовать на EJS</li><li>Установить SEO теги, и использовать общепринятые рекомендации по верстке для поисковой оптимизации</li><li>Для стилей использовать фреймворк tailwind</li><li>Предоставить рабочий докер контейнер</li><li>Все должно быть упаковано в webpack (есть пример)</li><li>Осуществить исправление багов после ручного тестирования. </li><li>Выбирать приоритет скорость над архитектурой, если есть возможность что то ускорить или упростить (даже ценой переделки дизайна) это надо предлагать.</li><li></li></ol> Описание:  Верстка для двух основных страница: Главная и Услуга.Для внутренних страниц будут переиспользовать блоки Главной и Услуги. Для нескольких блоков будут минимальные изменение (в описании указано какие именно) Запуск в 2 этапа:1й - Главная страница2й - Страница услуги и внутренние Ссылка на макет: <a href="https://www.figma.com/file/8Tt64CAbYDfyp7JoCfI32M/%D0%94%D0%BE%D0%B1%D1%80%D0%BE%D0%BC%D0%B5%D0%B4-%D0%B4%D0%BB%D1%8F-%D0%B2%D0%B5%D1%80%D1%81%D1%82%D0%BA%D0%B8?type=design&amp;node-id=0%3A1&amp;mode=design&amp;t=LYfFVsFF0MjF08l9-1" rel="nofollow noopener noreferrer" target="_blank">https://www.figma.com/file/8Tt64CAbYDfyp7JoCfI32M/%D0%94%D0%BE%D0%B1%D1%80%D0%BE%D0%BC%D0%B5%D0%B4-%D0%B4%D0%BB%D1%8F-%D0%B2%D0%B5%D1%80%D1%81%D1%82%D0%BA%D0%B8?type=design&amp;node-id=0%3A1&amp;mode=design&amp;t=LYfFVsFF0MjF08l9-1</a> Главная страница состоит из блоков:1. Хедер (одинаковый для всех страниц, далее в описании не фигурирует)- логотип кликабельный, при нажатии открывается главная страница- Кнопка записи отрывает сервис <a href="https://app.medesk.ru/" rel="nofollow noopener noreferrer" target="_blank">https://app.medesk.ru/</a>- Соцсеть если не указана в админке - не отображается соответствующая иконка2. FAB чат-бот (одинаковый для всех страниц, далее в описании не фигурирует)- При нажатии открывается телеграм, то есть на сайте окошка чата не будет3. Баннер- Кнопка записи отрывает сервис <a href="https://app.medesk.ru/" rel="nofollow noopener noreferrer" target="_blank">https://app.medesk.ru/</a>4. Услуги клиники- услуг может быть разное количество, если в последнем ряду 3шт, то располагается как и в предыдущих, если 2 или 1, то растягиваются от края до края блока (в дизайне будет показано в отдельном фрейме)- при нажатии на одну из услуг откроется текстовая страница (со списком ссылок)5. Популярные процедуры- карусель бесконечная, пролистывание по одному- кнопка "подробнее" открывает страницу услуги- кнопка "записатья" отрывает сервис <a href="https://app.medesk.ru/" rel="nofollow noopener noreferrer" target="_blank">https://app.medesk.ru/</a>6. Акции- акций в блоке показывается 5 штук, но по факту может быть больше, поэтому при обновлении страницы показывать разные акции- кнопка "подробнее" открывает страницу акции- кнопка "записатья" отрывает сервис <a href="https://app.medesk.ru/" rel="nofollow noopener noreferrer" target="_blank">https://app.medesk.ru/</a>- кнопка "все акции" открывает разводящую страницу акций7. Статьи- статей в блоке показывать 3 последние статьи- кнопка "читать все статьи" отрывает разводящую страницу статей8. Сертификат- кнопка "подробнее" открывает страницу описания сертификата9. Специалисты- показаны 3 первых специалиста, карусель бесконечная, пролистывание по одному- кнопка "подробнее" открывает страницу акции- кнопка "записатья" отрывает сервис <a href="https://app.medesk.ru/" rel="nofollow noopener noreferrer" target="_blank">https://app.medesk.ru/</a>10. Отзывы- верхний ряд кнопок - это переход на сервисы с отзывами- нижний ряд карточек отзывов - это текст добавляемый через админку- кнопка "читать полностью" в карточках открывает сервис отзывов- карусель бесконечная, пролистывание по одному, пролистываются только карточки отзывов, кнопки (продокторов, гугл, яндекс) зафиксировані11. Форма записи- оба поля обязательны для заполнения- после отправки формы показать надпись, что отправлена (по макету)12. Футер (одинаковый для всех страниц, далее в описании не фигурирует)- логотип кликабельный, при нажатии открывается главная страница- Соцсеть если не указана в админке - не отображается соответствующая иконка- все ссылки под линией открывают соответствующие текстовые страницыСтраница Услуги состоит из блоков:1. Заголовок2. Баннер3. Текстовый блок4. Кнопка записи на прием- отрывает сервис <a href="https://app.medesk.ru/" rel="nofollow noopener noreferrer" target="_blank">https://app.medesk.ru/</a>5. Показания к процедуре- Открыт только первый блок, при нажатии на другие меняется текст открытого блока- Если блоков нечетное количество, то в последнем ряду растягивается от края до края (показано в макете)6. Преимущества процедуры7. Фото и видео 8. Стоимость процедур9. Форма записи- аналогично главной10. Специалисты - аналогично главной11. Часто задаваемые вопросы- аналогично блоку показания к процедуре12. Отзывы- аналогично главной13. О клинике14. Фото клиники14. Преимущества клиники15. Лицензии16. Карта Внутренние страницы:1. О нас -  состоит из блоков из страницы Услуга- О клинике- Фото клиники- Преимущества клиники- Лицензии- Карта2. Разводящая для услуг - состоит из блоков из страницы Услуга- Заголовок- Баннер- Блок с редактируемым текстом(условно назовем эту страницу текстовой)3. Специалисты - состоит из блока из страницы Услуга- Специалисты ( не использовать прокрутку, показать все карточки на одной странице. если карточек в последнем ряду меньше трех, то выравнивать по левой стороне)4. Сертификат - состоит из блоков из страницы Услуга- Заголовок- Баннер- Блок с редактируемым текстом5. Разводящая страница Акции - состоит из блока главной страницы- Акции (левая карточка не растягивается на две строки. если карточек в последнем ряду меньше трех, то выравнивать по левой стороне)6. Разводящая страница Статьи - аналогично разводящей Акции- отличие карточек в отсутствии описания и одна кнопка "подробнее"7. Отзывы - состоит из блока главной страницы- Отзывы 8. Контакты - состоит из блока из страницы Услуга- Контакты (добавить заголовок)

Ваня guest_1701322850706

Сверстать на ejs + tailwind сайт по макету из фигмы