ランサーズ（Lancers）エンジニアブログ > もくもく会 > 2023/5/8週 もくもく会 GraphQL+heroku, typescriptの例外処理, CAMEL etc.
2023/5/8週 もくもく会

2023/5/8週 もくもく会 GraphQL+heroku, typescriptの例外処理, CAMEL etc.

blog_admin｜2023年05月12日
もくもく会

ランサーズでは自己学習の場として毎朝1時間程のもくもく会を開催しています。
もくもく会を開催しようと思ったきっかけは、こちらで紹介しています。
以下は今週の取り組みになります。

今週のもくもく会

発表

谷

  • 続GraphQL+heroku
    • https://zenn.dev/highgrenade/scraps/169d3aa591892f
    • 先週時点では、herokuへデプロイした後に対象のURLを確認するとエラー表示になっていた。
    • 一旦、node+express構成をherokuにデプロイすることに集中
    • ログを読んでると、rimrafが無いという表示があった。
      • package.jsonのdevDependenciesに記載されてるけど何故？
      2023-05-08T02:40:01.545948+00:00 app[web.1]: > rimraf ./build && tsc
2023-05-08T02:40:01.545948+00:00 app[web.1]:
2023-05-08T02:40:01.561031+00:00 app[web.1]: sh: 1: rimraf: not found
2023-05-08T02:40:01.716426+00:00 heroku[web.1]: Process exited with status 127
2023-05-08T02:40:01.766671+00:00 heroku[web.1]: State changed from starting to crashed
    • https://www.yone-it-note.site/nodejs-herokuerror/ を読んでいたら、「devDependenciesはデバッグ時に追加で読み込むライブラリの定義ですが、これがあるとherokuではまともに動作しないようです。」と記載があり、すべてdependenciesに記述するとエラーが解消できた
    • とりあえずHello World
    • ApolloServerもなんとか行けそうな気がする
    • あとはGraphQLの設定を整える＆ローカルでApolloClientを使って通信する記述を行う
    • 一旦、https://afternoon-shore-82089.herokuapp.com/api と疎通する為のReactプロジェクトを作る
    • ViteでReactプロジェクトを作って、ApolloClientの記述をし、ボタンクリックでクエリ実行の処理を記述
    • 出来てしまった
    • 次はheroku + prisma
    • 元々はMySQLでやろうと思ってたけど、PostgreSQL系のサンプルが多い為、そっちに合わせてみる
    • https://www.azukipan.com/posts/graphql-prisma-postgres-setup/
    • heroku側にpostgresqlの環境を作る
    • localのscheme.prismaでモデルを作成
    • npx prisma db pushでheroku側にワンコマンドDB構成を作成する
    • npx prisma studio でheroku側のDBを参照できる
    • prisma studioを立ち上げることで、ブラウザ画面でDBを直接触れる
    • heroku側にexpress + GraphQL + nodeのサーバをデプロイし、DB作成までは行けた
    • 最後にGraphQLからMutation系（Insert, Update, Delete）のクエリを実行してDBのデータを変更できたら終わり

    高橋

    • GW中にしたtypescriptの例外処理の勉強
      • 何かが失敗したことを単に知らせる→null, Option型
      • なぜ失敗したのか多くの情報を与える→例外のスロー、例外を返す
      • などなどなど、例外処理におけるやりたいこととその実装の方法の違いを学びましたー

    砂田

    湯山

    • 今後のもくもく会で何をするか少し考えました。
      • SEO × エンジニアリング領域のお勉強
        • どんなことを学べばいいかというところから、スタート
      • インバスケット思考トレーニング
        • インバスケット思考とは、「タスクを与えられた時間内に的確に、かつ、高い精度でこなすための思考法」を指します。
      • 基礎から React/TS のお勉強し直してみる
      • AI（GPT先生など） の上手な使い方の調査
      • GASのお勉強
      • プロダクトマネジメントのすべて を読む

    岡田

    • GPTをうまく扱うためのプロンプトについて調べる
      • CAMELのデモサイトを触ってみるアレルギーや大会は適当に決まっているが、上手く対話して、解決に向かっている 
        ASSISTANT_PROMPT = TextPrompt(
        """Never forget you are a Computer Programmer and I am a person working in {domain}. Never flip roles!  Never instruct me!
We share a common interest in collaborating to successfully complete a task.
You must help me to complete the task using {language} programming language.
Here is the task: {task}. Never forget our task!
I must instruct you based on your expertise and my needs to complete the task.

I must give you one instruction at a time.
You must write a specific solution that appropriately completes the requested instruction.
You must decline my instruction honestly if you cannot perform the instruction due to physical, moral, legal reasons or your capability and explain the reasons.
Do not add anything else other than your solution to my instruction.
You are never supposed to ask me any questions you only answer questions.
You are never supposed to reply with a flake solution. Explain your solutions.
Your solution must be declarative sentences and simple present tense.
Unless I say the task is completed, you should always start with:

Solution: <YOUR_SOLUTION>

<YOUR_SOLUTION> must contain {language} code and should be specific and provide preferable implementations and examples for task-solving.
Always end <YOUR_SOLUTION> with: Next request.""")

        日本語訳

        ASSISTANT_PROMPT = TextPrompt(
        """あなたはコンピュータープログラマーで、私は{ドメイン}で働く人間であることを決して忘れないでください。決して役割を逆転させないこと！ 決して私に指示しないでください！
私たちは、共同でタスクを成功させるという共通の関心を持っています。
あなたは、私が{言語}プログラミング言語を使用してタスクを完了するのを助けなければなりません。
これがタスクです：{タスク}。私たちのタスクを決して忘れないでください！
私は、タスクを完了するために、あなたの専門知識と私の必要性に基づいて、あなたに指示しなければなりません。

私は一度に1つの指示を出さなければなりません。
あなたは、要求された指示を適切に完了させる具体的な解決策を書かなければなりません。
身体的、道徳的、法的な理由や自分の能力によって指示を実行できない場合は、私の指示を正直に断り、その理由を説明しなければなりません。
私の指示に対して、自分の解答以外のものを付け加えてはいけません。
あなたは、私に質問をすることはできません。
あなたは、薄っぺらい解決策で答えることは決して想定されていません。あなたの解決策を説明しなさい。
あなたの解答は宣言文であり、単純な現在形でなければなりません。
私が課題を完了したと言わない限り、あなたは常にこう始めるべきです：

解決策です： <your_solution> とする。

<YOUR_SOLUTION>は{言語}コードを含み、具体的で、タスク解決のための好ましい実装と例を提供しなければならない。
<YOUR_SOLUTION>の最後には必ずこう書く： 次のリクエスト""")

        出力制御のためにしつこいくらいに命令する

        → ChatGPTとLangChainで恋愛シミュレーションゲーム用AIを実装してみた – Qiita

      • Prompt Engineering Guide（日本語版）を読む（英語版）Introductionまで
        • 指示プロンプト: 
          ### 指示 ###
以下のテキストをスペイン語に翻訳してください。
Text: "hello!"

          出力:

          **¡Hola!**
        • コード生成コード生成の場合は、コードのコメントアウトの形が良さそうプロンプト: 
          /*
ユーザーに名前を聞いて、「こんにちは」と言ってください。
*/

          出力:

          **let name = prompt("あなたの名前は何ですか？");
console.log(`こんにちは、${name}さん！`);**

          プロンプト:

          """
テーブル名 departments、カラム=[DepartmentId、DepartmentName]
テーブル名 students、カラム=[DepartmentId、StudentId、StudentName]
コンピュータサイエンス学科のすべての学生のためのMySQLクエリを作成してください。
"""

          出力:

          **SELECT StudentId、StudentName
FROM students
WHERE DepartmentId IN (SELECT DepartmentId FROM departments WHERE DepartmentName = 'Computer Science');**

    雑談

    • 新卒の方々の技術スタック
      • 砂田さん→Androidエンジニア（なんでもできそう）
      • 湯山さん→Webエンジニア
      • 岡田さん→AIエンジニア
    • 砂田さんは、ノリでなんでも出来そうなエンジニア。ありがたい。
    • 湯山さんは、Web系エンジニアとしてかなり伸びそうなポテンシャルを秘めている
      • フロントエンドの技術スタックに興味がある
      • フロントエンド勉強会の参加をオススメした
    • 岡田さんはAIエンジニアでLLM系の記事を見たりされてる

                         

                        今週の報告は以上です。
                        週毎に取り組みを掲載していきますので、ご期待下さいませ。

                          関連記事

                          1. 2023/4/10週 もくもく会 GraphQL, Web Audio API, Live2d Cubism Editor, AWS Polly, Amplify, testing-library,
                          2. 2023/4/17週 もくもく会 GraphQL, ECS Fargateのタスクロールで認証, Next.js 13 appDir etc.
                          3. 2023/4/24週 もくもく会 GraphQLサーバを作る, Open AIのStream出力, Live2D, Next.js 13 & RSCについて etc.
                          4. 2023/5/15週 もくもく会 GraphQLサーバを実装, Laravel Weekly Update, 単体テストの考え方, StableDiffusionとLoRA, Prompt Engineering Guide, etc.