Как стать автором
Обновить
7
0
Konstantin Chuykov @chuikoffru

JS/TS React Developer

Отправить сообщение

Красивое падение: CSS3-анимация с гравитацией

Время на прочтение3 мин
Количество просмотров51K
Давным давно (летом 2014), когда я усиленно работал с оформлением, передо мной возникла следующая проблема. Я хотел использовать CSS3 для создания эффекта прыгающего мячика с учетом естественных законов физики. Я прошерстил Интернет в поисках какого-нибудь способа, чтобы «вдохнуть» гравитацию в мой мячик.

После нескольких часов просматривания Stackoverflow и доков CSS, я нашел несколько опций, но это все равно не до конца меня устроило. Использование Javascript и Jquery было бы лишним и неэффективным для такой простой задачи, которая, как кажется, должна легко решаться с использованием существующих опций для анимации в CSS3.

Я сначала попытался использовать переходы ease-in (ease-out), которые представлены CSS. Но несмотря на то, что они выглядели достаточно плавными, было слишком сложно добиться ощущения естественности. И каждый новый прыгающий объект нуждался бы в совершенно новой функции, подобрать которую очень трудоёмко. Многие сайты, которые я посещал, предлагали использовать громоздкие keyframe-функции для описания анимации каждого прыжка. Код этих функций выглядит слишком сложным и избыточным. Более того, полученные прыжки объекта выглядели отрывистыми и непрофессиональными.
Решение задачи
Всего голосов 58: ↑37 и ↓21+16
Комментарии12

Лепим Стартап. Начало

Время на прочтение3 мин
Количество просмотров13K
Новый 2015 год. Понедельник. Пора начинать новую жизнь стартап с нуля. После прочтения чуть более чем всех статей по поводу того, как же его начинать ясно одно — ничего не ясно. Пол Грэм (со-основатель Y Combinator), например, считает, что стартапы — нелогичны и все делать надо совсем не так как хочется. А как делать? Для этого можно или попасть в крутой инкубатор или иметь хорошего ментора или же… попробовать пилить свой проект, параллельно проходя онлайн курсы от лучших университетов мира. С января 2015 начинается (повторяется) 2 отличных курса:
Technology Entrepreneurship, от Stanford University Online
Entrepreneurship 101: Who is your customer? от edx (MIT, Harvard)
Можно ли слепить стартап с нуля только при помощи онлайн курсов и интереса?

Читать дальше →
Всего голосов 20: ↑10 и ↓100
Комментарии14

Тренды JavaScript на 2015 год

Время на прочтение19 мин
Количество просмотров112K


Всем привет! Мы как-то задумали сделать легкий вводный курс на тему JavaScript и разработки приложений (он, кстати, скоро будет опубликован): и, пока я собирал материалы к нему, как-то само собой выяснилось, что есть довольно много вещей, которые, так сказать, находятся на переднем крае развития JavaScript. Отсюда родилась идея сделать отдельную обзорную статью в жанре «X трендов на год Y по технологии Z».

Многие из тех, вещей, которые я буду описывать, можно попробовать в той или иной степени уже сегодня (собственно, иначе я бы говорил о космическом будущем, а не о трендах). В этом есть несомненный плюс: если у вас будет свободное время (а на праздниках его обычно много), вам будет чем заняться. Да и, в целом, хорошо начинать новый год с расширения своих горизонтов!
Читать дальше →
Всего голосов 108: ↑88 и ↓20+68
Комментарии76

Почему большие достижения не сделают вас счастливее (и что с этим делать!)

Время на прочтение4 мин
Количество просмотров39K
image

Ранее мы уже знакомили вас с переводами статей Chris Bailey, которые он писал по мере развития своего проекта a Year of Productivity — они доступны в нашем блоге в разделе «личная продуктивность».

Сегодня мы хотели бы познакомить вас с выводами Криса о взаимосвязи между продуктивностью и счастьем.

Итак, даем слово Крису!
Читать дальше →
Всего голосов 34: ↑27 и ↓7+20
Комментарии10

Deferred объекты в AngularJS

Время на прочтение2 мин
Количество просмотров36K
Доброе время суток!

В этом небольшом посте я хочу рассказать про использование Deferred объектов AngularJS.

image

Читать дальше →
Всего голосов 17: ↑10 и ↓7+3
Комментарии2

Вариант условного роутинга в AngularJS

Время на прочтение6 мин
Количество просмотров24K
Я новичок в AngularJS, совсем недавно решил его использовать в своем хобби-проекте. Довольно быстро передо мной встала задача настроить роутинг по определенным условиям, самое простое и очевидное из таких условий — авторизован пользователь или нет. Приложение содержит страницы, открытые любому пользователю, и страницы, куда можно зайти только авторизовавшись. Если авторизации нет, нужно попробовать ее получить прозрачно для пользователя, если это не удалось — средиректить на страницу логина.

На сколько я понимаю, это задача достаточно распространенная, тем не менее я не нашел простого готового способа сделать это из коробки. Потратив изрядное количество времени на гугление, чтение документации и эксперименты, я в итоге нашел достаточно элегантное решение для моего случая. Спешу поделиться своим велосипедом, надеюсь, это поможет сэкономить время таким же начинающим пользователям AngularJS. Возможно, найдется гуру, который укажет на то самое стандартное решение, которое я почему-то не нашел. Я, например, еще не разбирался с ui-router.
Читать дальше →
Всего голосов 22: ↑18 и ↓4+14
Комментарии18

Вскрываем мозг менеджеру по продажам. Как получить инвестиции, продать товар или услугу

Время на прочтение9 мин
Количество просмотров57K
Продавец это совсем не тот кто, звонит всем и каждому и впаривает свои товары. Время говорящих далдонов, которые берут количеством звонков, безвозвратно уходит, особенно в кризис. Почему покупатели покупают менее привлекательную продукцию или услугу, но у более эффективного продавца, и казалось бы продукцию с более высокими характеристиками при той же цене, совсем не покупают у другого? Хотел бы предложить свои мысли по этому вопросу.

Речь пойдет в основном о корпоративных продажах, но и в рознице данной информацией тоже можно воспользоваться. Материал из серии — галопом по Европам, если будет интерес, смогу по каждой стадии написать.



Читать дальше →
Всего голосов 19: ↑13 и ↓6+7
Комментарии10

Авторизация пользователей с AngularJS и Firebase

Время на прочтение4 мин
Количество просмотров17K
В прошлой статье, я рассказывал о Firebase. Сегодня я хочу рассказать как я организовал авторизацию пользователей с использованием AngularJS и Firebase.

На данный момент я работаю, в свободное время над своим проектом, если в вкратце, то это сервис для создания прототипов SPA-приложений, думаю в скором времени я смогу расказать о нем больше, но пока только об авторизации. Почему я выбрал Firebase? Все просто, я очень ленивый программист и не люблю писать велосипеды, а данный сервис предлагает кучу готовых решений среди которых и авторизация и регистрация пользователей.

Для основы проекта я использую ngBoilerplate, так считаю его достаточно удачной сборкой не требующей каких-то особых доработок. В сборке предустановлены Twitter Bootstrap, Angular UI, Angular Bootstrap, Font Awesome и LESS. Также замечательно настроен Grunt и Bower. Для установки и запуска чистого приложения, нужно всего лишь выполнить следующие команды:
$ git clone git://github.com/joshdmiller/ng-boilerplate
$ cd ng-boilerplate
$ sudo npm -g install grunt-cli karma bower
$ npm install
$ bower install
$ grunt watch


Читать дальше →
Всего голосов 18: ↑15 и ↓3+12
Комментарии7

Практикум AngularJS — разработка административной панели

Время на прочтение12 мин
Количество просмотров137K
При создании сайтов часто возникает задача создания админки для редактирования контента. Задача, в общем, тривиальная, но сделать удобную админку не так-то просто.

Под удобством в первую очередь подразумевается возможность сортировки таблицы со списком материалов и работа без перезагрузки страницы. Если материалов в таблице становится много, то возникает задача разбивать её на страницы.

Всем известный jQuery-плагин tablesorter с tablesorterPager-ом и менее известный, но гораздо более функциональный DataTables хороши, но обладают некоторыми недостатками. Главный из них — сложность динамического добавления новых строк в таблицу (после добавления строки в таблицу, новая строка потеряется при следующем вызове сортировки). tablesorter вообще не даёт средств для добавления строки в свой кэш, DataTables предоставляет широкое и функциональное API для управления внутренним представлением таблицы, но это API довольно многословно и не очень гибко.

Хочу предоставить общественности реализацию админки на относительно новой javascript-фреймворке AngularJS. Будет создана страничка для редактирования списка вопросов, разбитых по категориям и отвечающим. В статье нет сравнения с другими подобными фреймворками, но нет и простого повторения официальной документации, я постараюсь поделиться своим опытом в использовании фреймворка и расскажу о нескольких интересных приёмах работы с ним.

Сразу приведу, что получится в итоге (кликабельно):


Читать дальше →
Всего голосов 25: ↑25 и ↓0+25
Комментарии28

HTML5/AngularJS/Nginx приложение с правильным с google-индексированием

Время на прочтение3 мин
Количество просмотров38K
Большинство web-приложений и web-фреймворков используют архитектуру, не позволяющую разделить ui и backend разработку. Тем самым нет возможности разделить команду на узкоспециализированных frontend и backend разработчиков. Вне зависимости от предпочтений разработчика ему приходится иметь понимание как о слое представления, так и о слое логики. Если ui-разработчик знает только о том, как запустить сервер, и о модели данных — это огромная удача. В плохих случаях ui-разработчику необходимо провести полную сборку проекта чтобы увидеть изменения строчки в javascript файле, или знать о языке jsp файлов чтобы поменять стиль элемента. Формирование и передача на сервер обработанных html файлов так-же пагубно влияет на производительность сервера и сети.

non-ajax

Читать дальше →
Всего голосов 33: ↑31 и ↓2+29
Комментарии7

Одностраничный магазин на Phalcon PHP + AngularJS. Работа над ошибками

Время на прочтение9 мин
Количество просмотров39K
image

Введение

Всем привет! Не так давно я написал публикацию «Одностраничный магазин с корзиной на Phalcon + AngularJS + Zurb Foundation», которая имела неоднозначный эффект мягко говоря. А точнее получила много отрицательных комментариев, какие-то были объективные и конструктивные, какие-то нет, и они меня заставили задуматься, почему так произошло, ведь я хотел сделать полезный мануал, который пригодиться мне и другим, начинающим писать на AngularJS.

Исповедь

Да, мануал был полезен для меня, для меня старого, того, кому в 2009 году отказали в работе в местной веб-студии, и он по сей день ни разу ни работал в команде, ни разу не работал на наёмной работе, а полагался только на себя, и главным критерием эффективности реализации проектов был один — главное, что работает. Но это я — старый, после написания той статьи, и множества комментариев, я впервые решил попробовать сделать всё по правилам хорошего тона, хотя бы ради интереса.
Что из этого вышло?
Всего голосов 51: ↑37 и ↓14+23
Комментарии55

Смелый стайлгайд по AngularJS для командной разработки [2/2]

Время на прочтение6 мин
Количество просмотров23K
Первая часть перевода тут.

После прочтения Google's AngularJS Guidelines, у меня создалось впечатление о его незавершённости, а ещё в нём часто намекали на профит от использования библиотеки Closure. Ещё они заявили, «Мы не думаем, что эти рекомендации одинаково хорошо применимы для всех проектов, использующих AngularJS. Мы будем рады видеть инициативу от сообщества за более общий стайлгайд, применимый как для небольших так и крупных проектов».

Отталкиваясь от личного опыта работы с Angular, нескольких выступлений, а также имеющемуся опыту командной разработки, представляю Вашему вниманию этот смелый стайлгайд по синтаксису, написанию кода и структуре приложений на AngularJS.
Читать дальше →
Всего голосов 22: ↑20 и ↓2+18
Комментарии29

Как запустить стартап, не имея денег: личный опыт на примере коворкинга в Таиланде

Время на прочтение8 мин
Количество просмотров101K
Москва-Пхукет - почувствуй разницу

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

В статье я поделюсь опытом открытия довольно необычного заведения хостела-коворкинга-антикафе на Пхукете в Таиланде в формате небольшого рассказа, а в комментариях готов ответить на любые вопросы по теме, Таиланду и Пхукету в частности.
Читать дальше →
Всего голосов 75: ↑47 и ↓28+19
Комментарии82

10 ошибок, мешающих нам измениться

Время на прочтение5 мин
Количество просмотров126K
Примечание переводчика: Некоторое время назад я прочитал замечательную статью на Medium.com. Автор статьи Samuel Thomas Davies взял за основу исследования профессора Стэнфордского университета Би Джей Фогга об изменении поведения. Сегодня я хочу поделиться ее переводом с хабрасообществом.

Менять свое поведение, несомненно, сложно. Необходимо преодолеть препятствия, побороть сопротивляемость и изменить внешние воздействующие факторы.

Очевидно, что делать это намного сложнее, когда вы совершаете ошибки, которые достаточно банальны, но при этом часто недооценены или просто-напросто проигнорированы ввиду их неприметности.

Проблема в том, что у нас есть естественная склонность брать на себя вину за то, что новые привычки не приживаются. Мы полагаем, что реальная проблема в нас, тогда как в действительности, она кроется в стратегии, которую мы использовали.
Читать дальше →
Всего голосов 47: ↑39 и ↓8+31
Комментарии15
12 ...
19

Информация

В рейтинге
Не участвует
Откуда
Петропавловск-Камчатский, Камчатский край, Россия
Дата рождения
Зарегистрирован
Активность