CMPI Редизайн

#верстка #frontend #backend #octoberCMS #laravel

https://cmp-i.com/

В разработку поступил запрос на редизайн главной. Это довольно большой проект- портал со специалистами в области коучинга/менторинга/психологии + личный кабинет. Большая кодовая база как на фронтенде, так и на бэкенде. Естественно одной версткой главной не обойтись, тк это затрагивает основной пул стилей всего сайта. К тому же сложность заключалась и в том, чтобы пересобрать не только стили, но и html фронтенд, местами js и бэкенд.

Проект большой, но встала загвоздка в том, что для него отсутствовала сборка. Точнее она была где-то на ранних этапах, но по гиту так и не получилось ее отыскать. И по итоге имелась небольшая каша из css файлов и основного style.css на 26000 строк кода.

Сборка фронтенда

Так как с фронтендом было совсем все не очень, я взял на себя волевое решение - перебрать фронтенд, сделать адекватную сборку. Так стили разбились на составляющие:


По итогу получилась более логичная структура, с которой можно было работать. А 26000 перешли в 16000. Но это я еще не затронул фронтенд кабинета.

Были переработаны все кнопки сайта. Их было большое количество, как и накопившихся мусорных стилей. От больше части я избавился, переписал основные.

Были переработаны Owl-карусели. Их было достаточное количество. Много стилей, старых и лишних. Еще был нюанс, что к каруселям прилагались табы. Это фильтры контента, который брался по ajax, а потом вновь карусель пересобиралась. Была переосмыслена и упорядочено вся механика, стили, js, шаблоны октобер и html.

Так же местами значительно сократил лишние html обертки для элементов. Так были места, где вместо 2-3 ех уровней вложенности, оставалась 1-ин.

Затронутые страницы

Все бы ничего ;), но естественно переработка фронтенда затронула другие страницы. Я надеялся на лучшее, но впринципе получилось неплохо. Было затронуто 10-15% изменений на других страницах. Пришлось уделить 2 дня на редизайн и восставление элементов других страниц. Так как не хотелось это делать быстро и плодить быстрый код, решил уделить нормально времени на переработку остальных страниц как html так и фронтенд.

Все было успешно поправлено, хоть и с недооцененной переработкой в 2 дня.

По гиту за 4 коммита скопилось примерно 100 000 измененных строк кода и 160 изменений в файлах.
Понятное дело что из 100 000 процентов 80 это переработанные файлы плагинов, старые css и множество удаленных файлов как css так и html. Ну и файлов изменных примерно в порядке 50-ти. Но это просто примерных условный показатель проделанной работы с кодовой базой.

Старый дизайн

cpmi-old.pdf

Новый дизайн

Exception

Error

We're sorry, but an unhandled error occurred. Please see the details below.

file_put_contents(/home/admin/web/alex.dzen-code.ru/public_html/storage/framework/cache/11/de/11de31e1eabb2682cf62ee9c9ccb0630f1019006): failed to open stream: Permission denied

/home/admin/web/alex.dzen-code.ru/public_html/vendor/laravel/framework/src/Illuminate/Filesystem/Filesystem.php line 122

     * @param  string  $contents
     * @param  bool  $lock
     * @return int
     */
    public function put($path, $contents, $lock = false)
    {
        return file_put_contents($path, $contents, $lock ? LOCK_EX : 0);
    }
 
    /**
     * Prepend to a file.
     *
     * @param  string  $path

Stack trace

# Called Code Document Line
30 file_put_contents(…) ~/vendor/laravel/framework/src/Illuminate/Filesystem/Filesystem.php 122
29 Illuminate\Filesystem\Filesystem->put(…) ~/vendor/october/rain/src/Filesystem/Filesystem.php 217
28 October\Rain\Filesystem\Filesystem->put(…) ~/vendor/laravel/framework/src/Illuminate/Cache/FileStore.php 65
27 Illuminate\Cache\FileStore->put(…) ~/vendor/laravel/framework/src/Illuminate/Cache/Repository.php 191
26 Illuminate\Cache\Repository->put(…) ~/vendor/october/rain/src/Halcyon/MemoryRepository.php 61
25 October\Rain\Halcyon\MemoryRepository->put(…) ~/vendor/laravel/framework/src/Illuminate/Cache/Repository.php 323
24 Illuminate\Cache\Repository->remember(…) ~/vendor/laravel/framework/src/Illuminate/Cache/CacheManager.php 304
23 Illuminate\Cache\CacheManager->__call(…) ~/vendor/october/rain/src/Database/QueryBuilder.php 158
22 October\Rain\Database\QueryBuilder->getCached(…) ~/vendor/october/rain/src/Database/QueryBuilder.php 121
21 October\Rain\Database\QueryBuilder->getDuplicateCached(…) ~/vendor/october/rain/src/Database/QueryBuilder.php 92
20 October\Rain\Database\QueryBuilder->get(…) ~/vendor/laravel/framework/src/Illuminate/Database/Eloquent/Builder.php 481
19 Illuminate\Database\Eloquent\Builder->getModels(…) ~/vendor/laravel/framework/src/Illuminate/Database/Eloquent/Builder.php 465
18 Illuminate\Database\Eloquent\Builder->get(…) ~/vendor/laravel/framework/src/Illuminate/Database/Concerns/BuildsQueries.php 77
17 Illuminate\Database\Eloquent\Builder->first() ~/modules/system/behaviors/SettingsModel.php 114
16 System\Behaviors\SettingsModel->getSettingsRecord() ~/modules/system/behaviors/SettingsModel.php 76
15 System\Behaviors\SettingsModel->instance() ~/modules/system/behaviors/SettingsModel.php 135
14 System\Behaviors\SettingsModel->get(…)
13 call_user_func_array(…) ~/vendor/october/rain/src/Extension/ExtendableTrait.php 414
12 October\Rain\Database\Model->extendableCall(…) ~/vendor/october/rain/src/Database/Model.php 647
11 October\Rain\Database\Model->__call(…) ~/vendor/laravel/framework/src/Illuminate/Database/Eloquent/Model.php 1489
10 Illuminate\Database\Eloquent\Model::__callStatic(…) ~/modules/system/models/EventLog.php 37
9 System\Models\EventLog::useLogging() ~/modules/system/ServiceProvider.php 286
8 System\ServiceProvider->System\{closure}(…)
7 call_user_func_array(…) ~/vendor/october/rain/src/Events/Dispatcher.php 233
6 October\Rain\Events\Dispatcher->dispatch(…) ~/vendor/laravel/framework/src/Illuminate/Log/Writer.php 295
5 Illuminate\Log\Writer->fireLogEvent(…) ~/vendor/laravel/framework/src/Illuminate/Log/Writer.php 201
4 Illuminate\Log\Writer->writeLog(…) ~/vendor/laravel/framework/src/Illuminate/Log/Writer.php 114
3 Illuminate\Log\Writer->error(…) ~/vendor/laravel/framework/src/Illuminate/Support/Facades/Facade.php 221
2 Illuminate\Support\Facades\Facade::__callStatic(…) ~/vendor/october/rain/src/Foundation/Exception/Handler.php 66
1 October\Rain\Foundation\Exception\Handler->report(…) ~/vendor/laravel/framework/src/Illuminate/Foundation/Bootstrap/HandleExceptions.php 81
0 Illuminate\Foundation\Bootstrap\HandleExceptions->handleException(…)