• Как лучше организовать динамическое обновление блоков HTML на JS?

    mudrick
    @mudrick
    Máximo progreso hemos alcanzado en minimo seso.
    Только лишь для одного виджета корзины Ангулар подключать конечно же не стоит :)

    На Ангуларе это делается следующим образом — есть директива корзины (виджет) и есть сервис корзины. Добавление товаров в корзину идет через сервис, а директива слушает изменения сервиса и выводит у себя обновленную инфу.

    Вот Директива:
    angular.module('app').directive('shoppingCartWidget', function(shoppingCartService) {
        return {
            restrict: 'E',
            replace: true,
            scope: {},
            templateUrl: 'shopping-cart.html',
            link: function(scope, element, attributes) {
                scope.items = [];
    
                // слушаем изменения в корзине
                scope.$watch(shoppingCartService.getItems, function(items) {
                    scope.items = items;
                });
            }
        }
    });


    Вот сервис:
    angular.module('app').directive('shoppingCartService', function(_) {
        var items = [];
    
        function add(itemData) {
            items.push(itemData);
        }
    
        function remove(itemID) {
            items = _.reject(items, {id: itemID});
        }
    
        function clear() {
            items = [];
        }
    
        function getItems() {
            return items;
        }
    
        return {
            add: add,
            remove: remove,
            clear: clear,
            getItems: getItems
        }
    });


    Вот контроллер:
    angular.module('app').controller('myController', function(shoppingCartService) {
    
        // ну, тут будет не массив, а $resource, например
    
        $scope.items = [
            {
                id: 1,
                name: 'Клавиатура',
                price: 150
            },
            {
                id: 2,
                name: 'Кофе',
                price: 50
            }
        ];
    
        $scope.addToCart = addToCart;
    
        function addToCart(itemData) {
            shoppingCartService.add(itemData);
        }
    
    });


    Вот вьюха списка товаров:
    <ul>
        <li ng-repeat="item in items">
            <span>{{item.name}}</span>
            <button ng-click="addToCart(item)">Добавить в корзину</button>
        </li>
    </ul>
    Ответ написан
    5 комментариев
  • Вопрос по React.js. Нужна подсказка профессионалов...?

    @roman01la
    Вы пробовали архитектуру Flux? Вот статья. Flux описывает управление данными внутри React приложения.
    Ответ написан
    1 комментарий
  • Как обойти кэширование в браузере?

    GM2mars
    @GM2mars
    Самый действенный и проверенный способ, это версионность js файлов. То есть выпустили новую версию веб приложения, меняем название файлов app_1.2.js
    Как менять название подключаемых файлов автоматически, это уже другой вопрос, зависит от архитектуры, да и вообще нужно смотреть каждую ситуацию отдельно.

    Некоторые скажут что можно менять версию через параметры app.js?v=1.2, но такая схема работает не на всех браузерах.
    Ответ написан
    Комментировать
  • Что понимают под изоморфными приложениями?

    Fesor
    @Fesor
    Full-stack developer (Symfony, Angular)
    один код на сервере и на клиенте. Читать определение слова "изоморфизм"
    Ответ написан
    Комментировать
  • Что понимают под изоморфными приложениями?

    mannaro
    @mannaro
    Умею профессионально гуглить
    Ответ написан
    Комментировать
  • Быть Marionettejs или не быть?

    aen
    @aen
    Keep calm and 'use strict';
    Если коротко, то "быть". Это вам позволит избежать кучи граблей, на которые наткнетесь при разработке.

    upd: Вот вам подборка для изучения https://github.com/instanceofpro/awesome-marionette
    Ответ написан
    Комментировать
  • Сортировка/фильтрация в Backbone?

    aen
    @aen
    Keep calm and 'use strict';
    Вы все верно предложили. Чаще всего только так и можно сделать. Главное в DOM вставлять сразу всю отрендеренную коллекцию, а не по одной вьюшке. И не забывать подчищать за собой в случае, если есть какие то лихие биндинги.
    Ответ написан
    2 комментария
  • Как веб разработчику дружить с дизайном?

    ruddy22
    @ruddy22
    Спасение утопающих — дело рук самих утопающих
    а Вы не думал, о такой вещи?!
    -накидать прототип функционала на ангуляре, либо другом фреймворке/либе
    -сверстать
    -результат показать как альтернативу того, что придумал дизайнер.

    на худой конец, есть такое решение uilang.com
    Ответ написан
    4 комментария
  • Почему многие программисты не любят javascript?

    forgotten
    @forgotten
    Руководитель разработки API Яндекс.Карт
    Полагаю, всему виной «синдром утёнка».
    Многие программисты однажды привыкли мыслить в одной парадигме, и хотя бы начать мыслить в другой для них крайне сложно. Поскольку JavaScript — единственный «нестандартный» язык, использования которого практически невозможно избежать, именно ему и посвящено максимальное количество ненависти.
    Ответ написан
    Комментировать
  • А в чем минусы node.js?

    Fesor
    @Fesor
    Full-stack developer (Symfony, Angular)
    В том же в чем его и плюсы.

    Асинхронность... ее там нет. Там есть event loop что позволяет писать крайне эффективные программы в плане работы с I/O (что для web очень неплохо) и не париться о таких вещях как потокобезопасность, блокировки и т.д. А если еще и несколько инстансов приложения запусть - по одному на ядро скажем, то утилизация вычислительных мощностей выйдет неплохой. Но распаралелить что-то в рамках одного процесса воркера мы уже не можем. Мы не можем посчитать что-то, проанализировать, заняться обработкой жирной картинки прямо при обработке запроса потому что наш процесс воркер так же обрабатываете еще пару десятков запросов, и пока мы будем удовлетворять нужды одного простаивать будут все. Нода хороша когда у нас все состоит из элементарных операций которые не занимают много времени, все жирное надо выносить из основного процесса и разруливать очередями и т.д. Эта проблема имеет массу решений на самом деле, но все уже усложняется и нода теряет свою красоту. Лучше взять Java/c#/Python для этого (и не надо тут вспоминать про шутки с многопоточностью в CPython).

    callback-hell. Собственно наличие event loop диктует так же правила о том, как должна писаться программа. Кучи колбэков, невозможность дебажить нормально и получить четкий стэктрейс из ошибки. Да, есть промисы которые решают первую проблему, да есть либы вроде zone.js которые решают вторую и частично первую проблему... но все это не тривиальное дело.

    Собственно... разработка больших и сложных проектов на ноде возможна... но требует от разработчика хорошие знания и понимание того, как работает его платформа. А это увеличивает стоимость разработки в то время как можно взять более эффективные в этом плане инструменты.
    Ответ написан
    10 комментариев
  • Как определить свой уровень программирования?

    index0h
    @index0h
    PHP, Golang. https://github.com/index0h
    Эти уровни - абстракция, причем зависящая от компании. Пройдите несколько собеседований и спросите, что думает о вас интервьюер.

    Юниор чаще всего - это программист с в основном теоретическими знаниями, либо наоборот только практическими знаниями. Он умеет решать более-менее стандартные задачи. Юниора обязательно надо учить. При получении нового задания он "создает" свое решение.

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

    Синьйор - понимает не только то зачем использовать ту, или иную технологию, а еще и как она работает, например почему при HL форин ключи сожрут io hdd. Может спроектировать и вести средний по размерам проект. Получив новое задание он уже знает как его решить кучей способов, выбор заключается только в правильности интеграции решения.

    -----------------

    Многое зависит от интервьюера.
    У меня был случай, собеседование на php senior developer: поговорили про HL оптимизации, архитектурные предложения для решения неких задач, способы оптимизации и т.д., а потом:
    - перейдем к практике: что произойдет в таком коде:
    $a = 5 + '5abc' + 'abc5';
    - произойдет следующее: я посмотрю blame скрипта и поговорю с автором этой строчки, что бы узнать, что такого хренового в жизни может произойти, что бы он позволил себе это написать.
    - ну, тут вопрос на приведение типов
    - 10, но вы в своей практике с подобным сталкивались?
    - нет
    - вот и я не сталкивался...
    Ответ написан
    1 комментарий
  • Почему многие программисты не любят javascript?

    index0h
    @index0h
    PHP, Golang. https://github.com/index0h
    JS у кучи народа воспринимается, как чисто браузерный язык. Но, учитывая, что требования к фронту обычно на уровне "что бы работало", как следствие - говнарей многовато((. Много людей считают себя тру js-прогерами, при этом знают не js, а jQuery и пару плагинов. По опыту проведения многих собеседований могу сказать, что человек даже с притензией на мидла js может не иметь представления о том, как создать DOM элемент без jQuery, увы это очень печально.

    Сам язык вообще-то сложный. Не в плане синтаксиса (синтаксис действительно учится пару недель), а в плане подходов. Они очень отличаются от классических просто потому, что JS - событийный язык. Например задачи с последовательным выполнением на JS пишутся на много сложнее (callback hell - очень частая ошибка), чем на других языках, однако задачи, заточенные под event-loop - на порядки легче. Как пример - чат на nodeJS на порядки проще написать, чем на любом другом серверном ЯП. Очень частой проблемой (в основном backend) являются утечки памяти, их проворонить довольно легко, а отследить - наоборот.
    Ответ написан
    1 комментарий
  • Как быстро скопировать 40 млн файлов на другой сервер?

    gbg
    @gbg Куратор тега Linux
    Любые ответы на любые вопросы
    Как-то так:
    dd if=/dev/sda bs=65536 | ssh target-ip 'dd of=/dev/sda bs=65536'.

    На агрегированном канале 2x1Gbit выдает 100 мегабайт в секунду. Если подшаманить размеры блока bs= и mtu, и еще шифрование у ssh выключить, можно, я думаю, и все 200 мегабайт выжать.

    Проводить, на отмонтированном! (или смонтированном в readOnly) диске!
    Не зря dd расшифровывается как DestroyData.
    Варианты настройки шифрования (-c) и скорость (лучше - больше):
    ssh-cipher-speed-chart.png?w=630
    Ответ написан
    8 комментариев
  • Существует ли реализация выдвижной панели на Bootstrap3?

    Ещё, в bootsnipp.com есть много приятных вещичек
    Ответ написан
    Комментировать
  • Где можно посмотреть пример сложного приложения на backbone.js?

    aen
    @aen
    Keep calm and 'use strict';
    Есть planetexpressapp. Это приложение, разработку которого описывает Брайен Манн в своем скринкасте backbonerails. Правда, написано оно на coffeescript.
    Ответ написан
    2 комментария
  • Правильно ли я понял основые принципы БЭМа?

    Zoxon
    @Zoxon
    Веб-разработчик
    Уж незнаю что вы хотите сделать, но вот такой разметки хватит на что угодно.
    И БЭМ это не способ именования классов. Нужно смотреть еще css, скорее всего именно там самые серьезные ошибки.
    <ul class="menu">
    	<li class="menu__item"><a href="#">Пункт</a></li>
    	<li class="menu__item menu__item_active"><a href="#">Пункт</a></li>
    	<li class="menu__item menu__item_submenu">
    		<a href="#">Пункт с подменю</a>
    		<div class="menu__submenu">
    			<ul class="submenu">
    				<li class="submenu__item"><a href="#">Пункт подменю</a></li>
    				<li class="submenu__item"><a href="#">Пункт подменю</a></li>
    				<li class="submenu__item submenu__item_active"><a href="#">Пункт подменю</a></li>
    			</ul>
    		</div>
    	</li>
    	<li class="menu__item">Пункт</li>
    </ul>


    В хедере располагается три других блока: logo, menu и info.

    Я так понял вы подхватили болезнь БМ, новички всегда в это вляпываются
    <div class="header">
    	<div class="header__logo">
    		<div class="logo"></div>
    	</div>
    	<div class="header__menu">
    		<div class="menu"></div>
    	</div>
    	<div class="header__info">
    		<div class="info"></div>
    	</div>
    </div>
    Ответ написан
    7 комментариев
  • Объясните что такое полиморфизм простыми словами ?

    Deerenaros
    @Deerenaros
    Программист, математик, задрот и даже чуть инженер
    Да ладно, парни. Ну хватит уже, к чему такие сложности? Берём и читаем. Вообще совсем не обязательно читать про архитектуру и абстракции именно по своему языку, хотя javascript в этом плане родился уродом.

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

    Собственно, представим себе рядом стакан, кружку, чайник, кофемашину, велосипед и скейт. Что между ними всеми общего? Ну как минимум то, что они есть. То есть это - объекты, которые были созданы. Но как они были созданы? Скорее всего на заводе производителя по чертежам. Ок, чертежём назовём конструктор. Ну а класс? А что это такое? А его нет в нашей вселенной - эта сущность есть абстракция, что живёт лишь в наших мыслях. В реальном мире её нет и никогда не будет, такова уж физика - ей по барабану, что птицы и млекопитающие имеют дальних родственников - она лишь обеспечивает возможность естесственного отбора. А уж родственников друг другу находим мы, люди.

    С объектами и классами разобрались, а что же там с нашими стаканами и велосипедами. Мы уже поняли, что всё это объект, то есть грубо можно все объекты наследовать от какого-нибудь суперпредка, суперкласса, что и реализовано в некоторых языках. Но что другого общего между скейтом и стаканом, например? Конечно, можно углубляться и считать, что они все из молекул, и они все из твёрдых веществ. Однако это всё бред и СПГС, так что ответ прост - да ничего. То есть это совершенно разные объекты с совершенно разным функционалом. Более того - естесственно компьютерные модели и иерархии будут сильно отличатся от физик и химий. И это нормально, вопрос об адекватностях моделей ставиться лишь когда модель неадекватна, а до тех пор пилить можно что угодно, лишь бы работало.

    Вот. У нас есть супер-предок Object, от которого дефолтно наследуются все объекты. Допустим, то что объекты состоят из атомов и есть то, что наследуют все объекты. Но все дополнения и правки - полиморфизм. Так, из атомов мы слепили колёса и приделали на доску - ок, это скейт. На него можно встать и катиться, а сильно извернувшись и полетать в трёх метрах над землёй, прямо таки излучая своё яркое эго. В то время как стакан - это мы слепили из атомов плотную ёмкость, из которой вода не выливается под действием силы тяжести. И прямое применение стакана - налив воды опрокинуть его над ртом, чтобы вода вытекла прямо в желудок. Так делают настоящие пацаны, не заботясь об икоте или страхе утонуть, так что вот - полиморфизм.

    Однако что с остальным? У нас ещё абстракция, инкапсуляция и наследование. Ок, начнём с наследования, так оно наиболее близко. Вот что у нас общего между стаканом и кружкой? Ну в оба можно налить воду, но у кружки есть ручка чтобы держаться. То есть можно придумать некий общий класс - ёмкость. Однако что это за класс? Можно например за этот класс взять стакан, тогда все ёмкости по дефолту стаканы, а всё остальное - видоизменённые стаканы. Но кому-то больше нравяться кувшины, например некоторые чики насят их на голове, считая что это удобно. Ну и пусть носят, но как-то же решить надо, что главнее и идеальнее. Так вот - недостяжимый идеал и есть главный - это называется абстрактный класс. То есть ёмкость, что невозможно создать, для которого нет полного чертежа. А все чертежи, что дополнили до полного - есть наследованные классы от класса ёмкость.

    Тут мы подошли к абстракции. Вот такое иерархическое наследование приводит нас к, возможно главной, идее ООП. Вот мы взяли и выделили всё, куда можно налить воду в отдельный класс, нарисовали общий чертёж, но специально не доделали его, оставив зазор для будущих творцов, и назвали чертёж - ёмкость. Тысячи лет изобретатили всех миров создают свои ёмкости, одна лучше другой. Для разных людей - по разному, конечно. Но каждый раз группировать молекулы стекла определённым образом - непростая задача. Поэтому ремесленники пошли на хитрость, они создали тайный совет ремесленников мира и решили делиться друг с другом своими наработками. То есть создавать мелкие чертежи и объявлять классом, например, извлистой ручки в форме ленты Мёбиуса, например. Возможно такая ручка удобно только инопланетным существам, но чертёж создан и к нему можно ссылаться при создании своего чертежа. Таким образом мы абстрагируемся от низкоуровневой задачи "формирования ёмкостей посредством перемещения молекул" к "конструированию ёмкости посредством совмещения деталей, элементов". Это и есть абстракция.

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

    Таким образом, абстракция невозможна без инкапсуляции и наследовании, как невозможен полиморфизм без, собственно, наследования. Ну а полиморфизм невозможен ещё и без инкапсуляции, которая банально бесполезна без наследования и полиморфизма. Вот такие тут треугольники с пирогами. Жаль только про пирог наврали. И про день рожденье.
    Ответ написан
    3 комментария
  • Как правильно описывать API?

    Fesor
    @Fesor
    Full-stack developer (Symfony, Angular)
    Очень хорошая документация у LinedIn. Это как пример оформления документации скорее.

    Так же почитайте что такое ресурс. что такое uri.... Большая часть правил по которым нужно формировать API строятся как раз на этих принципах.

    Если говорить о best practice, есть еще HATEOAS и Json Api. чем это все хорошо - позволяет автоматически генерировать клиентский код. Скажем помниться мне для angular.js есть модуль позволяющий легко и просто взаимодействовать с HATEOAS. Но если честно, я редко сталкивался с апишками где это используется. Сходу вспомню что Sun (oracle) использует в енто дело в своих апишках для работы с клаудами.
    Ответ написан
    1 комментарий
  • Как вы делаете резервное копирование на Linux Ubuntu ?

    kirill89
    @kirill89
    На хабре по этому поводу была отличная статься. rsync настраивается как Time Machine. Активно пользуюсь для полного/частичного бэкапа своих систем. При этом очень рационально расходуется место на backup сервере.
    Ответ написан
    Комментировать