В этом разделе материалы размещаются пользователями сайта и публикуются после одобрения модератором. Редакция не несет ответственности за орфографические и другие ошибки, хотя и старается исправлять их по мере возможности.
Добавить свою заметку вы можете на этой странице.
18 сентября 2014, 17:51
7561
0

Чек-лист для начинающего front-end разработчика.

Короткий чек-лист, который меня спасал. Все то, на что стоит обратить внимание front-end разработчику на старте работы над проектом.
Чек-лист для начинающего front-end разработчика.


1. Посмотреть на требования по браузерам в проектной документации.

Если не опускаемся ниже IE9, значит смело можем использовать возможности CSS3. Не все, но можем. Какие именно смотрим здесь —http://caniuse.com/.

2. Работа с иконками.

Если у вас есть возможность выпросить у дизайнера иконочный шрифт — просите. Помните о кроссбраузерности. Иконочный шрифт — лучшее решение. Иконки легко ресайзить, красить, отпадает зависимость от ретины и подобных ей экранов. Если шрифт нам не дают — оптимизируйте свою работу со спрайтами. Grunt, Gulp, Compass — смотрите в этом направлении.

Иконочные шрифты:
http://fontello.com/ 
https://icomoon.io/

Спрайтинг:
http://compass-style.org/help/tutorials/spriting/ 
https://github.com/Ensighten/grunt-spritesmith
https://github.com/aslansky/gulp-sprite

3. Используйте пре- и постпроцессоры.

Машины должны за нас страдать, все верно. SCSS, LESS, Stylus. На CSS сейчас пишут только ******. Это долго и ничем не оправдано.

Препроцессоры:
http://lesscss.org/
http://sass-lang.com/
http://learnboost.github.io/stylus/

cossa-icons-6.png

Весь интернет-маркетинг за 19 недель!

Cossa рекомендует: онлайн-курс по интернет-маркетингу от Ingate — digital-агентства с 17-летним опытом.

  • 17 учебных блоков по ключевым вопросам интернет-маркетинга
  • Поддержка менторов
  • Диплом
  • Cтажировка в топовых агентствах России
  • Помощь в трудоустройстве
Узнать больше >>

Реклама

Постпроцессоры:
https://github.com/postcss/autoprefixer

4. Используйте шаблонизаторы.

Если вы пишите на руби, то HAML или SLIM, если на ноде — JADE, php - TWIG

Шаблонизаторы:
http://slim-lang.com/
http://haml.info/
http://jade-lang.com/
http://twig.sensiolabs.org/

5. Перед началом работы вы должны иметь на руках ТЗ.

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


Чем живёт digital.
Главное — в рассылке:




Вход на cossa.ru

Уже есть аккаунт?
Выбирай любой вариант входа:
Facebook Twitter Vkontakte

Используйте свой аккаунт в социальной сети Facebook или Twitter, чтобы пользоваться сайтом

Не забудьте написать email на странице своего профиля для управления рассылкой