Snyk - 深く考えずにとりあえず触ってみた

[Snyk](https://snyk.io/)はSoftware開発者向けSecurity Platformで開発者にとって最も頭が痛い脆弱性チェックを勝手にやってくれるサービスです。この記事はSnyk初心者が何も考えずにとりあえず触ってみた際の作業記録です。

# 前提条件
MacBookにnpm/node、Postmanがインストール済で[Snyk](https://snyk.io/)のアカウントがSign-up済であることが前提です。以下、私の作業環境です。

```console
$ uname -r
21.5.0

$ npm -v
6.14.16

node -v
v12.22.12
```


# 作業記録
Auth TokenとOrganization IDを取得します。Auth TokenはSnykのConsoleから取得できます。"click to show"をクリックしてValueをコピーします。
<img src="https://i.imgur.com/kbnBRND.jpg" width=70%>
<img src="https://i.imgur.com/qKsS8eQ.jpg" width=70%>
<br>

Postmanを起動して"Authorization"の"Value"に取得したAuth TokenをペーストしてSaveをクリックします。
**<font color="DarkOrange">Postmanの設定方法詳細は割愛します。**
<img src="https://i.imgur.com/jCAk0dB.jpg" width=70%>

[API Endpoint](https://snyk.io/api/v1/user/me)にGETリクエストを送信してOrganization IDを取得します。
<img src="https://i.imgur.com/P8LB8SC.jpg" width=70%>
<br>

[Sample App](https://github.com/snyk/snyk-apps-demo)をCloneします。

```console
$ git clone git@github.com:snyk/snyk-apps-demo.git
$ cd snyk-apps-demo
```

必要なPackageをInstallします。

```console
$ npm install

> nodemon@2.0.12 postinstall /Users/hyamaguc/snyk-apps-demo/node_modules/nodemon
> node bin/postinstall || exit 0

added 1077 packages from 503 contributors and audited 1080 packages in 237.74s

66 packages are looking for funding
  run `npm fund` for details

found 11 critical severity vulnerabilities
  run `npm audit fix` to fix them, or `npm audit` for details
```

Snyk Applicationを作成します。
**<font color="DarkOrange">"authToken"と"orgId"には先に取得したValueを指定します。**

```console
$ npm run create-app -- --authToken=xxxx --orgId=xxxx --scopes=org.read org.project.read --name=my-first-snyk-app

> snyk-apps-demo@1.0.0 create-app /Users/hyamaguc/snyk-apps-demo
> ts-node src/scripts/create-app.ts "--authToken=xxxx" "--orgId=xxxx" "--scopes=org.read" "org.project.read" "--name=my-first-snyk-app"

Congratulations, you have a new App setup and ready to develop! Your client-id & client-secret have already been set in .env, which should stay secret and out of git. Enjoy!
```

必要なParameterが自動的に.envに入ります。

```console
CLIENT_ID=1cdb105f-9c12-4c07-acd9-46a80130cf3c
CLIENT_SECRET=xxxx
REDIRECT_URI=http://localhost:3000/callback
SCOPES=org.read,org.project.read
ENCRYPTION_SECRET=xxxx
```

Applicationを起動します。

```console
$ npm run build

> snyk-apps-demo@1.0.0 prebuild /Users/hyamaguc/snyk-apps-demo
> npm run clean


> snyk-apps-demo@1.0.0 clean /Users/hyamaguc/snyk-apps-demo
> rimraf ./dist


> snyk-apps-demo@1.0.0 build /Users/hyamaguc/snyk-apps-demo
> npx tsc


> snyk-apps-demo@1.0.0 postbuild /Users/hyamaguc/snyk-apps-demo
> ncp ./src/public ./dist/public && ncp ./src/views ./dist/views

$ npm run dev

> snyk-apps-demo@1.0.0 dev /Users/hyamaguc/snyk-apps-demo
> node dist/index.js


            Using db: /Users/hyamaguc/snyk-apps-demo/db/db.json

            App listening on port: 3000

            User view: http://localhost:3000
            Admin view: http://localhost:3000/admin
```
<br>

Chromeで[http://localhost:3000](http://localhost:3000)にアクセスして"Install App"をクリックします。
<img src="https://i.imgur.com/lld1lxa.jpg" width=70%>

"Grant app access"をクリックします。
<img src="https://i.imgur.com/Lb3KkUj.jpg" width=70%>

Done!
<img src="https://i.imgur.com/QdHTQEh.jpg" width=70%>

# おわりに
どうでも良い作業記録に最後までお付き合い頂きありがとうございます。サイバー犯罪だらけの昨今、"DevSecOps"と言う言葉を聞かない日は無いくらいSecurityは重要なピースになってきましたね。Software開発者のミッションはユーザに求められている機能をいち早く実装して市場に投入することで、Securityのことを気にしている暇はありません。餅は餅屋で自分のミッション以外のことはその筋の専門サービスに任せることでより質の良いサービスをいち早く市場に投入することで安全快適なデジタルサービスを多くの人に届けることができますね。