Настройка фронтенд-разработки

Эта страница описывает шаги, необходимые для начала работы с фронтенд-разработкой.

Предварительные требования

Рекомендуемая настройка разработки использует Visual Studio Code с devcontainers. Этот подход создаст предварительно настроенную среду разработки со всеми необходимыми инструментами.

Смотрите Настройка бэкенд-разработки для необходимых предварительных требований.

Начало работы

1. Откройте репозиторий Gramps Web frontend и нажмите "fork"
2. Клонируйте ваш форкнутый репозиторий на локальную машину с помощью Git
3. Откройте клонированный репозиторий в Visual Studio Code. Когда появится запрос, выберите "Reopen in Container" или вручную откройте палитру команд (Ctrl+Shift+P или Cmd+Shift+P) и выберите "Dev Containers: Rebuild and Reopen in Container".
4. Подождите, пока контейнер разработки будет собран и запущен. Это может занять несколько минут, особенно в первый раз.

Запуск сервера фронтенд-разработки

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

Для этого сначала нужно запустить экземпляр бэкенда Gramps Web API. Самый простой способ сделать это — использовать контейнер разработки бэкенда и выполнить задачу "Serve Web API" в отдельном окне VS Code.

После того как бэкенд запущен, вы можете запустить сервер фронтенд-разработки, выбрав "Tasks: Run Task" из палитры команд (Ctrl+Shift+P или Cmd+Shift+P), а затем выбрав "Serve Gramps Web frontend".

Это запустит сервер фронтенд-разработки на порту 8001, который вы можете открыть в браузере по адресу http://localhost:8001. Браузер автоматически перезагрузится, когда вы внесете изменения в код фронтенда, позволяя вам сразу увидеть влияние ваших изменений.