Создание модального компонента с помощью Vue.js

Автор: admin от 16-02-2018, 22:00, посмотрело: 38

В этой статье вы узнаете, как создать многоразовый модальный компонент с использованием переходов и слотов.



Определение структуры шаблона



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



<template>
  <div class="modal-backdrop">
    <div class="modal">
      <slot name="header">
      </slot>

      <slot name="body">
      </slot>

      <slot name="footer">
      </slot>
    </div>
  </div>
</template>


Обратите внимание на использование слотов? Мы могли бы использовать реквизиты для создания заголовка, тела и нижнего колонтитула, но использование слотов позволит обеспечить большую гибкость.



Использование слотов позволяет нам легко использовать один и тот же модальный вид с различными типами содержимого тела. Мы можем использовать модальный, чтобы показать простой текст, но мы можем захотеть повторно использовать тот же модальный форма, чтобы отправить запрос. Хотя реквизита обычно достаточно для создания компонента, предоставление HTML через опору потребует от нас использовать его v-htmlдля рендеринга — что может привести к атакам XSS.



Здесь мы используем именованные слоты, чтобы мы могли использовать более одного слота в одном компоненте.

Категория: Операционные системы » Android

 

Мышление в стиле Ramda: первые шаги

Автор: admin от 13-02-2018, 08:35, посмотрело: 33

Недавно я познакомился с замечательной серией статей "Thinking in Ramda", которые проясняют на простых и ясных примерах способы написания кода в функциональном стиле с использованием библиотеки Ramda. Эти статьи показались мне настолько прекрасными, что я не смог удержаться от того, чтобы не перевести их на русский язык. Надеюсь, что в этом будет польза для многих людей :) Давайте начнём перевод с первой вступительной статьи.



1. Первые шаги

2. Сочетаем функции

3. Частичное применение (каррирование)

4. Декларативное программирование

5. Бесточечная нотация

6. Неизменяемость и объекты

7. Неизменяемость и массивы

8. Линзы

9. Заключение



Данный пост — это начало серии статей «Мышление в стиле Ramda» о функциональном программировании.



Я буду использовать библиотеку Ramda в этих статьях, хотя многие из обсуждаемых идей применимы также к множеству других библиотек, таких как Underscore и Lodash, а также к другим языкам программирования.



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

Категория: Операционные системы » Linux

 

Сделаем это по-быстрому: бот на Dialogflow и Voximplant

Автор: admin от 12-02-2018, 10:25, посмотрело: 39

Голосовые боты были и остаются полезной фичей для общения с клиентами. Потому что если что-то возможно автоматизировать, то надо срочно это делать. Подтверждение заказов и информация о них, запись обратной связи от клиентов, распознавание голоса и действия согласно тому, что распозналось и т.д. Кстати, о последнем – сделать бота с распознаванием в 2018 году стало еще проще: Voximplant отлично умеет распознавать и транскрибировать речь, а инструмент Dialogflow от “корпорации добра” хорошо анализирует текст. Ниже я покажу, как можно быстро собрать демо-бота, который расскажет о погоде в названном городе.



Сделаем это по-быстрому: бот на Dialogflow и Voximplant

Категория: Операционные системы » Android

 

GeekBrains начинает готовить JavaScript-разработчиков полного цикла

Автор: admin от 7-02-2018, 14:00, посмотрело: 32

GeekBrains начинает готовить JavaScript-разработчиков полного цикла

На нашем обучающем портале открывается новая профессия — Fullstack javascript-разработчик. С помощью актуальных фреймворков ReactJS и Node.js мы научим реализовывать и frontend сайта (то, что пользователь видит в браузере), и серверную часть. Описание и программа под катом.

Категория: Программирование » Game Development

 

Сейчас вы поймете, как отложить вычисления и реализовать ленивую загрузку с помощью IntersectionObserver

Автор: admin от 1-02-2018, 06:45, посмотрело: 39

Жил-был один веб-разработчик, который мог убедительно доказать своим клиентам, что сайты не должны выглядеть одинаково во всех браузерах, уделял внимание доступности и удобству использования и был одним из первопроходцев в применении CSS grids. Но глубоко в сердце настоящей страстью для него была оптимизация производительности: он постоянно что-то оптимизировал, минифицировал, замерял и даже использовал психологические трюки в своих проектах.

Категория: Операционные системы » Android

 

Опыт веб-разработки при создании игры «Составь слова»

Автор: admin от 30-01-2018, 12:50, посмотрело: 30

Опыт веб-разработки при создании игры «Составь слова»



Хочу поделиться своим опытом работы над веб-проектом: реализацией игры «Составь слова». Игра представляет собой известную головоломку, в которой нужно составлять разные слова из одного длинного слова.



Суть статьи — в том, как именно и что конкретно пришлось сделать, чтобы довести всю задумку от идеи до реализации.

Категория: Программирование, Веб-разработка

 

Programmer Unknown's BattleGround: открытая площадка для сражений программистов

Автор: admin от 28-01-2018, 18:35, посмотрело: 63

Programmer Unknown's BattleGround: открытая площадка для сражений программистов



Изначально проект PUBG (просим прощения у оригинальной PUBG за использование их аббревиатуры, мы всего лишь хотим использовать эту игру для развития навыков программирования и не планируем публиковать ее в Steam в будущем) был разработан как внутренний проект нашей студии для развлечения. Затем же мы подумали, что он может быть полезен другим студиям, компаниям и образовательным учреждениям, и опубликовали его под лицензией MIT.

Категория: Программирование

 

Веб-приложение на Node и Vue, часть 5: завершение работы над проектом

Автор: admin от 17-01-2018, 09:50, посмотрело: 41

Перед вами перевод пятой части руководства по разработке веб-решений на базе Node.js, Vue.js и MongoDB. В первой, второй, третьей и четвёртой частях мы рассказывали о поэтапном создании клиентской и серверной частей приложения Budget Manager. Те, кому не терпится увидеть в действии то, что в итоге получилось у автора этого материала, могут заглянуть сюда. Кроме того, вот GitHub-репозиторий проекта. Если вы — из тех, кто ценит строгую типизацию, то здесь и здесь находятся результаты переноса Budget Manager на TypeScript.



Веб-приложение на Node и Vue, часть 5: завершение работы над проектом



Сегодня работа над этим учебным проектом завершится. А именно, в данном материале пойдёт речь о разработке страниц по добавлению в систему записей о новых клиентах и финансовых документах, а также о создании механизмов для редактирования этих данных. Здесь же мы рассмотрим некоторые улучшения API и доведём Budget Manager до рабочего состояния.

Категория: Программирование » Веб-разработка

 

Разделить пользователей по ролям в FeathersJs

Автор: admin от 8-01-2018, 12:35, посмотрело: 53

Разделить пользователей по ролям в FeathersJs

Речь пойдет о недооцененном фреймворке feathersjs.



В двух словах как он работает вы можете почитать тут. Одним рабочим утром мне в месседжере пришло новое ТЗ и описано оно было следующим образом: нужно разделить пользователей для 2-х сервисов (то есть что бы бэк обрабатывал запросы на аутентификацию с двух разных фронтов).



То есть мы имеем: 2 разделенных фронта написанных на VueJs, находящихся на разных доменах именах, общий backend написанный на feathers (и естественно одну таблицу users в бд с ролью).

Категория: Программирование » Веб-разработка

 

Релиз второй версии плагина Nodejs для Sublime Text

Автор: admin от 3-12-2017, 20:45, посмотрело: 84

Добрый день, друзья! В ноябре 2016 года я начал играться с плагином Nodejs для Sublime Text. Плагин был маленьким и имел под катом несколько давних и хорошо известных багов.



В те дни я игрался с Nodejs и моим любимым редактором для кода был Sublime Text. По давно проторенной дорожке, я пошел на packagecontrol.io и поискал плагины для Nodejs. Нашелся вот этот. Поставив и поработав, я был очень разочарован, когда обнаружил, что некоторые заявленные фичи плагина не работают, или работают не так как заявлено…



В таких ситуациях, я обычно, иду на страничку проекта на GitHub и изучаю проект на предмет последней активности, чтобы убедиться, что проект не заброшен. Я обнаружил, что последний коммит был в 2013 году. Печалька, подумал я, учитывая, что это был единственный плагин для работы с Nodejs в Sublime Text.



Тогда я подумал… Это две частички технологии, которые мне нравятся, и я всегда хотел контрибьютить в Open Source.



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

Категория: Программирование

 
Назад Вперед