JavaScript: статьи, примеры и приминение при создании сайта


JavaScript — объектно-ориентированный скриптовый язык программирования, используется многими программистами для придания интерактивности веб страницам.

Основные архитектурные черты: прототипное программирование, динамическая типизация, автоматическое управление памятью, слабая типизация, , функции как объекты 1-го класса.

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

Мы рассмотрим основные аспекты его использования, софт, видео обзоры и уроки.

Читать статью
Захват видео с камеры с помощью JavaScript и HTML5
Категория: JavaScript Тип материала: Статьи Просмотров: 82

Браузеры на данный момент поддерживают метод getUserMedia только через https протокол. Это значит, что вам нужно будет SSL сертификат для этого API.

Клиентские API очень быстро распространяются между десктопными и мобильными устройствами. Конечно же, мобильные API получили доступ к камере первыми, но сейчас эти методы медленно мигрируют на десктопы также.

 

Давайте посмотрим, как просто можно получить захват фото и видео с веб камеры при помощи нескольких строк HTML и JS кода.

7 инструментов для разработки прогрессивного веб приложения (Progressive Web App)
Категория: JavaScript Тип материала: Статьи Просмотров: 74

Современный веб переживает интересный период. Мы уже знаем о скорости загрузки, читабельности, юзабилити, дизайне. Теперь наступила новая эра мобильных веб приложения, или Progressive Web App.

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

Если вы хотите выйти на новый уровень, то вам стоит развивать PWA, чтобы предоставить посетителю новые впечатления от пользования продуктом.

Progressive Web App – от А до Я: что это? Как создать прогрессивное веб приложение?
Категория: JavaScript Тип материала: Уроки Просмотров: 89

Progressive Web Appэто веб приложение, которое обладает рядом преимуществ, использует передовые возможности браузеров, и может быть добавлено как ярлык на ваш рабочий стол. Его поведение в целом напоминает нативные приложения.

В этом уроке мы будем рассматривать все моменты которые стоить знать о Progressive Web App (дальше PWA). Шаг за шагом, с примерами кода и демо приложением. Как пример, мы будем создавать приложение для создания селфи.

 

JS без jQuery: 10 примеров кода, которыми можно обойтись без jquery
Категория: JavaScript Тип материала: Статьи Просмотров: 1122

Отличные примеры кода, рабочие, которые полноценно замещают функционал jQuery библиотеки.

Смотрите и наслаждайтесь готовыми примерами js кода, который призван разрешить наболевшие броблемы, не прибегая к использованию библиотек.

JQuery + xCharts графики: создайте красивые графики для вашего приложения
Категория: JavaScript Тип материала: Уроки Просмотров: 26280

Графики являются отличным наглядным пособием при предоставлении данных. Без них невозможно создать качественную админ-панель. Их не так легко установить. Однако, существует новая библиотека, которая облегчает эту задачу - xCharts.

Mustache.js – обзор, начало работы, разработка HTML шаблонов с mustache
Категория: JavaScript Тип материала: Статьи Просмотров: 17309

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

Mustache.js предоставляет хорошо документированную шаблонную систему, которая может быть использована для управления HTML шаблонов.

JSON формат: создание данных, использование с PHP и JS
Категория: JavaScript Тип материала: Статьи Просмотров: 82895

Что такое JSON и на что он способен? В этой статье вы узнаете, как использовать JSON для легкой работы с данными. Так же мы рассмотрим, как работать с JSON используя при этом PHP и JavaScript.

Если вы разрабатывали вебсайты или веб-приложения в целом, вероятней всего вы слышали о JSON, по крайней мере, мимолетом. Но, что конкретно значит JSON? Что может делать этот формат данных и как им пользоваться?

Загрузка нескольких файлов на jQuery, с прогрессбаром
Категория: JavaScript Тип материала: Статьи Просмотров: 7231

Стандартное файловое поле ввода в браузере не поддерживает выбор и загрузку нескольких файлов. Также не показывается сколько файлов выбрано для загрузки на сервер. Ранее описывались разные методы загрузки файлов с помощью ajax, среди которых вкратце рассматривалась мульти загрузка файлов. Но та статья не полностью обозревает принцип работы загрузчиков.

Сегодня мы узнаем как создать свой, полноценный загрузчик нескольких файлов на jQuery. Этот загрузчик позволит выбирать несколько файлов с помощью CTRL/SHIFT а также будет отображать прогрессбар состояния загрузки каждого из файлов.

Создаем jQuery popup окно
Категория: JavaScript Тип материала: Уроки Просмотров: 78234

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

Что мы создадим?

В этом уроке мы создадим простое и красивое popup окно на jquery. Оно будет похоже на то, что используется в twitter. Естественно, вы сможете придать стиль, какой вам по душе.

Создаем слайдер картинок на jQuery
Категория: JavaScript Тип материала: Уроки Просмотров: 14204

В этом уроке мы создадим оригинальный слайдер картинок с помощью jQuery. Такой же стоит на Mac App Store. Он автоматически пролистывает вниз, после чего самая нижняя картинка выводиться в поле обзора слайда.

Что мы хотим от слайдера?

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

  • Будем пролистывать 4 картинки (можно и больше, если вам это надо)
  • Перелистывание слайдов должно быть автоматическим
  • Картинка с главной области должна красиво исчезнуть
  • Понадобиться две картинки для каждого слайда: большая и маленькая

Начнем разработку слайдера...

Рисование на JavaScript с помощью Paper.js, Processing.js, Raphael.js
Категория: JavaScript Тип материала: Статьи Просмотров: 23935

При создании дизайна сайта, очень удобно использовать рисунки и анимацию основанную на JavaScript фреймверках. Это быстро, удобно и красиво.

Paper.js, Processing.js и Raphael лидирующие библиотеки для рисования на веб страницах средствами javascript. Вы можете использовать технологию Flash, но эти три отлично работают с HTML5 и поддерживают наибольшее число браузеров.

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

Проверка надежности пароля, проверяем пароль на сложность с помощью jQuery
Категория: JavaScript Тип материала: Уроки Просмотров: 13945

В этом уроке, мы создадим красивый индикатор надежности пароля. Он будет определять сложность пароля, и перемещать стрелку индикатора соответственно. В этом нам поможет новый jQuery плагин Complexify. Как только пароль будет достаточно надежным, пользователю можно будет продолжать процедуру регистрации.

Исходные файлы также доступны, вы сможете настроить дизайн так, как вам нравиться.

Создаем кнопку «Наверх» или Scroll to Top на jQuery
Категория: JavaScript Тип материала: Уроки Просмотров: 45240

В этом уроке, мы узнаем, как создать свою Scroll to Top кнопку для длинных страниц. Способ реализации очень прост. Если вы его усвоите, вы сможете настроить кнопку Scroll to Top так, как вам захочется. Преимущество в том, что данная кнопка реализована на популярном фреймверке jQuery, который используется практически на каждом сайте.

Скрипт прогноза погоды для сайта на jQuery + Yahoo API
Категория: JavaScript Тип материала: Уроки Просмотров: 17831

Сегодня мы будем использовать геолокацию, для вывода пользователям персонального прогноза погоды. Большей мерой, наш скрипт будет написан на jQuery, который с помощью AJAX запросов будет получать информацию из двух популярных Yahoo API. После чего эти данные будут использованы для формирования и вывода прогноза погоды для каждого конкретного пользователя.

Пишем jQuery плагин – 12 советов по написанию jquery плагина
Категория: JavaScript Тип материала: Статьи Просмотров: 17350

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

В этой статье мы меньше будем фокусироваться на самом Java Script коде, больше будем уделять внимания практическим советам.