JavaScript

Всё о JavaScript. Основные понятия, фишки, хаки, личные наработки.
Перехват запросов и ответов JavaScript Fetch API
JavaScript

Перехват запросов и ответов JavaScript Fetch API

Перехватчики - это блоки кода, которые вы можете использовать для предварительной или последующей обработки HTTP-вызовов, помогая в обработке глобальных ошибок, аутентификации, логирования, изменения тела запроса и многом другом. В этой статье вы узнаете, как перехватывать вызовы JavaScript Fetch API. Есть два типа событий, для которых вы можете захотеть перехватить HTTP-вызовы:
4 min read
Как настроить Axios в приложении Nuxt
Nuxt

Как настроить Axios в приложении Nuxt

Вы, вероятно, слышали про axios или использовали его в своих веб-приложениях. Axios - это HTTP-клиент для браузера и node.js. Он значительно упрощает работу с API-запросами. Если вы работаете с Nuxt, есть официальный модуль, который ещё больше упрощает задачу интеграции этой библиотеки в фреймворк: @nuxtjs/axios. Именно на нём я
5 min read
Начало работы с Axios в Nuxt
Nuxt

Начало работы с Axios в Nuxt

В этой статье я расскажу, как делать запросы в приложении на Nuxt.js с помощью модуля Axios. Вы также узнаете, как использовать методы asncData и fetch для получения данных на стороне сервера с помощью Axios и в чем разница между этими двумя методами. И, наконец, я покажу, как добавить аутентификацию
15 min read
Работа с Vuex в Nuxt
Nuxt

Работа с Vuex в Nuxt

В одной своей статье я уже рассказывал о лучших практиках работы с Vuex в больших приложениях. А в этой статье я покажу вам, как начать работу с Vuex в приложении Nuxt. Как создать свой первый Vuex модуль и как вы можете управлять состоянием в ваших компонентах и страницах приложения Nuxt.
6 min read
Как работать с мета-данными в Nuxt
Nuxt

Как работать с мета-данными в Nuxt

Что такое мета-данные? Сначала давайте поговорим о том, что такое метаданные. Вы можете указывать информацию о html-документе в тегах <meta>. Мета-теги располагаются внутри элемента <head> html-документа. Метатеги могут содержать информацию о следующем: * Информация для браузера о том, как отображать HTML-документ * Инструкции для поисковых систем о том,
5 min read
Как привязать методы класса к экземпляру класса с контекстом this
JavaScript

Как привязать методы класса к экземпляру класса с контекстом this

Есть несколько способов обеспечить доступ к this в методах класса JavaScript. В этой статье мы быстро рассмотрим наиболее распространенные способы реализации этой задачи, обсудив преимущества и недостатки каждого из них. Проблема появляется, когда у нас есть метод класса, похожий на этот: class Logger { printName (name = 'some log message'
3 min read
Пересечение, разница, слияние двух массивов в JavaScript ES6
JavaScript

Пересечение, разница, слияние двух массивов в JavaScript ES6

В этой статье я решил поделиться с вами некими магическими ES6 подходами по решению распространенных задач по нахождению в JavaScript пересечения массивов, поиск непересекаемых значений массива, или объединение всех элементов. Эти задачи очень распространенные, но, иногда, мы слишком мудрИм, решая их. В этой статье я поделюсь с вами элегантными решениями,
3 min read
Определяем горизонтальный и вертикальный центр элемента в JavaScript
JavaScript

Определяем горизонтальный и вертикальный центр элемента в JavaScript

Мне часто приходится вычислять горизонтальный и вертикальный центры элемента в JavaScript. Одним из отличных практичных примеров является подобное всплывающее окно: Чтобы идеально спозиционировать всплывающее окно, мне нужно знать горизонтальный и вертикальный центры кнопки, которая триггерит вызов всплывающего окна. Вот пример расчёта, который нужно сделать, чтобы вычислить центр: Ещё один отличный
2 min read
Про мутацию данных в JavaScript
JavaScript

Про мутацию данных в JavaScript

Мутация означает изменение формы или природы. Что-то, что является мутабельным - может быть изменено, и аналогично, что является иммутабельным - не может быть изменено. Чтобы представить мутацию, подумайте о Людях Икс. В Людях Икс люди могут внезапно обрести силу. Проблема в том, что вы не знаете, когда эти силы появятся.
7 min read
Перебор элементов объекта в JavaScript
JavaScript

Перебор элементов объекта в JavaScript

Время от времени может понадобиться пройтись циклом по свойствам объектам в JavaScript. Единственным способом сделать это, перед выходом ES6, было с помощью цикла for...in. Проблема с циклом for...in заключается в том, что итерация происходит так же учитывая свойства в цепочке Prototype. При цикле по объекту с помощью for.
2 min read
Почему я предпочитаю React, а не Vue
JavaScript

Почему я предпочитаю React, а не Vue

Vue - это JavaScript фреймворк по дефолту поставляемый в Laravel приложениях (до 6 версии). Я, являясь частью сообщества Laravel, часто получаю вопрос, по предпочтению React в противовес Vue. Ввиду этого, я решил написать статью, где расскажу о нескольких примечательных причинах своего выбора. Ранее я уже писал статьи по React. В
4 min read
Vue шаблоны на JSX
Vue Js

Vue шаблоны на JSX

В своем последнем проекте, на работе, я экспериментирую с JSX шаблонами в Vue. Vue предлагает первоклассную поддержку JSX с практически нулевой конфигурацией, но, похоже, в экосистеме Vue JSX используется нечасто. Вот список того, что мы получим от использования JSX с Vue. Каждый из этих пунктов подробно рассматривается ниже. Аргумент ЗА
6 min read
Пиши CSS-селекторы как BOSS
JavaScript

Пиши CSS-селекторы как BOSS

Что такое CSS-селектор? Селекторы CSS - это шаблоны, используемые для выделения элемента(ов), с которыми вы хотите взаимодействовать. Они могут быть использованы в ваших CSS-файлах, в вашем JavaScript-коде или в ваших автоматических тестах. Аналогия ресторана Использование CSS-селектора для выбора элемента - это все равно, что рассказать кому-то, как добраться до
4 min read
Лучший способ изучения frontend веб-разработки
JavaScript

Лучший способ изучения frontend веб-разработки

Почему именно веб-разработка? Веб-разработка - это область, которая в ближайшее время никуда не денется. Веб сейчас развивается очень быстро, и каждый день всё больше и больше внедряется функций, решающих большинство потребностей пользователей. Облачные приложения позволили нам выполнить тяжелую работу в облаке и использовать браузер в качестве связующего звена для подключения
5 min read
Что лучше всего изучать в 2020 году: Angular, React, или Vue.js
JavaScript

Что лучше всего изучать в 2020 году: Angular, React, или Vue.js

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

Лучшие практики JavaScript: именование, стиль и комментарии

Как и любой другой язык программирования, JavaScript имеет свой собственный список лучших практик, призванных упростить чтение и поддержку программ. В JavaScript есть много хитрых деталей, а это значит, что есть определенные паттерны или особенности, которых следует избегать, или, наоборот, следовать. Потому, важно следовать некоторым народным практикам, создавая JavaScript код легким
4 min read
Знакомство с React за 5 минут - учебное пособие React.js для новичков
react

Знакомство с React за 5 минут - учебное пособие React.js для новичков

Этот туториал даст вам базовые знания о React, на примере создания очень простого приложения. Я упущу все, что, как мне кажется, не относится к базовым деталям ядра. В этой статье я расскажу лишь об основах, для формирования понимая азов React-a. Эта статья будет отправной точкой для ваших начинаний и глубокого
5 min read
Использование веб воркеров во VueJs
Vue Js

Использование веб воркеров во VueJs

Как и большинство разработчиков, когда Веб Воркеры впервые появились в JavaScript, я был очень воодушевлён и наполнен энтузиазмом на создание невероятных вещей, благодаря ему. Однако, мой энтузиазм был быстро испепелён, когда я понял, что воркеры должны создаваться в отдельном файле, расположенном на веб-сервере. Это казалось огромной болью, которая не стоила
2 min read
Простое объяснение, что такое Webworkeр-ы в JS и как с ними работать
JavaScript

Простое объяснение, что такое Webworkeр-ы в JS и как с ними работать

Как ваш JS-код может выполнять несколько задач параллельно в фоне? Для этого существуют Webworker-ы, позволяющие реализовать такой функционал. В этой статье я расскажу, как с ними работать, познакомлю вам с Webworkers API, и покажу, как в JS выполнять задачи в фоне, в отрезе от кода текущей веб-страницы. Для того, чтобы
9 min read
Как передать данные в компонент VueJs из Laravel
Vue Js

Как передать данные в компонент VueJs из Laravel

Очень часто при разработке на Laravel я использую VueJs для построения крутых и прогрессивных шаблонов. Но, при работе я очень часто сталкивался с проблемой - моему компоненты необходимо получать инициализирующие данные от системы. И сегодня я расскажу, как можно передать данные: массивы, объекты, булевы значения, или любые другие примитивные данные
5 min read