JavaScript *

Sortable.js — минималистичная библиотека для современных браузеров и touch-устройств, не требующая jQuery.

Как вы уже догадались из названия, библиотека предназначена для сортировки элементов при помощи drag’n’drop. Стандартным решением в таких случаях является jQuery UI/Sortable, а это ни много, ни мало 64 кб + 10 кб. Итого 75 кб gzipped в проекте, где jQuery не используется совсем. Относительно недавно на Хабре уже была статья о том, как реализовать похожий функционал, но опять же на jQuery, да и touch-устройства в предлагаемом решении не поддерживаются.

Недавно появилась идея сгенерировать кошачье мурлыканье на javascript. Поискав в интернете эту тему — ничего не было найдено, значит надо реализовать!
Исследовав каким образом это вообще можно сделать — решил использовать такую замечательную вещь, как Web Audio API.
Современные браузеры уже более-менее нормально поддерживают эту технологию.

NPM — пакетный менеджер для node.js, аналог GEM в RoR. В статье несколько советов по его использованию.

Установка пакетов

Все знают

# Устанавливает пакет express
npm install express

Какие варианты еще есть?

Все мы знаем теоретический курс по node.js, недавно выпущенный Ильей Кантором. Отличный материал, свежий, полный и к тому же на русском. Но он теоретический, а нам-то хочется все потрогать, попробовать самим, получая реальный опыт. В этом нам поможет, недавно стартовавший, бесплатный проект NodeSchool.

Invisible.js — библиотека, позволяющая использовать одни и те же модели данных как на клиенте, так и на сервере. На сервере работает поверх express.js на клиент отдается через browserify.

Что есть:

• возможность один раз описать модель (включая типизацию и валидацию) и использовать ее на клиенте и на сервере,
• связь с MongoDb (при записи на сервере — объект пишется сразу в базу, при записи на клиете, используется RESTful API, автоматически созданное на сервере),
• хуки на изменение данных (события бегают туда-сюда через socket.io).

Наш друг из Македонии сделал игру на StarlingJS (Canvas), аналогичную показанную Bret Victor в его легендарной презентации.
Плюс, в ролике он показывает преимущества программирования с livecoding, «умные автокомплиты» и кейсы в Sublime Text.

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

Для меня проблема заключалась в том, что я не люблю читать и чтение расцениваю исключительно как неизбежную работу, которую необходимо проделать, чтобы добыть материал из печатного вида. Но так получилось, что для повышения своей квалификации читать приходится. Я установил для себя норму — одна книга в месяц. С одной стороны, это мало, с другой, — много (если действительно придерживаться плана). Ну и раз уж мне приходится читать в принудительном порядке, это должно давать какую-либо выгоду. Каждая книга — это мучение, и я не вижу смысла тратить время на литературу, которая мне ничего не даст после. Поэтому каждый раз, попадая в книжный и держа в руках очередную книгу, я задаю себе вопрос: «А зачем?! Какой толк от этих кусков бумаги?! Что я вообще тут делаю?!». Чтобы вы не тратили время на книги, которые мне кажутся бесполезными, я решил написать небольшой обзор прочитанной за два года литературы и прочих найденных источников знаний. Весь материал ниже так или иначе связан с веб-разработкой и различными её аспектами. Ниже описаны только те книги, которые я прочитал. Те книги, которые «не осилил»/не дочитал (например, про NodeJS и пару фреймворков) не привожу.

Meteor.js — открытый (MIT) фулстек JavaScript фреймворк (и клиент и сервер). Сегодня вышла версия 0.7.0 (в начале 2014 выйдет версия 1.0).

Основное изменение — поддержка MongoDb OpLog. Это дает возможность полноценного горизонтального масштабирования (см. мой перевод). В предыдущей версии Метеора, в случае нескольких серверов, обновления данных могли приходить с задержкой до 10 секунд — теперь такой проблемы нет.

Полный список изменений смотрите здесь.

П.С. На хабре появился новый хаб: Meteor.JS — подписывайтесь.

От переводчика: MeteorJS — открытый (MIT) фулстек JavaScript фреймворк (и клиент и сервер). Текущая версия 0.7.0 — в начале 2014 планируется выход версии 1.0. Публикации на хабре: 1, 2, 3.

Подготовка к масштабированию

Диаграмма компонентов:

Здесь три сервера Метеор, один MongoDb-сервер и HaProxy-сервер, как балансировщик нагрузки. Для поддержки SSL поставим Stud перед HaProxy.

Давайте обсудим компоненты и их настройку.

Привет, Друзья.

Просто хотел поделиться небольшим советом: Если вам когда-нибудь будет любопытно почитать исходники Google Chrome Dev Tools, то к ним можно подцепиться средствами самого Хрома.

Откройте Dev Tools в плавающем окне и нажмите Ctrl + Shift + J (на макоси Cmd + Option + J). Вот скринкаст:



Понимаю, что это очевидно. Но вдруг кому-то пригодится!

Feathers.js — реактивный JavaScript фреймворк вдохновленный Sails, Flatiron и Derby. Приложение на feathers.js напоминает обычное expressjs приложение, только вместо

var app = require('express')();

нужно будет написать

var app = require('feathers')();

Для коллекций создается полноценный RESTful API, синхронизация ведется через события SocketIO.

Посмотреть.

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

Одно из такой задач стала — Ход конем. Суть ее в том, что необходимо найти маршрут шахматного коня, проходящего через все поля доски по одному разу. Реализовать задачу решил с использованием canvas, немного jQuery, с учетом в будущем сделать плагин.

Здравствуй, Хабр!

Представляю вам свой курс по JavaScript, недавно прошедний на Хекслете. Курс состоит из семи лекций общей продолжительностью около четырех часов.

• Раздача на Рутрекере (видео+слайды)
• Прямые ссылки на видеофайлы: первая лекция, вторая, третья, четвертая, пятая, шестая и седьмая
• Прямая ссылка на слайды (zip-архив pdf-файлов)
• Подкаст в iTunes
• Плейлист на YouTube
• Форум курса

Первая лекция: Введение в JavaScript, немного истории, числа (тут есть ошибка: функция toFixed округляет значения).



Остальное – под катом.

От переводчика: MeteorJS — открытый (MIT) фулстек JavaScript фреймворк (и клиент и сервер). Текущая версия 0.6.6.3 — в начале 2014 планируется выход версии 1.0. Публикации на хабре: 1, 2, 3.

В статье обзор сетевой архитектуры Метеор-приложения.

Метеор как сервер, Метеор как клиент

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


Метеор позволяет разработчикам создавать приложения не заботясь о сложностях клиент-серверного взаимодействия.

Всем подписчикам твиттера @code_orchestra выдадим бесплатную 6 месячную лицензию.
Спешите подписаться. Это просто. Можете завести пустой аккаунт, мы не обидимся.
Акция продлится до 20 числа. Купон будет выслан как direct message твиттера в течении дня.
Кто не знает что такое COLT — посмотрите статью на Хабре, о том что мы добавили для Sublime Text и скоро добавим для WebStorm.

UPD: мы продлили акцию еще на неделю — до 20 числа.

Привет, Друзья!

Я просто хотел поделиться с вами простым проектом, который, надеюсь, поможет сохранить несколько минут при создании очередного node.js пакета. Вот все, что сделает проект, после набора в командной строке yo n:

1. Запустит «npm init»
2. На основе ваших ответов из package.json, создаст файл с лицензией, readme, начальный файл и включит тестовый фреймворк.
3. Создаст и опубликует проект на GitHub'e.

А вот и видео всего описанного выше в действии:



Исходники на гитхабе: github.com/anvaka/generator-n

Надеюсь, пригодится :)!

PS: «yo n» в два раза короче, чем «npm init»

Кратко: после браузерных войн организация W3C и группы разработчиков, такие как Web Standards Project, долго и упорно работали, чтобы восстановить единый нефрагментированный Веб. Но в последние несколько лет мы, разработчики, взяли, и заново всё зафрагментировали… Наверное, нам надо понять, что мы теряем, прежде чем потеряем этот Веб навсегда.

Ровно год назад патриарх веб-индустрии Anil Dash написал: "Мы потеряли Веб", скорбя по ранней, «досоциальной» блогосфере, до всех этих наших постингов фото, видео и мыслей, находящих последний приют в катакомбах Фейсбука, Твиттера, Инстаграма и Ютуба. Это вызвало отклик у многих, кто застал те дни; многих, кто по иронии судьбы затем ушёл работать в эти катакомбы.

Этот текст является переводом статьи 'Stop Being Cute and Clever' небезызвестного (по крайней мере, в Python-комьюнити) Армина Ронахера.

Последние дни в свободное время я занимался созданием планировщика. Идея была простой: создать некий клон worldtime buddy c использованием AngularJS и некоторых других JavaScript-библиотек.

И знаете что? Это было отнюдь не весело. Я уже давно так сильно не злился, работая над чем-либо, а это что-то значит, потому что обычно я быстро высказываю своё недовольство (прошу прощения у моих фолловеров в Twitter).

Я регулярно использую JavaScript, но мне редко приходилось сталкиваться с кодом других людей. Обычно я привязан только к jQuery, underscore и иногда AngularJS. Однако в этот раз я пошел ва-банк и решил использовать различные сторонние библиотеки.

Для данного проекта я использовал jQuery, без которого уже нельзя обойтись (да и зачем?), и AngularJS с некоторыми UI-компонентами (angular-ui и биндинги к jQuery UI). Для работы с часовыми поясами использовался moment.js.

Хочу сразу отметить, что я не собираюсь критиковать чей-то конкретный код. Более того, если кто-то заглянет в мои JavaScript-исходники, их код будет немногим лучше, а иногда и хуже, ведь я не тратил на него много времени, да и вообще у меня не слишком много опыта работы с этим языком.

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

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

В этой статье я хочу поделиться опытом создания велосипеда простой скрам-доски с бекендом в облаке на базе Windows Azure Mobile Services и Azure Cloud Storage.