Задать вопрос

repcolding

Ответы

  • Есть ли смысл делать верстку в React с помощью метод БЭМ, если есть модульная верстка?

    @repcolding
    Как вам удобно. Мне больше нравится использовать модули. Если react то у меня там модули, если нет, то bem.

    Советую попробовать то и то. Что понравиться, то и используйте. Как уже сказали, если вы сами делаете без требований, главное чтобы вам было удобно, и вы получали удовольствие от подхода
    Ответ написан
    Комментировать
    Комментировать

  • Как изменить текстовый элемент в массиве на изображение?

    @repcolding 
    const array = [0, 1]

const getUpdateData = (arr, path, is) => arr.map(item => {
  const image = new Image()
  image.src = path

  return item === is ? image : item
})

console.log(getUpdateData(array, '/path/to/file.png', 1))


    Вот решение в современном стиле
    Ответ написан
    Комментировать
    Комментировать

  • Допустима ли большая вложенность в SCSS как в SASS, или в SCSS принято придерживаться другого стиля?

    @repcolding
    Нет, что на скриншоте не поддерживаемо. Так писать нужно чуть меньше чем никогда. Повышение специфичности, scoped таким образом плохая практика. Еще вижу bem частичный, так тоже нельзя, &- не поддерживаемо.

    Используйте bem, вот подсказка, очень хороший гайд, я был рад что нашел его в свое время, дополняет документацию bem с работой на scss

    https://nicothin.pro/idiomatic-pre-CSS/

    так понял в sass именно так и пишут
    - Нет, что на scss плохой код, то в и sass это плохой код. Это одно и тоже, за исключением {};
    Ответ написан
    1 комментарий
    1 комментарий

  • Как красиво и правильно сделать в компоненте кнопки её вариации?

    @repcolding
    https://www.npmjs.com/package/classnames - очень удобная библиотека

    import styles from './Button.scss'
import cn from 'classnames'

const Button = (props) => {
  const { theme, size, children } = props

  const classList = cn(styles.button, {
    [styles.buttonPrimary]: theme === 'primary',
    [styles.buttonGhost]: theme === 'ghost',
    [styles.buttonSmall]: size === 'small'
  })

  return <button className={classList}>{children}</button>
}

export default Button


    Без css модулей:

    import './Button.scss'
import cn from 'classnames'

const Button = (props) => {
  const { theme, size, children } = props
  
  const classList = cn('button', {
    'button--primary': theme === 'primary',
    'button--ghost': theme === 'ghost',
    'button--small': size === 'small'
  })

  return (
    <button className={classList}>{children}</button>
  )
}

export default Button
    Ответ написан
    Комментировать
    Комментировать

  • Как правильно реализовать общую папку для нескольких проектов на TypeScrypt?

    @repcolding
    Работал в проекте, команда разрабатывала 3 параллельно. И было очень много схожего кода, в плане ui компонентов. Был создан репозиторий, в который выносили общие. И подключали как зависимость через yarn | npm.

    Весьма удобно, у вас есть репозиторий, в котором общая логика для множества проектов, и которую вы устанавливаете в свои проекты. Отдельный проект

    Когда у меня такое наступает. Это новый репозиторий, и выгрузка в npm. И я подтягиваю от туда все что нужно. В случае обновления этого shared репозитория, я просто обновляю package.json. На практике очень удобно. У меня 3 проекта используют одно и то-же, и я переодически что-то улучшаю. И проблем с синхронизацией нет, как и подключении в любой новый проект

    P.S: При работе в команде у вас так-же нет привязки к папке, есть репозиторий в котором все есть, и тянется как зависимость
    Ответ написан
    Комментировать
    Комментировать

  • Как сделать отступ для scrollbar?

    @repcolding
    Самый адекватный способ это использовать библиотеку для scrollbar. Мне нравится https://www.npmjs.com/package/simplebar

    Любая кастомизация нативного scrollbar через css болезненная: Поддержка браузерами/гибкость/функционал.

    Слишком много подводных камней и ограничений.На данный момент, не оправдано, и не возможно сделать все с охватом большинства пользователей посетителей сайта. Идея что проще и лучше делать на css а не на js, иллюзия.
    Ответ написан
    6 комментариев
    6 комментариев