Познакомьтесь со спикерами до встречи с ними на конференции
Конференция VueJS Amsterdam почти началась. Билеты уже проданы! В этом интервью мы поговорим с Ивсом ван Хорном. Он смелый создатель CodeSandbox. Онлайн-редактор, который предлагает первоклассную поддержку Vue и пытается облегчить жизнь новичкам!
Примечание: вопросы и ответы не расшифрованы, а адаптированы из заметок.
Привет Айвз! Что вы можете рассказать нам о себе?
Всем привет! Я студент компьютерных наук в Университете Твенте и по совместительству разработчик на CataWiki, веб-сайте аукционов. Я создатель CodeSandbox, онлайн-редактора кода для веб-приложений с использованием React или Vue.
Сейчас я не так много учусь, так как легко отвлекаюсь. Я много играю в волейбол. Мне нравится создавать музыку и играть на нескольких инструментах, включая флейту, электронный клавишный и гитару.
Я работаю разработчиком программного обеспечения, но до сих пор живу в студенческом общежитии. Я полностью принимаю студенческую жизнь, поэтому, например, после этого интервью я пойду пить коктейли со всеми другими студентами!
Иногда я выступал на конференции в другой стране и понимал, что прошлой ночью я устроил вечеринку с друзьями. Это большой сдвиг точки зрения.
Студенческая жизнь такая веселая! Я хотел бы еще немного поговорить о CodeSandbox. Можете ли вы рассказать нам, как это началось?
Я начал работать над CodeSandbox в ноябре прошлого года и выпустил его в апреле. Я создал его, потому что был очень расстроен. Будучи студентом, я должен был изучить все эти различные базовые концепции. Я чувствовал, что мне нужно взяться за более сложный проект. Я изучил основы программирования, работая для CataWiki. Я начал работать над CodeSandbox, чтобы изучать более сложные концепции, создавая что-то полезное. В какой-то момент я потерял интерес и остановился на несколько недель, но после некоторого размышления решил работать над этим до конца.
В CodeSandbox мы следуем 3 принципам:
- Снижайте кривую обучения
- Чувство локального редактора
- Легко поделиться и найти примеры от других
С первого релиза у нас было около 8 посетителей в течение дня. Это было довольно интересно. Я пытался рассказать об этом на Reddit и Twitter, но у меня почти не было подписчиков. Мне повезло: на следующий день Kent C. Doddsвыпустил glamorous и согласился использовать CodeSandbox для демонстрации гламурных примеров. С этого момента количество посещений резко возросло. Это было очень круто!
С этого момента моя мотивация возросла, когда я понял, что могу изменить ситуацию к лучшему для людей, использующих его. Не думал, что он станет таким популярным.
Потрясающая история! Давайте поговорим о конференции. Что ты готовишь?
В своем выступлении я объясню, какие изменения нам пришлось внести в CodeSandbox для поддержки Vue.
Мы начали внедрять поддержку Vue прошлым летом. В начале это было не так просто, как я думал. Во время своего выступления я расскажу, как мы начинали, что нам пришлось изменить в CodeSandbox, чтобы он заработал, и какие специфические функции Vue у нас есть сегодня.
Изначально CodeSandbox работал только с React, но позже мы включили поддержку Vue. Мы хотели иметь полный пакет. Выберите проект Vue из GitHub, импортируйте его и продолжите работу над ним из браузера. После этого мы внедрили поддержку Single File Component.
Наш первоначальный упаковщик был очень простым и поддерживал только транспилирование файлов JavaScript. Никакой другой системы у нас не было. Из-за этого ограничения мне пришлось переписать весь упаковщик, используя загрузчики Webpack, чтобы иметь поддержку загрузчиков. После этого я добавил все эти загрузчики: SASS, LESS, Stylus и TypeScript. Вот почему это было немного сложнее реализовать.
С августа мы интегрировали Монако. Это версия VS Code для веб-браузера, созданная командой Microsoft. То, что они сделали, очень впечатляет. Это современное состояние. Вы получаете Intellisense TypeScript, проверку типов и т. д. Даже импортирует информацию обо всех модулях! Так что с тех пор у нас есть встроенная поддержка TypeScript.
Недавно мы также добавили полную поддержку системы горячей перезагрузки модулей Webpack. Vue loader широко использует это. Если вы измените компонент Vue, загрузчик Vue будет использовать API горячего модуля для перезагрузки только этого файла. Допустим, вы изменили шаблон или стили, это означает, что вы увидите изменения, сохраняя то же состояние. Это заняло немного больше времени, чем ожидалось, но теперь его можно использовать и в проектах React.
Замечательно! Какие темы вам интересны в данный момент?
В последнее время я много просматривал конкретную тему, а именно Инструменты веб-разработчика на основе пользовательского интерфейса.
Например, большинство инструментов разработчика, которые мы используем, основаны на терминале. Ну, если мы в основном сосредоточены на веб-разработке, почему у нас нет больше инструментов веб-разработчика, ориентированных на пользовательский интерфейс? Хорошим примером может служить Webpack Dashboard, созданный бунтарем Кеном Уилером из Formidable Labs.
Если мы думаем о взаимодействии человека с компьютером, мы очень сильно ориентируемся на визуализацию. Если вы попросите кого-нибудь указать разницу между двумя образцами данных, один из которых представляет собой гистограмму, а другой — текстовую информацию. Глядя на гистограмму, они скажут с первого взгляда гораздо быстрее, чем чтение текста.
Информационная панель Webpack использует этот визуальный подход довольно хорошо, показывая все созданные модули, показывая их относительный размер и то, как они влияют на общий размер. Используя эту визуальную информацию, вы можете быстро определить любые проблемы с комплектацией.
И последний вопрос: каких докладов или тем вы ждете от конференции?
Меня интересуют выступления Себастьяна Шопенаи Александра Шопена. Они создатели Nuxt. Используя Nuxt, вам не нужно выполнять какую-либо первоначальную настройку или думать о какой-либо конфигурации, чтобы включить рендеринг на стороне сервера или создать событие для вашего приложения Vue. Мне нравится то, что они делают, и я очень заинтересован в их выступлениях.
Спасибо, что уделили время, Айвс!
Спасибо Джерард! Я думаю, что смогу выпустить некоторые новые функции для CodeSandbox перед моим выступлением и между студенческими вечеринками. Быть в курсе!
