<MyRusakov.ru />

Разработчик игр на Unreal Engine

Разработчик игр на Unreal Engine

Этот комплект с нуля всего за 7 месяцев сделает Вас Unreal-разработчиком. И при этом учиться достаточно 1 час в день.

Начнёте Вы с основ программирования, постепенно перейдя к C++. Затем очень подробно изучите Unreal Engine, и после научитесь программировать на C++ в Unreal Engine. В конце создадите крупный проект на C++ в Unreal Engine для своего портфолио.

Комплект содержит:

- 416 видеоуроков

- 95 часов видео

- 1024 задания для закрепления материала из уроков

- 3 финальных тестирования

- 4 сертификата

- 12 Бонусных курсов

Подробнее
Подписка

Подпишитесь на мой канал на YouTube, где я регулярно публикую новые видео.

YouTube Подписаться

Подписавшись по E-mail, Вы будете получать уведомления о новых статьях.

Подписка Подписаться

Добавляйтесь ко мне в друзья ВКонтакте! Отзывы о сайте и обо мне оставляйте в моей группе.

Мой аккаунт Мой аккаунт Моя группа
Опрос

Какая тема Вас интересует больше?

Изучаем Sass. Установка и настройка.

Изучаем Sass. Установка и настройка.

Всем привет! Сегодня мы начнем изучать Sass, и в конце серии статей вы будете прекрасно владеть данным препроцессором.

Итак, Sass - самый зрелый, стабильный, мощный и профессиональный препроцессор в мире. Именно так о нем пишут разработчики на официальном сайте, и это действительно так. Конечно, существуют и другие препроцессоры, которые тоже очень хороши, к примеру, less, поэтому я лишь опишу, как его использовать, какие у него есть особенности, и вы сможете решить, стоит ли вам использовать этот препроцессор или нет.

Итак, перейдите по ссылке и установите препроцессор Sass. В установке нет ничего сложного, и на сайте все описано очень подробно, так что останавливаться на этом мы не будем, а сразу перейдем к использованию.

Создадим структуру проекта следующего вида:

  • sass
    • assets
    • public
      • css
      • index.html

Содержание index.html:

<!doctype html>
<html lang="en">
<head>
  <meta charset="utf-8">
  <title>Sass</title>
  <link rel="stylesheet" href="css/app.css">
</head>
<body>
  <p>Lorem ipsum dolor sit amet, consectetur adipisicing elit. Dolores, ipsum!</p>
</body>
</html>

Папка css пуста. В ней будет скомпилированный .css файл. Давайте этим и займемся. Создайте в папке assets папку styles, а в этой папке файл app.scss. Напишем в этом файле простой код стилизации:

p {
  color: green;
}

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

// Формат введения команд: sass [input] [output]
sass assets/styles/app.scss public/css/app.css

Теперь у нас появился самый обычный css файл в папке css, а браузер применил заданный нами стиль. Чтобы не компилировать файл каждый раз, когда вы вносите изменения, вручную, давайте автоматизируем этот процесс.

sass --watch assets/styles/app.scss:public/css/app.css

Теперь вам достаточно просто сохранить файл, и он автоматически скомпилируется.

А у меня на этом все. Надеюсь, вас заинтересовала данная тема и всем удачи!

Копирование материалов разрешается только с указанием автора (Михаил Русаков) и индексируемой прямой ссылкой на сайт (http://myrusakov.ru)!

Добавляйтесь ко мне в друзья ВКонтакте: http://vk.com/myrusakov.
Если Вы хотите дать оценку мне и моей работе, то напишите её в моей группе: http://vk.com/rusakovmy.

Если Вы не хотите пропустить новые материалы на сайте,
то Вы можете подписаться на обновления: Подписаться на обновления

Если у Вас остались какие-либо вопросы, либо у Вас есть желание высказаться по поводу этой статьи, то Вы можете оставить свой комментарий внизу страницы.

Порекомендуйте эту статью друзьям:

Если Вам понравился сайт, то разместите ссылку на него (у себя на сайте, на форуме, в контакте):

  1. Кнопка:

    Она выглядит вот так: Как создать свой сайт

  2. Текстовая ссылка:

    Она выглядит вот так: Как создать свой сайт

  3. BB-код ссылки для форумов (например, можете поставить её в подписи):

Комментарии (4):

GALAPERIDOL GALAPERIDOL 01.09.2015 19:31:32

Ну и чем вся эта технология с кучей команд и ненужных компиляций лучше обычного заполнения файла style.css в привычном месте расположения, ведь браузер его так же понимает без всяких проблем?

Ответить

ildar.khasanshin ildar.khasanshin 01.09.2015 19:58:43

этим http://sass-lang.com/guide для меня больше всего нравится это $font-stack: Helvetica, sans-serif; $primary-color: #333; body { font: 100% $font-stack; color: $primary-color; }

Ответить

php_programmer php_programmer 02.09.2015 03:11:44

Если вы хотите понять, зачем нужны препроцессоры, то перейдите по ссылке на статью про Less. Конечно, sass и less несколько отличаются, но понять, зачем все это нужно, думаю, вы сможете.

Ответить

FiftyStars FiftyStars 08.09.2015 17:28:01

GALAPERIDOL, кратко или подробно? Если кратко, то: 1) использование переменных 2) разбиение файла на части в последующим импортом(в различных других файлах) 3) возможность создания файлов настройки, когда поменяв значение переменной в одном месте, сайт может измениться до неузнаваемости. 4) миксины. Пример вендорной миксины: @mixin box-sizing($value){ box-sizing: $value; -moz-box-sizing: $value; -webkit-box-sizing: $value; } Далее, чтобы назначить элементу все эти 3 свойства, например border-box мы пишем @include box-sizing(border-box) вместо: box-sizing: border-box; -moz-box-sizing: border-box; -webkit-box-sizing: border-box; + вложенность элементов + встроенные функции для работы с различными типами данных +++++ много всего советую посмотреть на оф сайте что во что компилируется. В sass это может быть код в 3 строки, после компиляции в css это может стать 30 строками. Думаю все же 3 строки написать и в будущем редактировать проще чем 30 ------ДОБАВЛЕНО--------------- мдя, переносов строк конечно же нет....кому они нужны

Ответить

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