Ответы пользователя по тегу CSS
  • Как добиться такого эффекта?

    Fesor
    @Fesor
    Full-stack developer (Symfony, Angular)
    эм.... сделать отдельные столбцы.

    https://philipwalton.github.io/solved-by-flexbox/d...
    Ответ написан
    Комментировать
  • Стоит ли использовать везде БЭМ нэйминг?

    Fesor
    @Fesor
    Full-stack developer (Symfony, Angular)
    если вы не используете БЭМ а только нейминг - то точно нет. Если вы используете БЭМ - то возможно, зависит от того нужно оно вам или нет.
    Ответ написан
    3 комментария
  • Как фронтендиру создать хорошее веб приложение не зная php?

    Fesor
    @Fesor
    Full-stack developer (Symfony, Angular)
    На вашем уровне бэкэнд вам не нужен. Вместо него достаточно либо делать приложеньки используя возможности браузера либо использовать какие-нибудь google firebase например или похожие штуки.
    Ответ написан
    Комментировать
  • Как организовать ООП-логику на JavaScipt на примере аудио-плеера?

    Fesor
    @Fesor
    Full-stack developer (Symfony, Angular)
    Вы же понимаете что это никакого отношения к ООП не имеет? Это просто объекты содержащие функции, не настоящие объекты. Ну то есть у вас нет конструкторов, у вас есть "модули".

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

    Так же используйте модули, они помогут вам убрать лишние уровни вложенности и добиться изоляции, код станет опрятнее.

    Меньше императивной логики, больше декларативного поведения. Если событий реально много можно попробовать посмотреть в сторону observable и ивент стримов.
    Ответ написан
    1 комментарий
  • Какое значение лучше в % или в px?

    Fesor
    @Fesor
    Full-stack developer (Symfony, Angular)
    и то и то плохо если всегда слепо использовать только что-то одно.

    Хорошо их комбинировать исходя из задачи. Например если у вас есть задача первую колонку сделать в 340 пикселей а все остальное растягивать, как думаете что вы будете использовать?
    Ответ написан
    2 комментария
  • Как подгружать шаблоны в AngularJS?

    Fesor
    @Fesor
    Full-stack developer (Symfony, Angular)
    Появление сообщений в чате реализировано через $compile.


    Зачем? Намного практичнее использовать старый добрый ngRepeat. Так можно потом виртуальные скролы прикрутить какие-нибудь и т.д. Разделение ответственности короче.

    А то что вы описываете это jquery-стайл.

    Для защиты от XSS просто используйте $sanitize.
    Ответ написан
    Комментировать
  • А как ты проверяешь баги в ie?

    Fesor
    @Fesor
    Full-stack developer (Symfony, Angular)
    в IE10-11 нормальный дебаггер, а меньше десятки я не суппорчу.
    Ответ написан
    Комментировать
  • Как позиционировать Блок в БЭМ?

    Fesor
    @Fesor
    Full-stack developer (Symfony, Angular)
    это не бэм.

    Первый способ, как я понял, заворачивать в Элемент


    Не совсем "заворачивать", просто только элементы отвечают за позиционирование, а блоки - задают базовые стили.

    <!-- у элемента в принципе не обязательно должен быть блок, но желательно -->
    <div class="page__wrapper block"> 
        <div class="block__header header"></div>
    </div>


    Ну то есть идея примерно такая.

    а второй добавлять вспомогательные классы как-то так


    Это вообще не БЭМ, это... ну как через атрибут style только меньше проблем, но куча дублирования.

    Вообще рекомендую вам посмотреть вот это: WSD в Новосибирске // БЭМ — норм, Вадим Макеев
    Ответ написан
    5 комментариев
  • Какие JS библиотеки вы посоветовали бы изучить?

    Fesor
    @Fesor
    Full-stack developer (Symfony, Angular)
    те, которые вам нужны. Просто так "учить" библиотеки - глупо. Лучше поучите javascript (es2015/2016), прошарьтесь в написании тестов, tdd, bdd, solid, grasp, separation of concerns, dry, kiss, yagni.
    Ответ написан
    Комментировать
  • Есть ли смысл осваивать визуальные редакторы HTML?

    Fesor
    @Fesor
    Full-stack developer (Symfony, Angular)
    только если вы дизайнер и верстка это не то чем вы будете заниматься.
    Ответ написан
    Комментировать
  • Как правильно назвать классы по Бэм?

    Fesor
    @Fesor
    Full-stack developer (Symfony, Angular)
    есть блок элемента


    Нет там ничего такого. Есть только блоки, элементы и модификаторы.

    <div class="sidebar">
        <div class="sidebar__page-header-logo logo">
            <div class="logo__img"></div>
            <div class="logo__element2"></div>
            <div class="logo__element3"></div>
        </div>
    </div>


    или если кому (например мне) нравится jade:

    .sidebar
        .sidebar__page-header-logo.logo
            .logo__img
            .logo__element2
            .logo__element3


    все очень просто. Каждый блок - по возможности независим (отказываться полностью от касказа иногда банально не выгодно). Он определяет базовые стили. А за позиционирование блоков отвечают элементы.
    Ответ написан
    Комментировать
  • Правильно ли я расставляю приоритеты в развитии?

    Fesor
    @Fesor
    Full-stack developer (Symfony, Angular)
    Для начала, как говорится, определитесь с целями. Вы хотите больше интересных задач. При этом ваша специализация - верстка. Раз уж вы только только решили попробовать "gulp" и sass - предположу что с такими инструментами, как скажем autoprefixer вы так же не знакомы. И тем более webpack.

    Пока я могу заключить, что у вас слабым местом являются процессы, которые вы используете. Начать пожалуй можно с них. Возможно паралельно подтягивая английский (если мы пойдем дальше - читать надо будет тоже много, и много спрашивать), если вы ощущаете в этом необходимость.

    По процессам вам стоит ознакомиться с существующими методологиями в верстке. BEM, Css modules и т.д. Сейчас все популярные фреймворки (в том числе и angular) идут по сути реюзабельных компонентов, и подобных подходы к верстке зададут вам какую-то основу.

    Передт тем как учить фреймворки стоит определиться с целями. Если знания ангуляра вам нужны на уровне шаблонов - ну тут тогда можно просто почитать да попробовать в свободное время. Если же вас именно качественное понимание всего интересует, но перед фреймворками надо хорошо изучить javascript (и ознакомиться с текущим стандартом ES2015). И уже после этого можно приступать к фреймворкам.
    Ответ написан
    1 комментарий
  • Лучший ресурс/книга/видеоуроки для изучения AngularJS?

    Fesor
    @Fesor
    Full-stack developer (Symfony, Angular)
    Дополню ответ bromzh

    лучший способ изучения


    Ограничивать себя и практиковаться.

    Ограничения даже могут быть искуственными, типа "никогда ни использовать $scope". То есть если хочется, лучше хорошенько подумать "а как без него?". Очень редко, его нужно использовать напрямую, но в подавляющем большинства это директивы и работа с событиями, в целом же на вашем уровне это может просто не понадобиться.

    Или там "никогда не используйте фильтры для работы с коллекциями, пусть результат фильтра всегда будет строкой". Это сразу сильно ограничит вас в том как убить свое приложение и превратить шаблоны в кашу, а так же чуть почистит мозги.

    Или... "Не полагаться на двустороннее связывание". То есть... оно увы в angular 1.x везде, но нужно понимать риски с этим связанные и стараться делать все так, что бы элементы нижнего уровня ничего не меняли на верхнем уровне, а все изменения проходили либо через колбэки или сервисы. Исключения - формы, тут двусторонний биндинг бывает очень полезным.

    Так же "Никогда не использовать ng-controller", или "Делать все на stateless компонентах" и все такое.

    Для всех этих правил есть свои исключения, но нужно 10 раз подумать можно ли соблюсти правило прежде чем его нарушить.

    Я так же собрал парочку толковых ссылок которые могут быть полезны новичку. Там так же пример ооочень простого приложения с тестами.

    Так же рекомендую сразу же изучить хотя бы основные плюшки ES6 с babel и использовать их. Таким образом можно сильно упростить структуру приложения.

    А ну и да, ТЕСТЫ! Пробуйте писать приложения используя TDD, это очень полезно для новичков и так же действует как ограничение. Типа "если неудобно писать тесты - подумай как сделать так что бы было удобно писать тесты изменяя тестируемый код". Ну и все такое. У TDD есть свои правила вроде "не меняйте тесты и код одновременно" и т.д.

    Новички должны быть в ежевых рукавицах.
    Ответ написан
    Комментировать
  • PostCSS или Stylus: Что выбрать?

    Fesor
    @Fesor
    Full-stack developer (Symfony, Angular)
    но как я понял сложности с функциями и миксинами.


    не совсем, есть куча готовых плагинов, есть возможность добавлять свои функции для обработки AST и т.д.

    но вот говорить о будущем не приходится. Используйте то что вам удобно. Для смены технологии должны быть более объективные причины кроме как "маркетинг" тулзы.
    Ответ написан
    Комментировать
  • Где найти информацию о всех фишках css3?

    Fesor
    @Fesor
    Full-stack developer (Symfony, Angular)
    CSS это стандарт, у каждого стандарта есть спецификация где есть все все все.

    https://www.w3.org/Style/CSS/specs.en.html
    Ответ написан
    Комментировать
  • Что все-таки должен уметь делать frond-end-разработчик?

    Fesor
    @Fesor
    Full-stack developer (Symfony, Angular)
    Все то что запускается в браузере - ваша зона ответственности. Ajax (ajax это просто возможность делать http запросы из js), все эти фреймворки и библиотеки, все все все. От бэкэнда вас целиком и полностью отделяет весьма жирная сетевая прослойка. Причем эту прослойку вы так же должны знать как слой интеграции между фронтэндом и бэкэндом (на поверхносном уровне хотя бы).

    По сути сегодня фронтэнд и бэкэнд - отдельные приложения. SPA например - полностью независимое приложение, далее могут быть различные оптимизации и т.д. с сервер сайд пререндрингом где связанность повышается и четко границу ответственности уже не определить (хотя опять же можно). Ну и классический web как ярный пример каши.

    Если фронтэнд - это отдельное приложение, то и знать вы должны все что нужно для его построения. Это и архитектурные штуки (MVC/MVA/MVVM/MVP/Flux/паттерны всякие/функциональное программирование) и тесты писать уметь должны и т.д. Все как у бэкэндщиков по объемам знаний. Просто у бэкэндщиков геморой обычно в конкурентных запросах, локах, базах данных и другими веселыми штуками. а у фронтэндщиков - зоопарк браузеров, различия в окружениях и т.д.

    nodejs - это уже опционально. В любом случае если вы хорошо знаете JS то посмотреть как там чего в API ноды проблемы не составит (например что бы быстренько поднять expressjs сервачек для разработки с мидлвэрами, часто нужно для всяких webpack-ов и browsersync). Ну и опять же билд стэк у фронтэндщиков в принципе весь на ноде написан. Но это не бэкэнд.
    Ответ написан
    4 комментария
  • Какие теги можно использовать в ionic?

    Fesor
    @Fesor
    Full-stack developer (Symfony, Angular)
    Никаких оганичений. Только здравый смысл.
    Ответ написан
    Комментировать
  • Пример front-end разработки?

    Fesor
    @Fesor
    Full-stack developer (Symfony, Angular)
    https://github.com/classeur/classeur - например. Не сказал бы что это "код которому стоиит подражать" но...
    Ответ написан
    Комментировать
  • Каким образом должны создаваться движки на PHP?

    Fesor
    @Fesor
    Full-stack developer (Symfony, Angular)
    1) читаем на википедии как работает HTTP
    2) читаем в документации к PHP про SAPI
    3) смотрим как реализован fastroute
    4) перестаем писать велосипеды - разбираемся с существующими решениями. Потом пробуем писать велосипеды и выкидываем их, продолжая пользоваться готовыми решениями.
    Ответ написан
    Комментировать
  • Лучший Grid Layout написанный на нативном CSS, который вы только встречали?

    Fesor
    @Fesor
    Full-stack developer (Symfony, Angular)
    хочу найти идеальную универсальную адаптивную и элегантную сетку

    А жареных гвоздей не хочешь ты? Универсальных и идеальных не существует, иначе пользовались бы все только одной.

    возможность безболезненного комбинирования колонками с разными соотношениями сторон


    Вообще все очень сильно зависит от задачи, но в принципе flexbox решает большую часть этих проблем.

    flexboxgrid.com а так же bootstrap4 во всю использует flex.
    Ответ написан
    Комментировать