Какой рейтинг вас больше интересует?
|
Главная / Главные темы / Тэг «js»

[Перевод] Broccoli: первый бета-релиз 2014-03-22 16:05:29
... запускается на Node. JS и не зависит ...
+ развернуть текст сохранённая копия
Broccoli является новой системой автоматической сборки. Её вполне можно сравнить с Rails asset pipeline, однако есть и некоторые различия: он запускается на Node.JS и не зависит от серверной части приложения.
После длинной вереницы 0.0.х альфа релизов, я только что выпустил первую бета версию, Broccoli 0.1.0.
Оглавление:
- Быстрый пример
- Мотивация / Особенности
- Архитектура
- За кулисами / Общий взгляд
- Сравнение с другими системами сборки
- Что дальше?
Читать дальше →
Тэги: broccoli, javascript, node.js, веб-разработка, перевод, сборки, системы
Сравнение популярных систем сборки для frontend-разработчиков 2014-03-16 21:59:05
+ развернуть текст сохранённая копия
Я стал замечать, что в последнее время build-системам стали уделять всё больше внимания, и, под влиянием этого, их в одночасье стало настолько много, что, честно говоря, уже всех и не упомнить. Последнее время у меня на слуху четыре системы: Grunt, Gulp, Brunch и Gear. Про все что-то где-то было написано, но ни разу не ставился вопрос о том, какие преимущества или недостатки они имеют друг перед другом? И именно поэтому я решил провести сравнительный анализ самых популярных build-систем(по версии google).
Но сперва надо определиться с критериями, по которым мы будем оценивать эти системы:
- Начало работы.
- Производительность. Никто не хочет ждать по минуте после изменения одного coffee-файла.
- Документация. Чем нагляднее и проще — тем лучше.
- Плагины. Ведь мы не хотим столкнуться с проблемой, когда мы начали использовать билд-систему, а в ней нет адаптера, скажем, для jasmine?
Теперь, я полагаю, с вводной частью можно покончить и приступить, наконец, к сравнению.
Читать дальше →
Тэги: brunch, gear, grunt, gulp, javascript, node.js, веб-разработка
[Перевод] Оптимизируем Gruntfile 2014-03-12 00:14:41
Введение
Если Grunt — новое для вас слово, то вы можете сначала ознакомиться со ...
+ развернуть текст сохранённая копия
Введение
Если Grunt — новое для вас слово, то вы можете сначала ознакомиться со статьей Криса Койерса «Grunt для людей, кто думает, что такие вещи как Grunt уродливы и тяжелы». После введения от Криса, у вас будет свой собственный Grunt проект и вы уже попробуете на вкус все возможности, которые Grunt нам предоставляет.
В этой статье мы сосредоточимся не на том, какие многочисленные плагины для Grunt стоит добавить к вашему проекту, а на процессе создания самой сборки. Вы получите практические навыки по следующим аспектам работы с Grunt:
- Как сохранить ваш Gruntfile аккуратным и опрятным
- Как сильно улучшить время вашей сборки
- Как быть постоянно в курсе состояния сборки
Читать дальше →
Тэги: grunt, javascript, node.js, веб-разработка
Бегущая строка на Jquery 2014-03-05 02:54:52
... 123;tpl_url}/ js/jquery-1 ... 123;tpl_url}/ js/jquery.li ... scroller.1.0. js"></script ...
+ развернуть текст сохранённая копия
Вот порыскал по просторам интернета и нашел скрипт бегущей строки.Прочитав инструкцию ,я понял он легко интегрируется в в любой шаблон NGCMS. Приступим. 1.Скачиваем архив [isnt-logged] Вы не можете скачивать файлы с нашего сайта ,рекомендуем Вам begstroka.zip (33.84 Kb)[/is-logged] , распаковываем и заливаем в папку с шаблоном. 2.Подключаем Скрипты в head файла main.tpl
Код: <script type="text/javascript" src="{tpl_url}/js/jquery-1.6.1.min.js"></script> <script type="text/javascript" src="{tpl_url}/js/jquery.li-scroller.1.0.js"></script> <link rel="stylesheet" href="{tpl_url}/css/li-scroller.css" type="text/css" media="screen" /> <script type="text/javascript"> $(function(){ $("ul#ticker").liScroll(); //Syntax }); </script>3.сам код бегущей строки вставляем туда где хотим видеть
Код: <ul id="ticker"> <li><span>10/10/2007</span><a href="#/ogt/content/news/News183.complete">The first thing that most Javascript programmers</a></li> <li><span>10/10/2007</span><a href="#/ogt/content/news/News175.complete">End up doing is adding some code</a></li> <li><span>10/10/2007</span><a href="#/ogt/content/news/News177.complete">The code that you want to run</a></li> <li><span>01/10/2007</span><a href="#/ogt/content/news/News173.complete">Problematically, however, the Javascript code</a></li> </ul> 4.хотите использовать несколько блоков то создаете дополнительные списки так
Код: <ul id="ticker01"> <li></li> </ul> <ul id="ticker02"> <li></li> </ul> <ul id="ticker03"> <li></li> </ul> и соответственно для каждого блока добавляете в скрипте инициализацию
Код: <script type="text/javascript"> $(function(){ $("ul#ticker01").liScroll(); $("ul#ticker02").liScroll(); $("ul#ticker03").liScroll(); //Syntax }); </script> 5.Также можно задать скорость движения строки
Код: <script type="text/javascript"> $(function(){ $("ul#ticker").liScroll({travelocity: 0.15}); //Syntax
}); </script> код
Код: {travelocity: 0.15}можете изменять до 1 6.Ну вроде все,а нет вру,можно подключить плагин xnews,кому надо будет могу выложить.
Тэги: js,, меню, навигация,, ссылками, текстом, эффекты
[Из песочницы] Пишем генератор для Yeoman.io 2014-03-03 22:19:07
+ развернуть текст сохранённая копия

Доброго времени суток, хабрасообщество! В этом цикле статей я хочу описать опыт создания генератора для scaffolding системы Yeoman. Прежде всего, я был немного удивлён тем, что данная система и работа с ней не были описаны на хабре, разве что одно маленькое упоминание из далекого 2012 года: Yeoman.io. Как я уже написал выше, в данном цикле статей я буду рассматривать поэтапное создание yeoman-генератора для ваших проектов.
Читать дальше →
Тэги: javascript, node.js, nodejs, npm, yeoman, веб-разработка
Главная / Главные темы / Тэг «js»
|
Взлеты Топ 5
Падения Топ 5
|