R50 9671e157871d9b4a8ffa06ea2edd8401
Frontend-разработка

Catalyst

Добавлено 21 июн 2022 в 13:03
Сайт для консалтингового агентства Разработка под ключ многостраничного сайта. Дизайн в стиле glassmorphism, высокая производительность, возможность самостоятельного создания новых страниц через cms, прием заявок на почту

Посмотреть Наполняется заказчиком

Дизайн Перед мной стояла задача сделать дизайн одновременно современным и строгим. Одним из последних трендов является glassmorphism.

Особенность в том, что элементы интерфейса похожи на матовые стекла, то есть просвечивают ниже лежащий контент.

Для сохранения сдержанности и премиальности цветовая гамма была сокращена вплоть до двух цветов: оружейный металл и изумруд.

Разработка Было важно набрать высокие показатели в метрике Google Lighthouse. Для их достижения я выбрал фреймворк next.js. Он позволяет реализовать статическую генерацию (SSG). То есть при изменении контента происходит сборка, которая преобразует js код в html, из-за чего достигается очень высокая скорость загрузки. Для данного кейса такой подход максимально релевантен, так как контент меняется не часто.

Немного бекенда Next.js также предоставляет возможность писать серверную логику прямо в клиенте. Конечно для больших проектов это не совсем уместно. Но написать немного логики в короткий срок самое то. В данном проекте эта функция была использована при написания api для отправки электронной почты. Нужно это для сборка заявок на корпоративную почту.

Управление контентом Заказчик хотел изменять контент самостоятельно, для этого я выбрал graphcms. Она обладает приятным интерфейсом и не требует отдельного хостинга. Но при этом предоставляет и бесплатный тариф, которого более чем хватило для данного проекта.

С помощью cms можно управлять как спектром услуг, который отображается на главной странице, так и страничным наполнением впринципе.








Ad1a3e3c96 C53f26b907 43f74faa61