При создании приложения возникает множество важных вопросов. Такие вопросы, как: «Кто пользователи?», «Какой браузер они будут использовать для доступа к приложению?» и «Есть ли рай и будут ли там фургоны с едой?».

Конечно, на некоторые из этих вопросов можно дать окончательный ответ, а на некоторые - нет. Хотя мы никогда не узнаем, почему один человек запускает наше приложение из IE 8 в субботу в 3 часа ночи (Черт возьми!), Мы можем быть почти на 100% уверены, что если есть рай, там будут грузовики с едой.

Именно в этом стремлении к раю и прославленному хипстерскому фаст-фуду я создал React Food Truck.

Какие. Черт. Это?

React Food Truck - это тщательно подобранный набор расширений для требовательных разработчиков React, использующих VS Code. И если вы разборчивый разработчик, вы, конечно же, будете использовать VS Code. Или нет, но должен быть, потому что, как и в великих секвойях Калифорнии, вы не найдете React Food Truck больше нигде. Я не говорю, что React Food Truck находится в лесу; наверное, это ужасная аналогия.

Дело в том, что я потратил много времени на изучение рынка расширений VS Code Extension Marketplace, чтобы найти самые вкусные и вкусные расширения, которые гарантированно сделают вашу жизнь как разработчика React на 129% приятнее.

Все, что вам нужно сделать, это установить расширение React Food Truck, и оно автоматически установит мой подобранный шведский стол расширений.

Что в грузовике

Простые фрагменты реакции

Только самый чистый и свежий набор фрагментов кода React в игре. Это все, что вам нужно для создания приложений React, но без раздувания фрагментов. Например, в этом пакете нет фрагментов кода React Native. Почему? Потому что вы не создаете приложение React Native. Если бы это было так, вы бы установили Native сниппеты Simple React, которых, конечно же, не существует.

Фрагменты ES6

Это расширение предоставляет вам все лучшие фрагменты кода JavaScript. Зачем печатать import, если можно набирать imp? Это на три буквы короче. Это называется продуктивностью.

Красивее

Ваш код выглядит немного подозрительно. Вы просто смешали двойные и одинарные кавычки в одном файле? Не беспокойтесь о форматировании снова и снова. Дайте своему ОКР отдохнуть и позвольте Prettier попотеть по мелочам. Он автоматически форматирует ваш код и делает его красивее.

Соедините это расширение со следующими настройками в вашем файле пользовательских настроек, чтобы получить премиум-формат «формат при сохранении».

"editor.formatOnSave": true

ESLint

Ваш JavaScript настолько надежен, что вам не нужен линтер. Но если бы вы это сделали, это был бы ESLint, и вы бы использовали это расширение.

Совет для полупрофессионалов: если вы используете ESLint, просто заставьте Prettier отформатировать код на основе вашего .eslintrc.json файла. Добавьте в свои настройки пользователя следующее:

"prettier.eslintIntegration": true

Npm Intellisense

Перестаньте гадать в своих пакетах npm. В любом случае ты никогда не поймешь это правильно. Левая панель или левая панель? Больше не твоя проблема. Это расширение обеспечивает intellisense для вашего импорта.

Стоимость импорта

Насколько велик этот файл, который я только что импортировал в свой компонент? КАКАЯ РАЗНИЦА. Я нахожусь на связи. Но в выключенном состоянии вас волнует, сколько бит вы используете для своих пользователей, это расширение будет вам спиной.

Экспортирует автозаполнение

Вы говорите мне, что я должен импортировать свой компонент, прежде чем я смогу использовать его в своем JSX? пффффффф. Как насчет того, чтобы я просто использовал его, и VS Code импортирует его для меня. Вот как я катаюсь.

CSS2React

Вы знаете, как вы копируете / вставляете какой-то CSS в компонент React (вероятно, из CSS Tricks. Все в порядке. Мы все это делаем), а затем вам нужно исправить это, потому что CSS - это не JavaScript? Никогда. опять таки.

React Pure To Class

Вам нужен класс или чистый компонент? Никто никогда не узнает, пока они не сделают компонент, а затем поймут, что эта штука далеко не так глупа, как они думали, и СЕЙЧАС им нужен класс. РЕФАКТОРИНГ ОТСАСЫВАЕТ. Преобразование чистых компонентов в классы с этим расширением очень просто.

Установите Food Truck

Вы можете установить React Food Truck в VS Code с прошлой недели. Он уже невероятно популярен: его установили 32 раза (спасибо, мама!).

Другие пакеты расширений?

Не используете React? Нет проблем, Роб. Вот еще несколько отличных пакетов расширений для вашей палитры.

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