This repository has been archived by the owner on Jul 14, 2020. It is now read-only.
-
Notifications
You must be signed in to change notification settings - Fork 2
Commit
This commit does not belong to any branch on this repository, and may belong to a fork outside of the repository.
Bump bolt version and add cloud run example
- Loading branch information
Showing
9 changed files
with
1,575 additions
and
137 deletions.
There are no files selected for viewing
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Original file line number | Diff line number | Diff line change |
---|---|---|
@@ -0,0 +1,4 @@ | ||
Dockerfile | ||
README.md | ||
node_modules | ||
npm-debug.log |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Original file line number | Diff line number | Diff line change |
---|---|---|
@@ -0,0 +1,20 @@ | ||
# Use the official lightweight Node.js 12 image. | ||
# https://hub.docker.com/_/node | ||
FROM node:12-slim | ||
|
||
# Create and change to the app directory. | ||
WORKDIR /usr/src/app | ||
|
||
# Copy application dependency manifests to the container image. | ||
# A wildcard is used to ensure both package.json AND package-lock.json are copied. | ||
# Copying this separately prevents re-running npm install on every code change. | ||
COPY package*.json ./ | ||
|
||
# Install production dependencies. | ||
RUN npm install --only=production | ||
|
||
# Copy local code to the container image. | ||
COPY . ./ | ||
|
||
# Run the web service on container startup. | ||
CMD [ "npm", "start" ] |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Original file line number | Diff line number | Diff line change |
---|---|---|
@@ -0,0 +1,131 @@ | ||
# Japan Weather Radar Map (雨雲レーダー) on Slack | ||
|
||
This is a working example app which displays Japan weather radar maps on Slack. This application is built with [Bolt⚡️](https://github.com/SlackAPI/bolt) and [Yahoo! JAPAN Static Map API (雨雲レーダー表示)](https://developer.yahoo.co.jp/webapi/map/openlocalplatform/v1/static.html#exp_weather). | ||
|
||
[](https://heroku.com/deploy?template=https://github.com/seratch/slack-weather-radar-map/tree/master) | ||
|
||
## `/amesh {prefecture name}` | ||
|
||
This command posts an animated GIF showing the forecasting weather map. | ||
|
||
<img src="https://raw.githubusercontent.com/seratch/slack-weather-radar-map/master/images/demo_amesh_hiroshima.gif" height=400/> | ||
|
||
## `/amesh {prefecture name} now` | ||
|
||
This command instantly posts the present moment image. | ||
|
||
<img src="https://raw.githubusercontent.com/seratch/slack-weather-radar-map/master/images/demo_amesh_tokyo_now.gif" height=400/> | ||
|
||
## `/amesh {prefecture name} today` | ||
|
||
This command posts the transition of weather map in the last 24 hours. | ||
|
||
<img src="https://raw.githubusercontent.com/seratch/slack-weather-radar-map/master/images/demo_amesh_okinawa_today.gif" height=400/> | ||
|
||
## Map Mode | ||
|
||
https://developer.yahoo.co.jp/webapi/map/openlocalplatform/v1/static.html#request-param | ||
|
||
The defualt map mode is `map`. If you'd like to customize the appearance, set `YAHOO_JAPAN_API_MAP_MODE` env variable with either of the following values. | ||
|
||
* map - 通常の地図 | ||
* photo - 航空写真 | ||
* map-b1 - 地下街 | ||
* hd - ハイビジョン地図 | ||
* hybrid - ハイブリッド地図 | ||
* blankmap - 白地図 | ||
* osm - Open Street Map | ||
|
||
Here is the output with `hybrid` mode. | ||
|
||
<img src="https://raw.githubusercontent.com/seratch/slack-weather-radar-map/master/images/demo_amesh_fukuoka_hybrid_mode.gif" height=300/> | ||
|
||
## How to run this app | ||
|
||
### Create a Slack App | ||
|
||
https://api.slack.com/apps | ||
|
||
* Features > OAuth & Permissions: | ||
* Scopes: | ||
* "bot" | ||
* "commands" | ||
* "files:write:user" | ||
* Click "Save Changes" | ||
* Features > Slash Commands: | ||
* Click "Create New Command" | ||
* Command | ||
* Set `/amesh` | ||
* Request URL | ||
* Set `https://{your app name}.herokuapp.com/slack/events` | ||
* Short Description | ||
* Set something helpful for users | ||
* Click "Save" | ||
* Features > Bot User: | ||
* Click "Add a Bot User" | ||
* Click "Add Bot User" | ||
* Settings > Install App: | ||
* Complete "Install App" | ||
|
||
### Run the app on your laptop | ||
|
||
```bash | ||
# prep | ||
nvm use 10.13.0 # Bolt runs on Node 10.13+ | ||
cp -p _env .env | ||
vi .env | ||
source .env | ||
npm i | ||
|
||
# run the app | ||
npm run local | ||
|
||
# on another terminal window | ||
ngrok http 3000 | ||
``` | ||
|
||
### Deploy to Google Cloud Run | ||
|
||
``` | ||
gcloud config set project ${GCLOUD_PROJECT_ID} | ||
gcloud config set run/region asia-northeast1 | ||
gcloud builds submit --tag gcr.io/${GCLOUD_PROJECT_ID}/weather-radar | ||
export GCLOUD_PROJECT_ID={something-great-12345} | ||
export SLACK_SIGNING_SECRET={abcabcabcabcabcbabc} | ||
export SLACK_BOT_TOKEN={xoxb-1234123412-123412341212-abcabcabc} | ||
export YAHOO_JAPAN_API_CLIENT_ID={abcabcabcabcabcabcabcabcabcabcabcabc} | ||
gcloud beta run deploy weather-radar \ | ||
--image gcr.io/${GCLOUD_PROJECT_ID}/weather-radar \ | ||
--platform managed \ | ||
--update-env-vars \ | ||
SLASH_COMMAND_NAME=tenki,\ | ||
SLACK_SIGNING_SECRET=${SLACK_SIGNING_SECRET},\ | ||
SLACK_BOT_TOKEN=${SLACK_BOT_TOKEN},\ | ||
YAHOO_JAPAN_API_CLIENT_ID=${YAHOO_JAPAN_API_CLIENT_ID},\ | ||
YAHOO_JAPAN_API_MAP_MODE-=map,\ | ||
TZ=Asia/Tokyo | ||
``` | ||
|
||
``` | ||
$ gcloud beta run deploy weather-radar \ | ||
> --image gcr.io/${GCLOUD_PROJECT_ID}/weather-radar \ | ||
> --platform managed \ | ||
> --update-env-vars \ | ||
> SLASH_COMMAND_NAME=tenki,\ | ||
> SLACK_SIGNING_SECRET=${SLACK_SIGNING_SECRET},\ | ||
> SLACK_BOT_TOKEN=${SLACK_BOT_TOKEN},\ | ||
> YAHOO_JAPAN_API_CLIENT_ID=${YAHOO_JAPAN_API_CLIENT_ID},\ | ||
> YAHOO_JAPAN_API_MAP_MODE-=map,\ | ||
> TZ=Asia/Tokyo | ||
Deploying container to Cloud Run service [weather-radar] in project [something-great-12345] region [asia-northeast1] | ||
✓ Deploying... Done. | ||
✓ Creating Revision... | ||
✓ Routing traffic... | ||
Done. | ||
Service [weather-radar] revision [weather-radar-********] has been deployed and is serving 100 percent of traffic at https://weather-radar-********-an.a.run.app | ||
```` |
Oops, something went wrong.