Pull to refresh
25
0
Кирилл @seokirill

Разработчик

Send message

Select / Multiselect без JS

Reading time4 min
Views20K

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


Конечно, есть огромное количество решений, представляемых фреймворками/библиотеками (тот же бутстрап). Но все они предполагают наличие JSа. Разумеется, в этом нет ничего страшного/плохого, но я попробовал сделать стилизуемый селект без JS в качестве фоллбэка на случай, если js по каким-либо причинам сломается.

Читать дальше →
Total votes 28: ↑17 and ↓11+6
Comments19

Игры на CSS. Часть 2: StarCraft

Reading time4 min
Views47K
Доброго дня, хабровцы.
По результатам прошлой статьи я понял, что тема интересна общественности, поэтому подготовил еще один материал, чуть сложнее.
По прежнему нет скриптов, только HTML/CSS.

Смотрите видео и под кат.

Читать дальше →
Total votes 38: ↑35 and ↓3+32
Comments20

Карточная игра: реализуем атаку и найдем применение ShadowDOM

Reading time6 min
Views7.6K
Доброго дня, читатели. Сегодня продолжим совершенствовать нашу игрушку и реализуем возможность атаковать карты противника, а так же некий профит в использовании ShadowDOM для админки.
В реализации атаки нам неожиданно поможет наш же способ реализации очереди из прошлой статьи (в противовес сообщению игроков по WebSockets).

Оговорюсь сразу, что развивать будем версию на MatreshkaJS, а не на Angular.

image
Читать дальше →
Total votes 12: ↑10 and ↓2+8
Comments4

Очередь событий в карточной игре + основы Angular

Reading time8 min
Views24K
Доброго дня, новички, сегодня мы попытаемся переделать нашу игрушку, разучивая основы новых для нас «технологий»:

  • AngularJS
  • DataBoom

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

Ну а во второй части с помощью DataBoom создадим замечательную очередь событий, как в оригинальной игре (напоминаю, что делаем по образу и подобию HeartStone). Забегая вперед скажу, что в следующий раз мы вообще избавимся от php сервера, и полностью перейдем на Databoom, но это уже совсем другая статья…

image

Читать дальше →
Total votes 29: ↑23 and ↓6+17
Comments6

Делаем месенджер для параноиков на Webix и DataBoom

Reading time5 min
Views10K
Для тех, кто еще не запустил конвейер по производству веб-приложений, я покажу, насколько это просто и быстро.
Именно для скорости я взял «скоростную» связку webix+databoom.

С помощью webix мы будем разрабатывать наш фронт-энд, а databoom послужит бэк-эндом.

Что в итоге должно получиться? Приложеньице, с помощью которого два (или более?) пользователя смогут обмениваться информацией не подкармливая свою паранойю.

Набор элементов следующий:
  • Текстовое поле для сообщения
  • Поле для псевдонима
  • Кнопка отправки сообщения
  • Сам список сообщений
  • Дополнительные опции

Читать дальше →
Total votes 13: ↑10 and ↓3+7
Comments31

Level Up для новичков: gulp и requirejs

Reading time11 min
Views52K


Предисловие


Качество приложения зависит не только от того, какие задачи и с какой скоростью оно решает, но и от таких, казалось бы, второстепенных факторов как «красота кода».

Под красотой кода я (полагаю, и многие другие) понимаю:

  • Читабельность
  • Простоту изменения и дополнения
  • Возможность другим разобраться, как это работает

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

Давайте разберёмся с двумя инструментами, которые не смотря на свою простоту повысят презентабельность исходников вашего приложения и наведут порядок в голове.
Читать дальше →
Total votes 27: ↑20 and ↓7+13
Comments71

Создание игр без canvas: Matreshka.js

Reading time5 min
Views16K
Добра всем хаброчитателям!

В прошлой статье мы рассматривали способ создания карточных игр с помощью манипуляций с DOM, без использования canvas, на подобии HeartStone.

Сегодня мы продолжим эту тему, подключив к нашему делу полезнейшую в данном случае библиотеку Matreshka.js.
image
Читать дальше →
Total votes 14: ↑11 and ↓3+8
Comments10

Шишки об матрешку

Reading time5 min
Views13K
Недавно вышла новая версия Matreshka.js.

image

В документации на первой же странице написано, что разобраться сможет даже новичок, фреймворк очень простой.

Так гласит документация, но на деле подводные камни присутствуют, особенно учитывая «для новичков» и примеры в документации, которые сбивают с толку.
Читать дальше →
Total votes 18: ↑16 and ↓2+14
Comments11

Корзинка для каталога товаров (minibasket.js)

Reading time2 min
Views6.8K
Недавно очередной раз встала задача улучшить юзабилити каталога товаров. Полный функционал интернет-магазина заказчику был не нужен, а вот возможность для пользователей складывать товары в корзину оказалась крайне нужной. Еще бы, заказчик продает запчасти для авто и пользователю крайне неудобно по телефону перечислять весь список, пусть даже по артикулам.

Решено внедрить промежуточный этап заказа — корзинку. Делать ее будем, естественно, на скриптах, чтобы не привязываться к cms (глядищь где еще пригодится).

На выходе получилась библиотечка, позволяющая прикрутить такую корзинку к любому сайту.
Читать дальше →
Total votes 21: ↑11 and ↓10+1
Comments22

Создание игр без Canvas

Reading time8 min
Views20K
Однажды мне попалась на глаза карточная игра HeartStone от Blizzard. Играя в нее пришла мысль, что подобные вещи можно создавать используя технологии html5, что позволит им быть кроссплатфорсенными. На мой взгляд, подобные вещи могут делать люди, до сих пор занимающиеся только созданием сайтов.

Итак, что мы имеем:
  • Выделенный сервер с LAMP (без phpDaemon);
  • Желание обкатать WebSockets.


Собственно, все. Этого вполне хватит, чтобы осуществить задуманное.
Читать дальше →
Total votes 23: ↑19 and ↓4+15
Comments13

Information

Rating
Does not participate
Location
Москва, Москва и Московская обл., Россия
Date of birth
Registered
Activity