From 5047517f1ed7e4fc68a8b5d972807cfc896dc8a9 Mon Sep 17 00:00:00 2001 From: orama254 Date: Wed, 5 Apr 2023 19:35:09 +0300 Subject: [PATCH 1/8] chore(docs): add new workflow for easy onboarding of new contributors --- CONTRIBUTING.md | 87 ++++++++++++++++++++++++++++++------------------- 1 file changed, 54 insertions(+), 33 deletions(-) diff --git a/CONTRIBUTING.md b/CONTRIBUTING.md index 2df5033..791c7ea 100644 --- a/CONTRIBUTING.md +++ b/CONTRIBUTING.md @@ -1,15 +1,20 @@ -# How to contribute +# How to contribute to React Developers Kenya (Reactdevske) Website Please note we have a [code of conduct](https://github.com/reactdeveloperske/reactdevske-website/blob/main/CODE_OF_CONDUCT.md), please follow it in all your interactions with the project. ## Contributing procedure -### Submit an issue + +### Find an issue to work on + +- You can contribute to this project by either creating an issue or by checking out the open issues available. + +#### 1. Submit an issue - Create a [new issue](https://github.com/reactdeveloperske/reactdevske-website/issues) - Comment on the issue (if you'd like to be assigned to it) - that way the issue can be assigned to you. -### Open issues +#### 2. Open issues - Go to [open issues](https://github.com/reactdeveloperske/reactdevske-website/issues) - select an issue of your choice that is `open` or `need help` or is `up-for-grabs` and is not assigned. @@ -19,7 +24,7 @@ Please note we have a [code of conduct](https://github.com/reactdeveloperske/rea - If you're not sure, here's how to [fork the repo](https://help.github.com/en/articles/fork-a-repo) -### Set up your local environment (optional) +#### Set up your local environment (optional) If you're ready to contribute and create your PR, it will help to set up a local environment so you can see your changes. @@ -34,13 +39,13 @@ If you're ready to contribute and create your PR, it will help to set up a local If this is your first time forking our repo, this is all you need to do for this step: -``` -$ git clone git@github.com:[your_github_handle]/reactdevske-website.git && cd reactdevske-website +```bash +git clone git@github.com:[your_github_handle]/reactdevske-website.git && cd reactdevske-website ``` -Make sure you checkout the `develop` branch `git checkout develop` +Make sure you checkout the `develop` branch by running the command `git checkout develop` -If you've already forked the repo, you'll want to ensure your fork is configured and that it's up to date. This will save you the headache of potential merge conflicts. +If you've already forked the repo and created the develop branch, you'll want to ensure your fork and your develop branch is configured and that it's up to date. This will save you the headache of potential merge conflicts. To [configure your fork](https://docs.github.com/en/github/collaborating-with-issues-and-pull-requests/configuring-a-remote-for-a-fork): @@ -48,24 +53,20 @@ To [configure your fork](https://docs.github.com/en/github/collaborating-with-is $ git remote add upstream https://github.com/reactdeveloperske/reactdevske-website.git ``` -To [sync your fork with the latest changes](https://docs.github.com/en/github/collaborating-with-issues-and-pull-requests/syncing-a-fork): +To [sync your fork and branch with the latest changes](https://docs.github.com/en/github/collaborating-with-issues-and-pull-requests/syncing-a-fork): -``` -$ git checkout develop -$ git fetch upstream -$ git merge upstream/develop +```bash +git checkout develop +git fetch upstream +git merge upstream/develop ``` 3. Install dependencies -``` -$ yarn install -``` - -or +We use [npm](https://www.npmjs.com/) to manage dependencies. To install all dependencies, run: -``` -$ npm install +```bash +npm install ```
@@ -76,45 +77,60 @@ $ npm install 1. Create new branch for your changes -``` -$ git checkout -b new_branch_name +```bash +git checkout -b new_branch_name ``` 2. start development server -``` -$ yarn run dev -``` -or -``` +```bash npm run dev ```
-### Start developing! +*** +##### :warning: RoadBlock: Missing environment variables + + +You may have noticed some error about providing a form key. This is because we use [Formspree](https://formspree.io/) to handle our contact form. To get around this, you can: + +- Use your own [Formspree](https://formspree.io/) account and set the `FORMSPREE_KEY` environment variable to your key. (refer to the .env.example file for guidance on where to put your formspee key). + +You may have also noticed a second error about missing required parameters: sitekey. This is because we use [reCAPTCHA](https://www.google.com/recaptcha/about/) to prevent spam. To get around this, you can: + +- Use your own [reCAPTCHA](https://www.google.com/recaptcha/about/) account and set the `RECAPTCHA_SITE_KEY` environment variable to your keys. (refer to the .env.example file for guidance on where to put your recaptcha site key). + + +Both of these changes will require you to create a `.env` file in the root directory of the project. You can copy the contents of the `.env.example` file and paste them into the `.env` file. Then, you can add your keys to the appropriate variables. + +***
+3. Make changes to the codebase + - Open this directory in your favorite text editor / IDE, and see your changes live by visiting `localhost:3000` from your browser - Pro Tip: Explore scripts within `package.json` for more build options 1. Add changes made to the repo addressing an issue -``` + +```bash git add [file_name] ``` + 2. Commit and prepare for pull request (PR). In your PR commit message, reference the issue it resolves (see [how to link a commit message to an issue using a keyword](https://docs.github.com/en/free-pro-team@latest/github/managing-your-work-on-github/linking-a-pull-request-to-an-issue#linking-a-pull-request-to-an-issue-using-a-keyword). -``` -$ git commit -m "brief description of changes [Fixes #1234]" +```bash +git commit -m "brief description of changes [Fixes #1234]" ``` 1. Push to your GitHub account -``` -$ git push -u origin [feature_branch] +```bash +git push -u origin [feature_branch] ``` ### Submit your Pull Request (PR)🚀 @@ -122,3 +138,8 @@ $ git push -u origin [feature_branch] - After your changes are commited to your GitHub fork, submit a pull request (PR) to the `develop` branch of the `reactdeveloperske/reactdevske-website` repo - In your PR description, reference the issue it resolves (see [linking a pull request to an issue using a keyword](https://docs.github.com/en/free-pro-team@latest/github/managing-your-work-on-github/linking-a-pull-request-to-an-issue#linking-a-pull-request-to-an-issue-using-a-keyword)) - ex. `Updates out of date content [Fixes #1234]` + +### Sit back, relax and wait for your PR to be reviewed/merged + +- We'll review your PR as soon as possible +- We may suggest some changes or improvements or alternatives. From a2d554fb40cd2d8ae59f67c9770298566b873ed4 Mon Sep 17 00:00:00 2001 From: orama254 Date: Wed, 5 Apr 2023 20:06:17 +0300 Subject: [PATCH 2/8] feat(images): add the remaining CDN images --- CONTRIBUTING.md | 19 ++++++++----------- src/components/Events/Events.tsx | 15 ++++++++++----- .../MissionPillars/MissionPillars.tsx | 12 +++++++++--- 3 files changed, 27 insertions(+), 19 deletions(-) diff --git a/CONTRIBUTING.md b/CONTRIBUTING.md index 791c7ea..00338e5 100644 --- a/CONTRIBUTING.md +++ b/CONTRIBUTING.md @@ -4,7 +4,6 @@ Please note we have a [code of conduct](https://github.com/reactdeveloperske/rea ## Contributing procedure - ### Find an issue to work on - You can contribute to this project by either creating an issue or by checking out the open issues available. @@ -83,18 +82,15 @@ git checkout -b new_branch_name 2. start development server - - ```bash npm run dev ```
-*** -##### :warning: RoadBlock: Missing environment variables - +--- +##### :warning: RoadBlock: Missing environment variables You may have noticed some error about providing a form key. This is because we use [Formspree](https://formspree.io/) to handle our contact form. To get around this, you can: @@ -104,30 +100,31 @@ You may have also noticed a second error about missing required parameters: site - Use your own [reCAPTCHA](https://www.google.com/recaptcha/about/) account and set the `RECAPTCHA_SITE_KEY` environment variable to your keys. (refer to the .env.example file for guidance on where to put your recaptcha site key). - Both of these changes will require you to create a `.env` file in the root directory of the project. You can copy the contents of the `.env.example` file and paste them into the `.env` file. Then, you can add your keys to the appropriate variables. -*** +--- +
3. Make changes to the codebase - Open this directory in your favorite text editor / IDE, and see your changes live by visiting `localhost:3000` from your browser - Pro Tip: Explore scripts within `package.json` for more build options +- Pro Tip: Use [Prettier](https://prettier.io/) to format your code before committing by running `npm run prettier:check` and `npm run prettier:format` to check and fix formatting issues -1. Add changes made to the repo addressing an issue +4. Add changes made to the repo addressing an issue ```bash git add [file_name] ``` -2. Commit and prepare for pull request (PR). In your PR commit message, reference the issue it resolves (see [how to link a commit message to an issue using a keyword](https://docs.github.com/en/free-pro-team@latest/github/managing-your-work-on-github/linking-a-pull-request-to-an-issue#linking-a-pull-request-to-an-issue-using-a-keyword). +5. Commit and prepare for pull request (PR). In your PR commit message, reference the issue it resolves (see [how to link a commit message to an issue using a keyword](https://docs.github.com/en/free-pro-team@latest/github/managing-your-work-on-github/linking-a-pull-request-to-an-issue#linking-a-pull-request-to-an-issue-using-a-keyword). ```bash git commit -m "brief description of changes [Fixes #1234]" ``` -1. Push to your GitHub account +6. Push to your GitHub account ```bash git push -u origin [feature_branch] diff --git a/src/components/Events/Events.tsx b/src/components/Events/Events.tsx index 18704e6..fb13089 100644 --- a/src/components/Events/Events.tsx +++ b/src/components/Events/Events.tsx @@ -7,7 +7,8 @@ const events: EventData[] = [ id: 1, title: 'Physical Meetups', description: 'Physical meetups where we share, learn and network.', - image_url: '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/images/physical_meetup.jpg', + image_url: + 'https://res.cloudinary.com/reactjs-devs-ke/image/upload/v1678532589/website-images/physical_meetup_fqkitv.jpg', target: 'https://kommunity.com/reactjs-developer-community-kenya-reactdevske/events', }, @@ -16,7 +17,8 @@ const events: EventData[] = [ title: 'Weekly Online Standups', description: 'Weekly open calls in the community’s Telegram group discussing industry-related topics.', - image_url: 'https://res.cloudinary.com/reactjs-devs-ke/image/upload/v1678532589/website-images/weekly_standups_lg3rth.jpg', + image_url: + 'https://res.cloudinary.com/reactjs-devs-ke/image/upload/v1678532589/website-images/weekly_standups_lg3rth.jpg', target: 'https://bit.ly/joinreactdevske', }, { @@ -24,7 +26,8 @@ const events: EventData[] = [ title: 'Community Power Sessions', description: 'Community members meet and share technical concepts with other members of the community.', - image_url: 'https://res.cloudinary.com/reactjs-devs-ke/image/upload/v1678532589/website-images/community_sessions_xsyd8d.jpg', + image_url: + 'https://res.cloudinary.com/reactjs-devs-ke/image/upload/v1678532589/website-images/community_sessions_xsyd8d.jpg', target: 'https://www.youtube.com/channel/UC9_eVcPBk4T-DcZLHpQfy4w/videos', }, { @@ -40,7 +43,8 @@ const events: EventData[] = [ title: 'Monthly Online Standups', description: 'Monthly open calls on Google Meet bringing together people from different communities.', - image_url: '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/images/physical_meetup.jpg', + image_url: + 'https://res.cloudinary.com/reactjs-devs-ke/image/upload/v1678532589/website-images/physical_meetup_fqkitv.jpg', target: 'https://kommunity.com/reactjs-developer-community-kenya-reactdevske/events', }, @@ -49,7 +53,8 @@ const events: EventData[] = [ title: 'Community Challenges', description: 'We organize open source challenges to keep the community engaged.', - image_url: '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/images/physical_meetup.jpg', + image_url: + 'https://res.cloudinary.com/reactjs-devs-ke/image/upload/v1678532589/website-images/physical_meetup_fqkitv.jpg', target: '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/reactdeveloperske/community-coding-challenges', }, ]; diff --git a/src/components/MissionPillars/MissionPillars.tsx b/src/components/MissionPillars/MissionPillars.tsx index 9ae84fd..c07d0b3 100644 --- a/src/components/MissionPillars/MissionPillars.tsx +++ b/src/components/MissionPillars/MissionPillars.tsx @@ -15,7 +15,9 @@ export default function MissionPillars() {
Mentorship Image @@ -31,7 +33,9 @@ export default function MissionPillars() {
Learning Image @@ -47,7 +51,9 @@ export default function MissionPillars() {
Community Image From 07c06e3e04c3c4b235dd14e5df0961f041927d46 Mon Sep 17 00:00:00 2001 From: orama254 Date: Wed, 5 Apr 2023 20:54:14 +0300 Subject: [PATCH 3/8] ci(e2e-github-action): update e2e file with latest changes from playwright --- .github/workflows/e2e.yml | 8 ++++---- 1 file changed, 4 insertions(+), 4 deletions(-) diff --git a/.github/workflows/e2e.yml b/.github/workflows/e2e.yml index fadfd3f..1a2d16e 100644 --- a/.github/workflows/e2e.yml +++ b/.github/workflows/e2e.yml @@ -12,13 +12,13 @@ jobs: - uses: actions/checkout@v3 - uses: actions/setup-node@v3 with: - node-version: '14.x' + node-version: '18.x' - name: Install dependencies - run: npm ci + run: npm install -g yarn && yarn install --frozen-lockfile - name: Install Playwright Browsers - run: npx playwright install --with-deps + run: yarn playwright install --with-deps - name: Run Playwright tests - run: npm run test + run: yarn test - uses: actions/upload-artifact@v3 if: always() with: From bc9a91dd270f6167e1b8b68096a13b2f660da8fd Mon Sep 17 00:00:00 2001 From: orama254 Date: Fri, 7 Apr 2023 17:48:48 +0300 Subject: [PATCH 4/8] ci(e2e-github-action): add repo env variables --- .github/workflows/e2e.yml | 3 +++ 1 file changed, 3 insertions(+) diff --git a/.github/workflows/e2e.yml b/.github/workflows/e2e.yml index 1a2d16e..3df49df 100644 --- a/.github/workflows/e2e.yml +++ b/.github/workflows/e2e.yml @@ -8,6 +8,9 @@ jobs: e2e: timeout-minutes: 60 runs-on: ubuntu-latest + env: + NEXT_PUBLIC_FORMSPREE_ID: ${{ secrets.NEXT_PUBLIC_FORMSPREE_ID }} + NEXT_PUBLIC_RECAPTCHA_SITE_KEY: ${{ secrets.NEXT_PUBLIC_RECAPTCHA_SITE_KEY }} steps: - uses: actions/checkout@v3 - uses: actions/setup-node@v3 From 37ce2f2e7f7a957b4c4e424f3deeaf4818b0c84f Mon Sep 17 00:00:00 2001 From: orama254 Date: Fri, 7 Apr 2023 17:59:19 +0300 Subject: [PATCH 5/8] =?UTF-8?q?ci(e2e-github-action):=20add=20repo=20env?= =?UTF-8?q?=20variables=20take2=F0=9F=8E=AC?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- .github/workflows/e2e.yml | 6 +++--- 1 file changed, 3 insertions(+), 3 deletions(-) diff --git a/.github/workflows/e2e.yml b/.github/workflows/e2e.yml index 3df49df..bea04ac 100644 --- a/.github/workflows/e2e.yml +++ b/.github/workflows/e2e.yml @@ -8,9 +8,6 @@ jobs: e2e: timeout-minutes: 60 runs-on: ubuntu-latest - env: - NEXT_PUBLIC_FORMSPREE_ID: ${{ secrets.NEXT_PUBLIC_FORMSPREE_ID }} - NEXT_PUBLIC_RECAPTCHA_SITE_KEY: ${{ secrets.NEXT_PUBLIC_RECAPTCHA_SITE_KEY }} steps: - uses: actions/checkout@v3 - uses: actions/setup-node@v3 @@ -21,6 +18,9 @@ jobs: - name: Install Playwright Browsers run: yarn playwright install --with-deps - name: Run Playwright tests + env: + NEXT_PUBLIC_FORMSPREE_ID: ${{ secrets.NEXT_PUBLIC_FORMSPREE_ID }} + NEXT_PUBLIC_RECAPTCHA_SITE_KEY: ${{ secrets.NEXT_PUBLIC_RECAPTCHA_SITE_KEY }} run: yarn test - uses: actions/upload-artifact@v3 if: always() From 4886c72152ad86e85461f4a73796882208e58efa Mon Sep 17 00:00:00 2001 From: orama254 Date: Fri, 7 Apr 2023 18:05:39 +0300 Subject: [PATCH 6/8] =?UTF-8?q?ci(e2e-github-action):=20add=20repo=20env?= =?UTF-8?q?=20variables=20take3=F0=9F=8E=AC?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- .github/workflows/e2e.yml | 6 +++--- 1 file changed, 3 insertions(+), 3 deletions(-) diff --git a/.github/workflows/e2e.yml b/.github/workflows/e2e.yml index bea04ac..866a2c8 100644 --- a/.github/workflows/e2e.yml +++ b/.github/workflows/e2e.yml @@ -4,6 +4,9 @@ on: branches: [main, develop] pull_request: branches: [main, develop] +env: + NEXT_PUBLIC_FORMSPREE_ID: ${{ secrets.NEXT_PUBLIC_FORMSPREE_ID }} + NEXT_PUBLIC_RECAPTCHA_SITE_KEY: ${{ secrets.NEXT_PUBLIC_RECAPTCHA_SITE_KEY }} jobs: e2e: timeout-minutes: 60 @@ -18,9 +21,6 @@ jobs: - name: Install Playwright Browsers run: yarn playwright install --with-deps - name: Run Playwright tests - env: - NEXT_PUBLIC_FORMSPREE_ID: ${{ secrets.NEXT_PUBLIC_FORMSPREE_ID }} - NEXT_PUBLIC_RECAPTCHA_SITE_KEY: ${{ secrets.NEXT_PUBLIC_RECAPTCHA_SITE_KEY }} run: yarn test - uses: actions/upload-artifact@v3 if: always() From 5b48b930a1bcba8c4b0bb27711dcd549735e77af Mon Sep 17 00:00:00 2001 From: orama254 Date: Fri, 14 Apr 2023 20:55:02 +0300 Subject: [PATCH 7/8] ci(e2e-github-action): edit yaml based on review --- .github/workflows/e2e.yml | 14 ++++++++------ 1 file changed, 8 insertions(+), 6 deletions(-) diff --git a/.github/workflows/e2e.yml b/.github/workflows/e2e.yml index 866a2c8..1db5bc5 100644 --- a/.github/workflows/e2e.yml +++ b/.github/workflows/e2e.yml @@ -4,24 +4,26 @@ on: branches: [main, develop] pull_request: branches: [main, develop] -env: - NEXT_PUBLIC_FORMSPREE_ID: ${{ secrets.NEXT_PUBLIC_FORMSPREE_ID }} - NEXT_PUBLIC_RECAPTCHA_SITE_KEY: ${{ secrets.NEXT_PUBLIC_RECAPTCHA_SITE_KEY }} jobs: e2e: timeout-minutes: 60 runs-on: ubuntu-latest steps: - uses: actions/checkout@v3 + - name: Prepare .env file + run: | + rm -f .env && touch .env + echo "NEXT_PUBLIC_FORMSPREE_ID=${{ secrets.NEXT_PUBLIC_FORMSPREE_ID }}" >> .env + echo "NEXT_PUBLIC_RECAPTCHA_SITE_KEY=${{ secrets.NEXT_PUBLIC_RECAPTCHA_SITE_KEY }}" >> .env - uses: actions/setup-node@v3 with: node-version: '18.x' - name: Install dependencies - run: npm install -g yarn && yarn install --frozen-lockfile + run: npm ci - name: Install Playwright Browsers - run: yarn playwright install --with-deps + run: npx playwright install --with-deps - name: Run Playwright tests - run: yarn test + run: npm run test - uses: actions/upload-artifact@v3 if: always() with: From 9fbcb160c9f737cd0e5f81091d9d519e3ff13045 Mon Sep 17 00:00:00 2001 From: orama254 Date: Fri, 14 Apr 2023 23:04:48 +0300 Subject: [PATCH 8/8] ci(e2e-github-action): add hardcoded values based on review --- .github/workflows/e2e.yml | 4 ++-- 1 file changed, 2 insertions(+), 2 deletions(-) diff --git a/.github/workflows/e2e.yml b/.github/workflows/e2e.yml index 1db5bc5..27cc1f4 100644 --- a/.github/workflows/e2e.yml +++ b/.github/workflows/e2e.yml @@ -13,8 +13,8 @@ jobs: - name: Prepare .env file run: | rm -f .env && touch .env - echo "NEXT_PUBLIC_FORMSPREE_ID=${{ secrets.NEXT_PUBLIC_FORMSPREE_ID }}" >> .env - echo "NEXT_PUBLIC_RECAPTCHA_SITE_KEY=${{ secrets.NEXT_PUBLIC_RECAPTCHA_SITE_KEY }}" >> .env + echo "NEXT_PUBLIC_FORMSPREE_ID=fake123" >> .env + echo "NEXT_PUBLIC_RECAPTCHA_SITE_KEY=123fAkE" >> .env - uses: actions/setup-node@v3 with: node-version: '18.x'