Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

npm -> yarn #413

Draft
wants to merge 3 commits into
base: master
Choose a base branch
from
Draft

npm -> yarn #413

Show file tree
Hide file tree
Changes from all commits
Commits
Show all changes
3 commits
Select commit Hold shift + click to select a range
96e5e4e
npm -> yarn
sdzhong Mar 5, 2024
675eee3
add --frozen-lockfile
sdzhong Mar 5, 2024
922faa1
change hot reload command to yarn
sdzhong Mar 5, 2024
File filter

Filter by extension

Filter by extension
Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
42 changes: 31 additions & 11 deletions README.md
View file
Open in desktop
Original file line number Diff line number Diff line change
@@ -1,34 +1,39 @@
# ~~Application Monitoring~~ Empower

This is a multi-language/framework project that implements Empower Plant web app. It has one actively maintained frontend, `react`, that can connect to any one of the backend implementations using a query string parameter (e.g. `?backend=express`) and uses `flask` by default.

## Features

https://www.notion.so/sentry/Demo-Data-Requirements-4b918453be6f4e4fbdcfd4b2e3e608e0

## Additional documentation

- project README's in subdirectories (e.g. [react/README.md](./react/README.md)
- **"New deploy.sh and env-config for empower"** (internal doc)
- See [troubleshooting](./troubleshooting.md)
- **"Checklist for adding new language/framework demo to Empower"** (internal doc)
- [comment at the top of `deploy.sh` file](https://github.com/sentry-demos/empower/blob/master/deploy.sh#L3-L47).

## Setup

1. Permit your IP address in CloudSQL:
1. Go to https://console.cloud.google.com/sql/instances
2. You will see 1 instance, under Actions column click "..." -> Edit
3. Expand "Connections", under Authorized Networks click "ADD NETWORK"
4. Google "my IP address", add it.
1. Go to https://console.cloud.google.com/sql/instances
2. You will see 1 instance, under Actions column click "..." -> Edit
3. Expand "Connections", under Authorized Networks click "ADD NETWORK"
4. Google "my IP address", add it.
2. Copy `local.env` from [empower-config](https://github.com/sentry-demos/empower-config) into `env-config` directory of your local repo, or, if you don't have access to it, follow `env-config/example.env`.
3. The `REACT_APP_FLASK_BACKEND` in `env-config/local.env` points to the backend instance deployed to AppEngine, the same one used by the cloud-hosted React web app. Flask is the default backend. If you expect to run other backend types, add values for those in `env-config` in your `local.env` file as well (i.e. `REACT_APP_EXPRESS_BACKEND`).
4. Confirm [Homebrew](https://brew.sh/) is installed with `brew -v`. If not, install using `/bin/bash -c "$(curl -fsSL https://raw.githubusercontent.com/Homebrew/install/HEAD/install.sh)"`.
5. Confirm PostgreSQL is installed with `Postgres -V`. If not, install using `brew install postgresql`.
6. As the application is compatible with specific versions of `node` and `npm`, install the following to be able to set the specific versions required (below describes how to achieve it using `n` package, but alternatively you can use `nvm`):
1. Install compatible `npm` version with `npm install -g [email protected]`. NOTE: may need to use `sudo` with command.
2. Install `n` to update `node` version with `npm install -g n`.
3. Set the specific `node` version with `n XX.XX.XX`. NOTE: may need to use `sudo` with command.
1. Install compatible `npm` version with `npm install -g [email protected]`. NOTE: may need to use `sudo` with command.
2. Install `n` to update `node` version with `npm install -g n`.
3. Set the specific `node` version with `n XX.XX.XX`. NOTE: may need to use `sudo` with command.
7. Configure the `CLI` using [this](https://docs.sentry.io/product/cli/configuration/) document.
8. Install [gcloud](https://cloud.google.com/sdk/docs/install) in the root of your project to be able to deploy to staging. Initialize the gcloud CLI by running `gcloud init`. When prompted, choose the project `sales-engineering-sf`.

Following sub-projects might not work with `deploy.sh` at this moment. Consult their README's for how to run and deploy them (and feel free to submit a PR that fixes it):

- vue
- ruby

Expand All @@ -46,24 +51,32 @@ projects in the command `react` will magically point to it instead of staging (s
Pick one of two ways to run the React app:

### Option 1: Run React app w/ sourcemaps, suspect commits

Recommended to use this command rather than `npm start`, as deploy.sh uploads source maps and handles crashes more realistically.

```
./deploy.sh --env=local react flask
```

or

```
./deploy.sh react --env=local
```

### Option 2: Run React app w/ hot reload

NOTE: this will cause crashing errors to be tagged in sentry as handled (`handled: true`)

```
cd react
../env.sh local npm start
../env.sh local yarn run start
```

### Port Notes

The React app will default to Flask as its backend

```
// points to Flask
localhost:5000
Expand All @@ -81,20 +94,25 @@ localhost:5000?crash=true
Add +2 quantity of a single item to Cart and purchase in order to trigger an Error. Visit the routes defined in src/index.js to produce transactions.

## Deploy to Prod

This script deploys the flagship apps React + Flask. For deploying a single app to App Engine, check each platform's README for specific instructions. Make sure you don't have any local changes to `env-config/production.env`.

```
./deploy.sh react --env=production
```
You can put all 4 apps in deploy.sh for deployment, but that's 4 apps you could be taking down at once, which other people are relying on. With great power, comes great responsibility.

Run `gcloud auth login` if it asks you to authenticate, or insert YubiKey.
You can put all 4 apps in deploy.sh for deployment, but that's 4 apps you could be taking down at once, which other people are relying on. With great power, comes great responsibility.

Run `gcloud auth login` if it asks you to authenticate, or insert YubiKey.

## Deploy to Staging

```
./deploy.sh react flask vue --env=staging
```

## Updating The Apps

```
## Check if you're on your fork. If so, you should see:
git remote -v
Expand All @@ -119,9 +137,11 @@ git merge master
```

## Troubleshooting

See [troubleshooting](./troubleshooting.md)

## Gcloud

```
gcloud app versions list
gcloud app deploy
Expand All @@ -138,5 +158,5 @@ gcloud auth list
gcloud config set account `ACCOUNT`
gcloud config list, to display current account
```
`gcloud app deploy` does not support `--update-env-vars RELEASE=$RELEASE` like `gcloud run deploy` does with Cloud Run

`gcloud app deploy` does not support `--update-env-vars RELEASE=$RELEASE` like `gcloud run deploy` does with Cloud Run
8 changes: 4 additions & 4 deletions react/build.sh
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -5,7 +5,7 @@
set -e # exit immediately if any command exits with a non-zero status

rm -rf build
# npm ci does not update minor versions ->
# (1) less chance of breaking (2) less noise in PR from package-lock.json
npm ci
npm run build # defined in 'scripts' in package.json
# npm ci or yarn install --frozen-lockfile does not update minor versions ->
# (1) less chance of breaking (2) less noise in PR from package-lock.json or yarn.lock
yarn install --frozen-lockfile
yarn run build # defined in 'scripts' in package.json
Loading
Loading