Все потоки

JavaScript *

Прототипно-ориентированный язык программирования

269,32

Рейтинг

СтатьиПостыНовостиАвторыКомпании

vlad1953 24 июл 2018 в 12:19

Использование функций JavaScript для построения 3D-моделей

10 мин

8.3K

3D-графика * Математика * WebGL * JavaScript *

Из песочницы

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

Для отображения моделей, предварительно рассчитанных с помощью функций из библиотеки WebGeometry, применяется библиотека ThreeJS. Холст (canvas) HTML5 используется для показа отдельных плоских элементов моделей и вывода на экран вспомогательной информации.

Читать дальше →

+20

ru_vds 24 июл 2018 в 08:58

Node.js и серверный рендеринг в Airbnb

19 мин

13K

Блог компании RUVDS.comJavaScript * Node.JS * Веб-разработка * Серверная оптимизация *

Перевод

Материал, перевод которого мы публикуем сегодня, посвящён рассказу о том, как в Airbnb оптимизируют серверные части веб-приложений с прицелом на всё более широкое использование технологий серверного рендеринга. В течение нескольких лет компания постепенно переводила весь свой фронтенд на единообразную архитектуру, в соответствии с которой веб-страницы представляют собой иерархические структуры React-компонентов, наполняемые данными из их API. В частности, в ходе этого процесса шёл планомерный отказ от Ruby on Rails. На самом деле, Airbnb планирует переход на новый сервис, основанный исключительно на Node.js, благодаря которому в браузеры пользователей будут попадать полностью готовые страницы, отрендеренные на сервере. Этот сервис будет формировать большую часть HTML-кода для всех продуктов Airbnb. Движок рендеринга, о котором идёт речь, отличается от большинства используемых компанией бэкенд-сервисов в силу того, что он не написан на Ruby или Java. Однако отличается он и от традиционных высоконагруженных Node.js-сервисов, вокруг которых построены ментальные модели и вспомогательные инструменты, используемые в Airbnb.

Читать дальше →

+27

m512781 24 июл 2018 в 07:37

CSS-in-JS — мифы и реальность (на примере styled-components)

8 мин

69K

CSS * JavaScript * ReactJS *

CSS-in-JS, будучи не совсем новой технологией и реализованной во множестве библиотек, до сих пор вызывает сомнения и споры в целесообразности ее использования. Свои точки над «i» в спорах о CSS-in-JS в общем, и о styled-components в частности, расставил еще год назад, ( 27 Apr 2017 ), и Gajus Kuizinas, автор react-css-modules и babel-plugin-react-css-modules, во все еще, на мой взгляд, актуальной публикации «Прекратите использовать CSS-in-JavaScript в веб-разработках».
Ниже предлагается слегка сокращенный ее перевод с некоторыми добавлениями и выводами:

Читать дальше →

+14

frostspb 23 июл 2018 в 18:39

Подключение bootstrap в Next.js

2 мин

11K

Туториал

Категорически приветствую.

Столкнулся я тут с необходимостью подключить Bootsrtap в Next.js. Беглый гуглёж дал несколько тем на stackoverflow, парочку монструозных (всё в одном и все пакеты устарели ) шаблонов на гитхабе, и немножечко оффдоков. На деле же всё оказалось довольно тривиально, но, надеюсь, эта заметка сэкономит кому-то время.

Читать дальше →

+5

Alexufo 23 июл 2018 в 10:29

Адаптивный Waveform для вашего аудиосервиса

6 мин

9.7K

JavaScript * PHP * Алгоритмы * Интерфейсы * Обработка изображений *

Туториал

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

При планируемом будущем редизайне сайта и, возможно, будущих мобильных приложений, растровый waveform тут просто клином упирался. Он не адаптивен, его крайне ресурсоемко редизайнить, если он в растре.

Читать дальше →

+18

ru_vds 23 июл 2018 в 09:43

О генераторах в JavaScript ES6, и о том, почему изучать их необязательно

4 мин

28K

Блог компании RUVDS.comJavaScript * Веб-разработка *

Перевод

С ростом популярности конструкции async/await растёт и интерес к её внутренним механизмам. Порывшись в интернете, несложно выяснить, что в основе async/await лежат широко известные промисы, и генераторы, которые пользуются куда меньшей известностью и популярностью.

Материал, перевод которого мы сегодня публикуем, посвящён генераторам. А именно, тут мы поговорим о том, как они работают, и о том, как они, совместно с промисами, используются в недрах конструкции async/await. Автор этой статьи говорит, что генераторы, ради их практического применения, осваивать необязательно. Кроме того, он отмечает, что он рассчитывает на то, что читатель немного разбирается в промисах.

Читать дальше →

+21

alexzfort 22 июл 2018 в 20:28

Дайджест свежих материалов из мира фронтенда за последние две недели №323 (8 — 22 июля 2018)

4 мин

13K

Блог компании Zfort GroupВеб-разработка * JavaScript * HTML * CSS *

Предлагаем вашему вниманию подборку с ссылками на новые материалы из области фронтенда и около него.

Читать дальше →

+27

jreznot 22 июл 2018 в 19:01

Выбираемся из кроличей норы SPA при помощи современного Rails

15 мин

11K

JavaScript * Ruby on Rails * Веб-разработка *

Перевод

TL;DR: Тропа SPA темна и полна ужасов. Ты можешь бесстрашно сражаться с ними… или выбрать другой путь, который приведёт тебя к нужному месту: современный Rails.

Я вспоминаю, как думал, что Rails фокусируется на неправильной цели, когда DHH анонсировали Turbolinks в 2012 году. Тогда я был убеждён в том, что мгновенное время ответа во время взаимодействия с пользователем — это ключ к превосходному UX. Из-за возникающих задержек сети, такая интерактивность возможна, только если вы минимизируете зависимость от сети и вместо сетевых обращений поддерживаете большую часть состояния на клиенте.

Я думал, что это необходимо для приложений, над которыми я работал. И с таким мнением я перепробовал множество подходов и фреймворков для реализации одного и того же шаблона: Single-page applications (SPA). Я верил, что SPA — это будущее. Несколько лет спустя, я не уверен в том, каково же будущее, но я точно хочу найти альтернативу.

Читать дальше →

+22

saggid 22 июл 2018 в 12:27

Запрещаем говнокод, или полезные плагины для ESLint

4 мин

65K

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

Сегодня я хочу затронуть тему ESLint'а, прекрасного инструмента для проверки JavaScript проектов на наличие ошибок.

Я не буду писать в этой статье об очевидных моментах, вроде настройки eslint'а для вашего проекта: надеюсь, вы сможете самостоятельно прочесть документацию по этой части и подключить его к себе. А здесь мы обсудим, какой дополнительный «обвес» можно подключить к изначальному инструменту и как его можно настроить, чтобы заставить работать его с наибольшей пользой для вас.

Читать дальше →

+10

PaulMaly 21 июл 2018 в 23:46

Re: «Сравнение JS-фреймворков: React, Vue и Hyperapp»

7 мин

16K

JavaScript * ReactJS * SvelteJS * VueJS * Веб-разработка *

Это небольшая ответная статья на публикацию «Сравнение JS-фреймворков: React, Vue и Hyperapp». Вообще я не большой фанат подобных сравнений. Однако раз уж речь зашла о таком маргинальном фреймворке, как Hyperapp, в сравнении с мастодонтами, типа React и Vue, я подумал, почему бы не рассмотреть все те же примеры на Svelte. Так сказать, для полноты картины. Тем более, это займет буквально 5 минут. Поехали!

Читать дальше →

+21

ihormihal 20 июл 2018 в 09:51

Простой редактор изображений на VueJS

8 мин

13K

Обработка изображений * VueJS * JavaScript * CSS *

Из песочницы

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

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

Читать дальше →

+11

ru_vds 20 июл 2018 в 09:28

Сравнение JS-фреймворков: React, Vue и Hyperapp

13 мин

21K

Блог компании RUVDS.comВеб-разработка * VueJS * ReactJS * JavaScript *

Перевод

Автор материала, перевод которого мы сегодня публикуем, полагает, что Hyperapp — это заслуживающая внимания альтернатива таким веб-фреймворкам, как React или Vue. Он говорит, что причиной такого утверждения стало то, что он выяснил, что Hyperapp легче в освоении, чем эти два фреймворка. Его идея подверглась критике, так как кажется, что основана она исключительно на его мнении, а такой подход попросту не даёт другим фреймворкам возможности показать их сильные стороны. Эта статья направлена на объективный анализ Hyperapp, React и Vue, проведённый на основе простых примеров, демонстрирующих их возможности, и на основе результатов их испытаний.

Читать дальше →

+13

feldgendler 19 июл 2018 в 14:36

Конкурс по программированию: Торговля (промежуточные результаты и объявления)

3 мин

6K

Блог компании HolaJavaScript * Алгоритмы * Занимательные задачкиСпортивное программирование *

Большое спасибо всем участникам конкурса по программированию! Приём решений ещё не закончен, но в полночь на 17 июля мы взяли тот набор решений, который был на тот момент, и провели между ними мини-турнир. В него попали 82 решения.

Но сначала — несколько объявлений.

Конкурс продлевается на неделю

Срок приёма решений продлевается до 27 июля 2018, 23:59:59 UTC. Также на неделю вперёд сдвигаются сроки, в которые будут объявлены результаты конкурса. Мы продлили конкурс для того, чтобы улучшить охват в сезон отпусков.

Читать дальше →

+11

GlukKazan 19 июл 2018 в 06:43

Dagaz: Орда

7 мин

3K

JavaScript * Usability * Дизайн игр * Логические игрыРазработка игр *

Мильоны — вас. Нас — тьмы, и тьмы, и тьмы.
Попробуйте, сразитесь с нами!
Да, скифы — мы! Да, азиаты — мы…

Александр Блок "Скифы"

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

+12

OlegSchwann 18 июл 2018 в 18:20

Благодаря WebAssembly можно писать Frontend на Go

9 мин

25K

Go * JavaScript * WebAssembly * БраузерыПрограммирование *

Туториал

Оригинал статьи.

В феврале 2017 года член команды go Brad Fitzpatrick предложил сделать поддержку WebAssembly в языке. Спустя четыре месяца в ноябре 2017 автор GopherJS Ричард Музиол начал реализовывать идею. И, наконец, полная реализация была смержена в mаster. Разработчики получат wasm примерно в августе 2018, с версией go 1.11. В результате, стандартная библиотека берёт на себя почти все технические сложности с импортом и экспортом функций, знакомых вам, если вы уже пробовали компилировать Си в wasm. Звучит многообещающе. Давайте посмотрим, что можно сделать с первой версией.

Читать дальше →

+14

MaxRokatansky 18 июл 2018 в 16:05

Открытый вебинар «CSS препроцессоры»

1 мин

2.8K

Блог компании OTUSПрограммирование * JavaScript *

Всем привет!

Делимся с вами очередным открытым уроком, который проходил в рамках курса «Разработчик JavaScript», на тему «CSS препроцессоры». На вебинаре Юрий Дворжецкий рассказывает как настроить и использовать LESS и SASS/SCSS для ускорения профессиональной вёрстки, о возможностях и особенностях препроцессоров, которые позволят эффективно использовать Mobile-first вёрстку, БЭМ и UI фреймворки.

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

+7

vzhicharra 18 июл 2018 в 14:03

Аналоги в Python и JavaScript. Часть вторая

5 мин

7.6K

JavaScript * Python *

Recovery Mode

Продолжаем публикацию перевода серии статей о схожести и различии двух языков.

Сегодня поговорим о сериализации словарей, JSON, регулярках, об ошибках и исключениях.

Другие статьи в этой серии:

Первая часть — приведение к типу, тернарный оператор, доступ к свойству по имени свойства, словари, списки, строки, конкатенация строк.
Эта статья
Часть третья: современные Python и JS: строковые шаблоны (f-строки), распаковка списков, лямбда-функции, итерации по спискам, генераторы, множества.
Четвертая часть — аргументы функций, создание и работа с классами, наследование, геттеры-сеттеры и свойства класса.

Читать дальше →

+4

tenebricosa 18 июл 2018 в 04:02

Видео с митапа UralJS #8 — работаем с сырыми данными в браузере и пишем навыки для Алисы

1 мин

2.3K

Блог компании КонтурВеб-разработка * КонференцииJavaScript * Проектирование API *

5 июля прошёл восьмой митап UralJS. Сотня уральских разработчиков собралась послушать лёгкие летние доклады — меньше теории, больше демок и лайв-кодинга.

Выступали ребята из Яндекса и Контура. Вот о чём они рассказали:

Читать дальше →

+10

ru_vds 17 июл 2018 в 10:22

JavaScript ES6: слабые стороны

8 мин

18K

Блог компании RUVDS.comВеб-разработка * JavaScript *

Перевод

В июне 2018 года стандарт ECMAScript 2015 (ES6) отметил свой трёхлетний юбилей. В ES6, во-первых, появилось множество новых возможностей JavaScript, во-вторых, с этого стандарта начинается новая эра развития языка. Кроме того, это был последний масштабный релиз JS, так как теперь TC39 применяет схему выпуска небольших ежегодных выпусков стандарта, а не выводит его новую редакцию раз в несколько лет.

Последние 4 года ES6, вполне оправданно, привлекает к себе всеобщее внимание. Автор материала, перевод которого мы сегодня публикуем, говорит, что он, всё это время, благодаря Babel, писал весь код с использованием современного варианта спецификаций JS. Он полагает, что прошло достаточно времени для того, чтобы критически проанализировать новые возможности ES6. В особенности его интересует то, чем он некоторое время пользовался, а потом пользоваться перестал из-за того, что это ухудшало его код.

Читать дальше →

+15

kyoumur 16 июл 2018 в 17:40

Метапрограммирование в JavaScript

17 мин

24K

Блог компании DocsvisionJavaScript * Веб-разработка *

Туториал

Метапрограммирование — вид программирования, связанный с созданием программ, которые порождают другие программы как результат своей работы, либо программ, которые меняют себя во время выполнения. (Википедия)

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

+35

1 2 ...

319

320 321 ...