Блог GSoC: Фаза 1

Привет всем! Надеюсь, у вас все хорошо и вы пьете достаточно воды!

Введение

Итак, небольшое представление обо мне — я Яш Кандалкар, студент факультета информационных технологий из Махараштры, Индия. Мне нравится заниматься фронтенд веб-разработкой.
Недавно я прошел отбор в Google Summer of Code, программу с открытым исходным кодом для студентов и работающих профессионалов.
Я работаю над созданием пользовательского интерфейса для настройки запуска моделирования для модели Generic Carbon Budgeting Model (GCBM).

Вы можете найти мой блог первой недели здесь!

Прогресс

Поскольку самой важной частью этого проекта является раздел Upload, я начал работать над ним раньше.
Я обсудил с людьми, работающими над бэкендом, и предложил дизайн для загрузки различных типов файлов.
В новом дизайне все типы файлов — классификаторы, возмущения, входные db и разные файлы — получили отдельный пользовательский интерфейс. Это поможет пользователям изменять конфигурацию, созданную на бэкенде.
После завершения разработки дизайна я начал работу над пользовательским интерфейсом для этих разделов и редактора конфигурации.
Для редактора конфигурации я использовал vue3-json-editor, который очень крут!
Вот несколько снимков пользовательского интерфейса:

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

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

На этом раздел загрузки завершен. Теперь в проекте осталось следующее:

• Интеграция бэкенда
• пользовательский интерфейс для конфигураций Spinup и библиотек
• пользовательский интерфейс для запуска моделирования (и загрузки результатов / журналов)
• Некоторые функции, такие как импорт, экспорт полной симуляции, модальный экран «Нужна помощь?» для проведения экскурсии по всей симуляции (или части, такие как раздел загрузки, демонстрирующие, как редактировать файлы конфигурации)
• Тесты для компонентов, которые я создал, и некоторые тесты E2E.

Параллельно с проектом я создавал новые проблемы и просматривал PR в проекте FLINT-UI для новых участников, а также просматривал PR нового проекта UI Library.

Задачи:

1. Библиотеки для Vue3:Получение помощи для устранения проблем при использовании некоторых старых библиотек с Vue3 — это боль. Трудно легко найти решение для конкретной ошибки. Я потратил несколько дней, чтобы разобраться с 2-3 библиотеками для Vue3, и в итоге изолировал некоторые задачи на бэкенд.
2. Перегруженность:Иногда, даже если вы много знаете о проекте, вы начинаете сомневаться, в правильном ли направлении движетесь. Разговоры с наставниками определенно помогают. Возможно, это мелочь со стороны Эндрю, но меня это очень ободрило!

3. Управление временем:
   Недавно колледж снова открылся. Поэтому было немного сложно распределять время, но я привыкаю к этому. Наша команда также прошла в финал SIH (крупнейший хакатон в Индии, ух ты 🎉), поэтому нам приходится работать над реализацией идеи проекта.

   Работа над проектом помогает выкроить несколько часов в день. За праздники я уже выполнил огромную часть проекта. Поэтому мне будет легче завершить весь проект за требуемое время.

Обучение

1. Клонирование объектов JavaScript:
   Немного технической информации, но у меня сложилось впечатление, что оператор spread в JS глубоко клонирует объект/массив:

   let anObject = { car: 1, bus: 3, fruits: { apple: 3, banana: 4 }}
   let objectClone = { ...anObject }
   

   Но при клонировании объектов он проникает только на один уровень вглубь. Для глубокого клонирования вы должны использовать пользовательскую функцию, например cloneDeep из lodash.

2. TailwindCSS & Ant Design Vue: Эти две библиотеки НЕ являются полностью совместимыми. Я бы хотел использовать эти две библиотеки бок о бок без каких-либо проблем. Есть некоторые стили по умолчанию из Tailwind, которые мешают компонентам antdv. Например: Границы компонента ввода текста из antdv больше из-за некоторых стилей из Tailwind, иконки antdv отображаются немного ниже, чем они должны быть из-за стилей Tailwind. Это можно легко исправить, перезаписав соответствующий класс, но в первую очередь это не должно быть проблемой.

На этом пока все. До следующего раза. Мир ✌️!