Предлагаем вашему вниманию подборку с ссылками на новые материалы из области фронтенда и около него.
Рубрика «javascript» - 185
Дайджест свежих материалов из мира фронтенда за последнюю неделю №315 (14 — 20 мая 2018)
2018-05-20 в 21:04, admin, рубрики: angular, css, ES6, html, html5, javascript, JS, React, vue, Блог компании Zfort Group, браузеры, дайджест, подкасты, Разработка веб-сайтов, ссылки, фронтендMaraquia — ORM для MongoDB
2018-05-20 в 16:00, admin, рубрики: javascript, mongodb, nodejs, orm, TypeScriptПосле прочтения заголовка у многих наверняка возникает вопрос — зачем ещё один велосипед при наличии уже обкатанных Mongoose, Mongorito, TypeORM и т. д.? Для ответа нужно разобраться в чём отличие ORM от ODM. Смотрим википедию:
ORM (англ. Object-Relational Mapping, рус. объектно-реляционное отображение, или преобразование) — технология программирования, которая связывает базы данных с концепциями объектно-ориентированных языков программирования, создавая «виртуальную объектную базу данных».
То есть ORM — это именно про реляционное представление данных. Напомню, в реляционных БД нет возможности просто взять и встроить документ в поле другого документа (в этой статье записи таблиц тоже называются документами, хоть это и некорректно), можно конечно хранить в поле JSON в виде строки, но индекс по данным в нём сделать не выйдет. Вместо этого используются "ссылки" — в поле, где должен быть вложенный документ, вместо него записывается его идентификатор, а сам документ с этим идентификатором сохраняется в соседней таблице. ORM умеет работать с такими ссылками — записи по ним автоматически сразу или лениво забираются из БД, а при сохранении не нужно сперва сохранять дочерний документ, брать назначенный ему идентификатор, записывать его в поле родительского документа и только после этого сохранять родительский документ. Нужно просто попросить ORM сохранить родительский документ и всё что с ним связано, а он (object-relational mapper) уже сам разберётся как это правильно сделать. ODM же наоборот, не умеет работать с такими ссылками, зато знает про встроенные документы.
Apollo graphql client — разработка изоморфных (универсальных) приложений на react.js
2018-05-20 в 1:08, admin, рубрики: Apollo, graphql, javascript, node.js, nodejs, Разработка веб-сайтовВ предыдущем сообщении Apollo graphql client применялся для разработки чисто клиентского приложения. В документации Apollo graphql client есть (очень лаконичный) раздел, посвященный серверному рендерингу и изоморфным приложениям.
Одна из сложностей серверного рендеринга в react.js является необходимость асинхронной загрузки данных, т.к. серверный рендеринг в reaсt.js — операция синхронная. Например, фреймверк next.js предлагает для этого использовать специальный компонент page в котором реализован дополнительный метод static async getInitialProps(), в котором предлагается проводить асинхронную загрузку данных. Такое решение не лишено недостатков. Например, этот метод статический, следовательно не имеет доступ к экземпляру компонента, метод реализован только для компонента самого верхнего уровня и отсутствует у вложенных компонентов. Решение с Apollo graphql client может быть использовано для компонента произвольного уровня вложенности.
Читать полностью »
Оптимизация кода, или как начать учиться писать коротко и ясно
2018-05-18 в 17:23, admin, рубрики: javascriptВсех категорически приветствую!
Предисловие
Возможно многие, как и я, задавались вопросом «Как писать код правильно?». И каждый день приходя на работу, оглядываясь по сторонам, я понимаю, что даже в том месте, где много людей, работающих с кодом, помощи в данном вопросе просить не у кого. Каждый занят своим делом, решая задачи, любым доступным способом. И сегодня, придя на работу, я так же столкнулся с задачей, довольно простой задачей. Нужно зафиксировать верхнее меню при прокрутке сайта. И как то глубоко впав в себя, пронеслись мысли — «Готовое решение», «JQ плагин», «зачем целый плагин, можно ведь самому, пару строк ведь», «зачем изобретать велосипед», «а как этот велосипед изобрели», «найти плагин, заглянуть в исходники», «но ведь первый раз кто то писал не заглядывая — некуда ведь», «курица или яйцо», «брр… а как они к этому пришли, надо самому попробовать». И тут я открыл редактор и начал пробовать.
Читать полностью »
JavaScript. Работаем с исключениями и данными в конструкциях async-await без блоков try-catch
2018-05-18 в 16:58, admin, рубрики: async, async/await, await, await/async, javascript, node.js, nodejs, Разработка веб-сайтовПоявившиеся в JavaScript новые асинхроные конструкции async/await выглядят проще, чем Promise, и, конечно, значительно читабельнее, чем «callback-джунгли». Но одна вещь беспокоила меня — это использование try-catch. Сначала я подумал, что это не проблема, но, к несчастью, мне пришлось работать с цепочкой вызовов API, в которой каждый вызов API имел свое сообщение об ошибке, которое должно было прологировано. Вскоре я понял, что создаю «try/catch-джунгли», которые ничем не лучше «callback-джунглей».
Читать полностью »
Руководство по промисам для тех, кто хочет в них разобраться
2018-05-18 в 8:23, admin, рубрики: ES6, javascript, Блог компании RUVDS.com, разработка, Разработка веб-сайтовЛес чуден, тёмен — глянь в глубину.
Но прежде я все долги верну…
И много миль, пока я усну,
Так много миль, пока я усну...
Роберт Фрост
Промисы — это одно из самых замечательных новшеств ES6. JavaScript поддерживает асинхронное программирование посредством функций обратного вызова и с помощью других механизмов. Однако при использовании функций обратного вызова мы сталкиваемся с некоторыми проблемами. Среди них — «ад коллбэков» и «пирамида ужаса». Промисы — это паттерн, который значительно упрощает асинхронное программирование на JS. Асинхронный код, написанный с использованием промисов, выглядит как синхронный и лишён проблем, связанных с коллбэками.
Материал, перевод которого мы сегодня публикуем, посвящён промисам и их практическому использованию. Он рассчитан на начинающих разработчиков, которым хочется разобраться с промисами.
Читать полностью »
GeekBrains открывает набор на бесплатные курсы подготовки программистов
2018-05-17 в 12:59, admin, рубрики: frontend-разработка, geek brains, javascript, mail.ru group, ruby, ruby on rails, Блог компании Mail.Ru Group
Всем привет! Мы открываем набор на бесплатные курсы обучения для Ruby и Frontend-разработчиков. Для участия необходимо пройти конкурс. Пять лучших выпускников пройдут стажировку у нас и останутся работать в офисе. Заявки на обучение принимаются по 17 июня включительно. Подробности набора и программа обучения – под катом.
Frontend 2018: многообразие фреймворков и недостаток миддлов
2018-05-17 в 11:31, admin, рубрики: javascript, Блог компании Конференции Олега Бунина (Онтико), интерфейсы, конференцииFrontend — довольно конкурентная среда. Здесь легко начинать карьеру, но сложно перейти в разряд middle. Вдобавок возникает вопрос, в каком направлении развиваться, если каждый день появляются новые фреймворки и темы для холиваров?
О том, как выглядит и куда движется современный frontend, я расспросил Сергея Попова, члена программного комитета нашей FrontendConf, которая пройдет в конце мая в Москве в рамках РИТ++. Попутно мы поговорили про то, как происходит отбор докладов, и какие тут возникают трудности.
Как я начал любить Vue
2018-05-17 в 8:50, admin, рубрики: angular, html, javascript, TypeScript, vue, vue.js, vuejsВступление
Данный пост — это логическое продолжение моего поста/статьи — Как я перестал любить Angular / How I stopped loving Angular.
Рекомендуется к ознакомлению перед прочтением.
Вот уже около года во всех проектах, в которых я участвую, я использую Vue вместо Angular.
В данном посте я поделюсь основными впечатлениями и отличиями после Angular, а также поведаю некоторые вещи из реального опыта использования Vue на боевых проектах.
Открытая трансляция главного зала HolyJS
2018-05-17 в 7:46, admin, рубрики: holyjs, holyjs2018piter, javascript, Блог компании JUG.ru Group
Послезавтра в Петербурге начнётся двухдневная конференция HolyJS. Мы будем рады видеть всех на мероприятии, но и для отсутствующих тоже кое-что припасли: доклады первого зала можно будет смотреть бесплатно в прямом эфире на YouTube.
Хотя это только часть от общей программы конференции, попало много интересного для самых разных слушателей: тут и «приключения во фронтенде», и производительность Node.js, и мобильный веб, и так далее вплоть до майнинга крипты в браузере.
Сразу сообщаем заветную ссылку: holyjs-piter.ru/online-free. А под катом приводим описания докладов, попавших в бесплатную трансляцию — можно пробежаться по ним и быстро понять, что из этого вам интересно.
Читать полностью »