Местоположение
Россия, Ставропольский край, Пятигорск

Достижения

Все достижения (1)

Наибольший вклад в теги

Все теги (9)

Лучшие ответы пользователя

Все ответы (23)
  • Есть ли какие нибудь недочеты по сверстанной странице?

    sasha-hohloma
    @sasha-hohloma
    React-developer
    При первом взгляде неплохо, но есть несколько ошибок:
    1. На кнопках с выпадающими списками нет иконок, которые указывают о наличии выпадалок внутри
    2. Выпадающий список на маленьких экранах не вмещается
    3. На мобилке навигация не листается и выглядит не очень красиво
    4. Вставлять видео вот так в лоб через video тэг - плохая практика
    5. Видео лучше грузить после полной загрузки всех картинок, стилей, скриптов
    6. При ресайзе слайдер сходит с уа в эпилептическом приступе (используйте Slick или Owl)
    7. Почему такая старая версия jQuery?

    Странно что в исходниках расширение файлов SASS, но расставлены точка с запятой и скобки
    Также, если верстаете с БЭМ придерживайтесь всех правил, а именно избегайте вложенности и названий тегов .merits__ring-list div:nth-child(1)
    Также рекомендую изучить циклы в SASS, чтобы не перечислять вручную дочерние элементы
    Ответ написан
    6 комментариев
  • Как поймать ошибку в NodeJS?

    sasha-hohloma
    @sasha-hohloma Автор вопроса
    React-developer
    Проблема оказалась внутри библиотеки SocksProxyAgent. Уже не помню где читал, но где-то на GitHub писали, что такая ошибка вываливается как uncaught, потому что не висит обработчик на событии ошибки для tls.connect.
    В итоге исправил
    return tls.connect({
        ...omit(opts, 'host', 'hostname', 'path', 'port'),
        socket,
        servername
    });


    На следующий код
    const tlsConnection = tls.connect({
        ...omit(opts, 'host', 'hostname', 'path', 'port'),
        socket,
        servername
    });
    tlsConnection.on('error', () => {
        return null;
    });
    return tlsConnection;


    Возможно имеет смысл ещё покопаться с библиотекой в поисках более изящного решения. Пока что не работает даже если выкидывать ошибку через throw new Error(). Если найду другое решение, отпишу в комменты
    Ответ написан
    Комментировать
  • Как сделать треугольник?

    sasha-hohloma
    @sasha-hohloma
    React-developer
    Для решения подобной задачи у вас несколько вариантов:

    1. Использовать clip-path, но осторожно из-за ограниченной поддержки браузерами; почитать
    2. Использовать mask-image, но также осторожно из-за ограниченной поддержки браузерами; почитать
    3. Использовать SVG masks, у которого лучшая поддержка браузера, но реализация может занять больше времени, чем в остальных случаях; почитать
    4. Создать необходимую фигуру псевдоэлементом, но такой способ работает только для фона залитого одним цветом
    5. Просто добавить картинкой как есть

    Таким образом, при выборе способа необходимо учитывать требования поддержки верстки браузерами, бюджет и сроки проекта. Мой совет: просто добавить порезанную картинку через background-image, если конечно ваша фигура не изменяет внешний вид при взаимодействии. Любой другой способ занимает сильно больше времени, либо заметно уменьшает список поддерживаемых браузеров, что позволяет в большинстве случаев отказаться от интерактивных свойств.
    Ответ написан
    Комментировать
  • Как отключить кэширование браузером index страницы?

    sasha-hohloma
    @sasha-hohloma
    React-developer
    Вам нужно добавлять hash в названия файлов. При изменении содержимого будет меняться hash рядом с именем файла скриптов/стилей и после нового релиза пользователи без сброса кэша будут видеть обновления. Совсем отключать кэш нежелательно, т.к. тогда постоянным пользователям нужно будет каждый раз грузить файлы и каждый раз ждать окончание загрузки.
    Для реализации такого подхода нужно настроить Webpack, подробнее можно глянуть в документации или в пример ниже для Webpack 5 с одного из рабочих проектов:

    const path = require('path');
    const htmlPlugin = require('html-webpack-plugin');
    
    const publicPath = path.join(__dirname, 'build');
    
    module.exports = {
        entry: './source/index.tsx',
        output: {
            path: publicPath,
            filename: '[name].[contenthash].js',
            chunkFilename: '[name].[chunkhash].js',
            publicPath: '/',
        },
        devServer: {
            static: publicPath,
            historyApiFallback: true,
            hot: true,
            port: 6790,
        },
        resolve: {
            extensions: ['.ts', '.tsx', '.js', '.jsx', 'ttf'],
        },
        module: {
            rules: [
                {
                    test: /\.(ts|tsx)$/,
                    include: path.resolve(__dirname, 'source'),
                    loader: 'ts-loader',
                    options: {
                        transpileOnly: true,
                    },
                },
            ]
        },
        plugins: [
            new htmlPlugin({
                publicPath: '/',
                template: './source/index.html',
                favicon: './source/assets/images/favicon.png'
            }),
        ],
    };
    Ответ написан
    Комментировать
  • Где брать уникальные иконочные шриты с макета?

    sasha-hohloma
    @sasha-hohloma
    React-developer
    Лично я раньше по-всякому извращался, теперь же шрифт иконок собираю из SVG иконок в GULP
    Ответ написан
    Комментировать

Лучшие вопросы пользователя

Все вопросы (3)