opencollective frontend

Открытый коллективный фронт

Предисловие

Если вы видите шаг ниже, который может быть улучшен (или устарел), пожалуйста, обновите инструкции. Мы редко проходим этот процесс сами, поэтому ваша свежая пара глаз и ваш недавний опыт работы с ним делает вас лучшим кандидатом, чтобы улучшить их для других пользователей. Спасибо!

Разработка

Условие

1. Убедитесь, что у вас есть node.js версия 20.x и NPM версия> = 9.0.0.

• Мы рекомендуем использовать NVM: nvm install && nvm use .

Установить

Мы рекомендуем клонировать репозиторий в папке, посвященной opencollective Projects.

 git clone [email protected]:opencollective/opencollective-frontend.git opencollective/frontend
cd opencollective/frontend
npm install

Переменные среды

Этот проект требует доступа к открытому коллективному API.

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

Если вы хотите подключиться к открытому коллективному API, работающему локально:

• клонировать, установить и запустить Opencollective-API
• В этом проекте скопируйте следующий контент в файл .env :

 API_URL=http://localhost:3060
API_KEY=dvl-1510egmf4a23d80342403fb599qd

Начинать

 npm run dev

Тесты

Чтобы запустить тесты:

• Для страниц и компонентов используйте npm test
• Для тестов с сквозными (E2E) с использованием Cypress см. Наше выделенное руководство.

Для обновления:

• Jest Scentshots: запустите npm run test:update
• Файлы перевода: запустите npm run langs:update
• Graphql схема для Eslint: запустить npm run graphql:update

Стиль

Мы используем сборник рассказов для разработки и документирования наших компонентов React в изоляции со стиляными компонентами и стилизованной системой.

Дополнительная информация: docs/styleguide.md

Локализация

Перевод интерфейса не требует каких -либо технических навыков, вы можете перейти на https://crowdin.com/project/opencollective и начать переводить сразу!

В настоящее время мы ищем взносы на следующие языки:

• Французский
• испанский
• Японский

Хотите добавить новый язык для открытого коллектива? Свяжитесь с нами, и мы будем рады помочь вам настроить это!

Внося

Стиль кода? Совершить конвенцию? Пожалуйста, проверьте наши рекомендации.

TL; DR: Мы используем более красивые и эслинты, нам нравятся отличные сообщения о коммите и чистая история GIT.

Щедрости

Это репо является частью программы открытой коллективной награды. Получите плату, чтобы внести свой вклад в открытый исходный код! Открытая коллективная инженерная команда маленькая, и мы всегда ищем новых участников наших кодовых баз с открытым исходным кодами. Наша программа щедрости - это возможность решить проблемы, которыми можно пренебречь иначе. Участники, которые решают эти проблемы, будут вознаграждены в финансовом отношении. Пожалуйста, смотрите наши документы для получения дополнительной информации: https://docs.opencollective.com/help/contributing/development/bounties

Развертывание

Этот проект в настоящее время развернут для постановки и производства с Heroku. Чтобы развернуть, вы должны быть основным членом команды Open Collective.

Дополнительная информация: docs/deployment.md

Публикация компонентов

Чтобы опубликовать обновление компонентов Frontend в NPM, вам необходимо стать основным членом команды Open Collective. Шаги:

1. Проверьте опубликованную в настоящее время версия с npm view @opencollective/frontend-components version
2. Запустите сценарий публикации, запустив npm run publish-components {NEW_VERSION} , где {NEW_VERSION} -это новый номер версии (пожалуйста, следуйте за Semver).
3. Просмотрите изменения и подтвердите, имеет ли все смысл.

Чтобы добавить новые файлы или зависимости в этот экспортированный пакет, посмотрите на Scripts/Publish-Components/config.ts.

Дискуссия

Если у вас есть какие -либо вопросы, пинг нас в Discord или Twitter (@opencollect).

Спасибо

Благодаря Lost Pixel за предоставление платформы визуального тестирования, которая помогает нам просмотреть изменения пользовательского интерфейса и улавливать визуальные регрессии.