Pull to refresh
0
Никита @kny155read⁠-⁠only

Пользователь

Send message

Карманная книга по TypeScript. Часть 1. Основы

Reading time7 min
Views63K

Обратите внимание: для большого удобства в изучении книга была оформлена в виде прогрессивного веб-приложения.



С сегодняшнего дня мы начинаем серию публикаций адаптированного и дополненного перевода "Карманной книги по TypeScript".


Каждое значение в JavaScript при выполнении над ним каких-либо операций ведет себя определенным образом. Это может звучать несколько абстрактно, но, в качестве примера, попробуем выполнить некоторые операции над переменной message:


// Получаем доступ к свойству `toLowerCase`

// и вызываем его

message.toLowerCase()

// Вызываем `message`

message()

На первой строке мы получаем доступ к свойству toLowerCase и вызываем его. На второй строке мы пытаемся вызвать message.


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


  • Является ли переменная message вызываемой?
  • Имеет ли она свойство toLowerCase?
  • Если имеет, является ли toLowerCase вызываемым?
  • Если оба этих значения являются вызываемыми, то что они возвращают?

Ответы на эти вопросы, как правило, хранятся в нашей памяти, поэтому остается только надеяться, что мы все помним правильно.

Читать дальше →
Total votes 35: ↑30 and ↓5+25
Comments18

Собеседование в Яндекс: театр абсурда :/

Reading time14 min
Views511K

Привет, Хабр!

В прошлой статье меня знатно разбомбили в комментариях, где-то за дело, где-то я считаю, что нет. Так или иначе, я выжил, и у меня есть чем с вами поделиться >:)

Напомню, что в той статье я рассказывал, каким я вижу идеальное собеседование и что я нашёл компанию, которая так и делает - и я туда прошёл, хотя это был адский отбор. Я, довольный как слон, везде отметил, что я не ищу работу, отовсюду удалился и стал работать работу.

Как вы думаете, что делают рекрутеры, когда видят "Alexandr, NOT OPEN FOR WORK"? Правильно, пишут "Алексей, рассматриваете вариант работать в X?" Я обычно игнорирую это, но тут мне предложили попытать счастья с Яндекс.Лавкой, и я не смог пройти мимо - интересно было, смогу ли я устроиться куда-нибудь, когда введут великий российский файерволл. К тому же за последние 3 года я проходил только два интервью, и мне показалось, что я не в теме, что нынче требуется индустрии. Блин, я оказался и вправду не в теме. И вы, скорей всего, тоже - об этом и статья.

Читать далее
Total votes 664: ↑637 and ↓27+610
Comments1270

Шесть принципов создания производительных веб-приложений

Reading time5 min
Views12K

С момента появления интернета веб-разработка прошла очень длинный путь. Это было удивительное путешествие от модемов до оптоволоконных схем. С ростом скорости передачи данных пользователи стали нетерпеливы. Люди ожидают, что их повседневные задачи будут решены здесь и сейчас. Это привело к необходимости создавать сайты, которые работают быстро и без задержек.

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

Веб-разработчики выработали несколько принципов создания сайтов, которые быстро работают даже на самых слабых устройствах. Здесь описаны некоторые из этих принципов. Подчеркну, что они размещены в произвольном порядке.

И последнее: чтобы сохранять баланс между оптимизацией и своевременной поставкой функционала, всегда делитесь и переиспользуйте свой код, точнее — компоненты. Это можно делать с любым репозиторием безо всякой специальной подготовки, достаточно лишь воспользоваться инструментом вроде Bit (Github).

Читать далее
Total votes 29: ↑23 and ↓6+17
Comments9

Дайджест материалов сообщества Deno (01.01 — 31.01)

Reading time1 min
Views1.6K

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

Читать далее
Total votes 3: ↑3 and ↓0+3
Comments0

Архитектурный паттерн Dependency Injection в React-приложении

Reading time15 min
Views37K

Расшифровка доклада Сергея Нестерова с конференции FrontendLive 2020.

Привет! Меня зовут Сергей, уже больше двух лет я работаю в группе компаний Тинькофф. Моя команда занимается разработкой системы для анализа качества обслуживания клиентов в Тинькофф, и, как вы, наверное, догадались, мы используем React в своем приложении. Не так давно мы внедрили в свой проект архитектурный паттерн Dependency Injection совместно с IoC-контейнерами. Сделали мы это не просто так: это позволило нам решить ряд проблем, которые тормозили разработку нового функционала.

Читать далее
Total votes 34: ↑33 and ↓1+32
Comments48

До свидания, Google Fonts. Последний аргумент

Reading time6 min
Views79K


Шрифты Google Fonts страшно популярны. Их загружают более 42,8 миллиона сайтов, в том числе Хабр. Библиотека Google Fonts содержит 1023 свободных шрифта и программные интерфейсы для их внедрения через CSS. Очень удобно, казалось бы.

Во многих статьях отмечалось, в какую цену обходятся многочисленные запросы через API. Совет самостоятельно хостить шрифты дают много лет. Даже сама Google давала такой совет на конференции Google I/O 2018 года в выступлении на тему веб-производительности.

Так почему же многие до сих пор загружают шрифты через Google Fonts API? Ну, был последний аргумент — кэширование. Мол, благодаря общему CDN пользователю не нужно скачивать шрифт заново с каждого сайта. Однако в октябре 2020 года этот аргумент перестал работать. Теперь шрифты Google Fonts больше не кэшируются!
Читать дальше →
Total votes 76: ↑76 and ↓0+76
Comments65

Декораторы в JavaScript с нуля

Reading time10 min
Views35K

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

Декораторы — явление не новое. Они используются и в других языках, например в Python, и даже в функциональном программировании на JavaScript. Но об этом мы поговорим позже.

Читать далее
Total votes 5: ↑4 and ↓1+3
Comments1

Все ли вы знаете о useCallback

Reading time7 min
Views118K

Привет, Хабр!

Начиная с версии ReactJS 16.8 в наш обиход вошли хуки.  Этот функционал вызвал много споров, и на это есть свои причины. В данной статье мы рассмотрим одно из самых популярных заблуждений использования хуков и заодно разберемся стоит ли писать компоненты на классах (данная статья является расшифровкой видео).

Read more
Total votes 16: ↑14 and ↓2+12
Comments70

RxJS и Angular: искусство отписки от уведомлений

Reading time4 min
Views9.1K

Если вы используете Angular и библиотеку RxJS, здесь вы узнаете все способы, которые вам могут понадобиться, чтобы подписываться на уведомления от объектов Observable и отписываться от них!

Мы используем RxJS во всех приложениях Angular, которые пишем. RxJS оказывает значительное влияние на поток данных в наших приложениях, их производительность и многое другое.

Чтобы избежать утечек памяти, важно вовремя отписываться от уведомлений, выпускаемых объектами Observable. В этой статье описано большинство доступных способов, с помощью которых в компонентах Angular можно отписываться от уведомлений, выпускаемых объектами Observable.

Начнем с создания демонстрационного сервиса (DummyService), которой поможет нам отслеживать устанавливаемые подписки.

Читать далее
Total votes 10: ↑7 and ↓3+4
Comments7

Книга «Эффективный TypeScript: 62 способа улучшить код»

Reading time8 min
Views12K
imageПривет, Хаброжители! Книга Дэна Вандеркама окажется максимально полезена тем, кто уже имеет опыт работы с JavaScript и TypeScript. Цель этой книги — не обучать читателей пользоваться инструментами, а помочь им повысить свой профессиональный уровень. Прочитав ее, вы сформируете лучшее представление о работе компонентов TypeScript, сможете избежать многих ловушек и ошибок и развить свои навыки. В то время как справочное руководство покажет пять разных путей применения языка для реализации одной задачи, «эффективная» книга объяснит, какой из этих путей лучше и почему.
Читать дальше →
Total votes 19: ↑18 and ↓1+17
Comments5

Прогрессивные веб-приложения в 2020

Reading time17 min
Views28K

На КДПВ — стикер, созданный командой браузера Samsung Internet


Больше 12 лет прошло с тех пор, как Стив Джобс впервые представил идею веб-приложений, «которые выглядят и ведут себя точно так же, как и нативные приложения». Больше 4 лет прошло с момента появления термина «PWA». Что из себя представляют прогрессивные веб-приложения в начале 2020 года? Что из того, что было добавлено в экосистему в 2019 году, вы могли упустить? Давайте выясним.

Читать дальше →
Total votes 25: ↑23 and ↓2+21
Comments17

Как создать и развернуть Full-Stack React-приложение

Reading time8 min
Views14K
Привет, Хабр! Представляю вашем вниманию перевод статьи «How to Build and Deploy a Full-Stack React-App» автора Frank Zickert.

Компоненты инфраструктуры позволяют легко создавать, запускать и развертывать полноценное React-приложение. С этими React-компонентами вы можете сосредоточиться на написании бизнес-логики вашего приложения. Вам не нужно беспокоиться о его конфигурации.

Хотите стать full-stack разработчиком? Full-stack приложение дополняет интерактивный веб-интерфейс React сервером и базой данных. Но такое приложение требует гораздо больше настроек, чем простое одностраничное приложение.
Читать дальше →
Total votes 4: ↑4 and ↓0+4
Comments0

Веб-альманах 2019: Доступность

Reading time18 min
Views8.9K


Доступность в вебе имеет важное значение для равноправного и справедливого общества. Чем больше наша социальная и профессиональная сфера жизни переходит в онлайн, тем более важной для людей с ограниченными возможностями становится способность принимать участие во всех онлайн взаимодействиях без дополнительных барьеров. Подобно тому, как архитекторы зданий могут заботиться или пренебрегать технологиями доступности, такими как рампы для инвалидных колясок, веб-разработчики могут помогать или мешать пользователям, использующим дополнительные средства для выхода в интернет.
Читать дальше →
Total votes 14: ↑14 and ↓0+14
Comments2

Как выучить иностранный язык

Reading time10 min
Views114K

Я расскажу о том, как изучать иностранный язык и буду это делать на примере личного опыта изучения английского языка. Английский я начал учить в 36 лет, а уже сейчас у меня свободный английский язык (как письменный, так и устный), подтверждённый официальными сертификатами. Чтобы не быть голословным: у меня есть сертификат IELTS 7.5 баллов (это С1 level) и сертификат переводчика NAATI. Короче, я знаю о чем говорю.


Оглавление:


  1. Отступление про умных людей и прочих полиглотов
  2. Первый шаг
  3. Какой преподаватель нужен (уровень преподавателя)
  4. Где искать преподавателя
  5. Развитие навыков: слушание
  6. Развитие навыков: чтение
  7. Развитие навыков: письмо
  8. Развитие навыков: разговор: произношение
  9. Развитие навыков: разговор: языковой барьер
  10. Словарный запас
  11. Самое главное


Итак, вопрос: “Как выучить английский язык?”.

Читать дальше →
Total votes 97: ↑92 and ↓5+87
Comments158

Медиавыражения в CSS — это не только max-width

Reading time6 min
Views34K


Недавно мы опубликовали новый веб-сайт нашей компании Mabiloft с полностью переработанным чистым дизайном и множеством новых великолепных иллюстраций и анимаций.

После того, как наш дизайнер проделал потрясающую работу, продумав и нарисовав сайт, нам, разработчикам, было необходимо реализовать макет, сохранив его чистым и цельным для каждого устройства, от большого 2K экрана, на которых мы пишем код, до старого iPhone 4 с его 3.5-дюймовым дисплеем.

Несколько недель спустя веб-сайт был почти готов и я просматривал его, чтобы убедиться, что всё работает как нужно. Заметив, что макет главной страницы неправильно отображался на нашем iPad, я быстро изменил некоторые CSS-правила и исправил ошибку, но… это привело к проблемам отображения макета на всех всех ноутбуках с небольшим экраном
Читать дальше →
Total votes 19: ↑17 and ↓2+15
Comments6

WebAssembly: что и как

Reading time9 min
Views119K


Эта статья основана на моём выступлении на конференции ITSubbotnik, прошедшем 2 ноября 2019 года в Москве.


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


Проблема


Начнём с проблемы, которая решается этой (относительно новой) технологией. Проблема эта — быстро исполнять код в браузере. Быстро — это значит, «быстрее чем JavaScript», в идеале настолько быстро, насколько позволяет имеющийся у нас процессор.

Читать дальше →
Total votes 62: ↑60 and ↓2+58
Comments136

Чеклист по UX из 30 пунктов для мобильных приложений

Reading time7 min
Views30K
image

Эта статья — напминалка о том, что нужно перепроверить в дизайне вашего приложения, прежде чем отсылать его на AppStore/GooglePlay. Список поделен на тематические блоки:

  1. Вход / Регистрация
  2. Первый опыт
  3. Ежедневные взаимодействия
  4. Уведомления
  5. Параметры аккаунта
  6. Лента
  7. Поиск
  8. AppStore/GooglePlay
Читать дальше →
Total votes 32: ↑32 and ↓0+32
Comments9

Шесть задачек для Front-End разработчика

Reading time2 min
Views45K

1. Форма кредитной карты


Клёвая форма кредитной карты с гладкими и приятными микровзаимодействиями. Включает форматирование чисел, проверку и автоматическое определение типа карты. Она построена на Vue.js, а также полностью адаптивная. (Посмотреть можно здесь.)

image

credit-card-form

Чему научитесь:

  • Обрабатывать и валидировать формы
  • Обрабатывать события (например, при изменении полей)
  • Разберетесь как отображать и размещать элементы на странице, особенно данные кредитной карты, которая поверх формы
Читать дальше →
Total votes 46: ↑41 and ↓5+36
Comments43

Tоп-10: лучшие доклады HolyJS 2019 Piter

Reading time5 min
Views9.1K


Этой весной прошла HolyJS 2019 Piter — большая конференция для JavaScript-разработчиков. Вместе с программным комитетом конференции мы составили для вас список лучших докладов, посвящённых следующим темам:


  • Алгоритмы на графах;
  • Протокол Chrome DevTools и Puppeteer;
  • Статические типизаторы;
  • CI/CD;
  • Миграции: с Backbone на Polymer, с Polymer на Angular.js;
  • Большие данные на Node.js в serverless-архитектуре;
  • SEO с точки зрения разработчиков Google Search;
  • GraphQL;
  • Продвижение опенсорс-проектов.

Под катом всё это структурировано следующим образом:


  • Видеоролик на YouTube;
  • Страница доклада с полным описанием на сайте конференции;
  • Ссылка на слайды или специальный сайт доклада (если они есть).

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

Читать дальше →
Total votes 37: ↑35 and ↓2+33
Comments0

Учим английский: 7 практических способов расширить словарный запас

Reading time3 min
Views33K
image

Одна из важнейших задач при изучении иностранного языка – это не только практика с грамматикой, но и расширение словарного запаса. Чем больше слов вы знаете, тем в большем количестве ситуаций сможете объясниться – даже если у вас большие проблемы с артиклями и формированием времен, вас скорее всего поймут. А если вы знаете мало слов, то с этим уже ничего не поделать.

При этом важно понимать, что существует два типа лексики – активная и пассивная. Первая из них состоит из слов, которые вы активно используете, а вторая – это лексика, которую вы «знаете» и понимаете. Существуют способы наращивания лексических запасов обоих видов. Я нашла интересный пост с подборкой практических способов сделать это и подготовила его адаптированный перевод. Поехали!
Читать дальше →
Total votes 23: ↑19 and ↓4+15
Comments8

Information

Rating
Does not participate
Location
Брест, Брестская обл., Беларусь
Date of birth
Registered
Activity