1
2

Delete article

Deleted articles cannot be recovered.

Draft of this article would be also deleted.

Are you sure you want to delete this article?

More than 5 years have passed since last update.

新人デベロッパーのためのマイクロサービス

Last updated at Posted at 2018-12-26

#まずは結論
マイクロサービスアーキテクチャとはRestfulAPIのような小さな処理サービス群(例えばログイン処理、会員情報参照、ビジネスロジック)を集合させて一つの大きなサービスを作ることである
そしてRestfulAPIとはあるURLに対して
Requestを


class Repository {
  postData() {
    const requestBody = {
      quantity: 50,
      comment: "品評会近いから頑張ります"
    }

    const urlPath = '/api/hogehoge'

    fetch(urlPath, {
      body: JSON.stringify(requestBody),
      credentials: 'include',
      headers: {
        'Content-Type': 'application/json',
        'X-XSRF-TOKEN': getCookie('XSRF-TOKEN')
        // トークンとかはここで指定する 上のX-XSRF-TOKENは一例
      },
      method: 'POST'
    })
    .then(response => {
      return response.json()
    })
  }
}

このような形で渡し、そのデータを元にサーバーで様々な処理をしてもらい
その結果のResponseを


// responseの中身
// {
//   comment: "50個受け取りました",
//   status: "受け取った"
// }

class responseGet {
  constructor() {
    this.repository = new Repository()
  }

  getResponseText() {
    this.repository.postData()
      .then(response => {
        console.log(response.comment) //out 50個受け取りました
        console.log(response.status)  //out 受け取った
      })
  }
}

受け取ることができる"場所"のようなものである

#はじめに
僕が新人だった頃社内では「マイクロサービス」という言葉が流行っていました
はっきり行ってしまえばチンプンカンプンでした
自身がこれまで理解したこととチンプンカンプンな人を少しでも減らすために一度簡単にまとめてみようと思います
少しでも理解がすすんでくれるととても嬉しいので上にRequestからResponseの簡単な一つの例を載せておきますが他にも方法はあるので参考程度にしていただけたら嬉しいです
そして僕自身の考えの変遷とどのような問題にブチ当たったか残しておきます
それ故にそんなの分かってるということでも丁寧にカッコ書きで注釈するのでご了承ください

#思い込みの壁
新人だった頃の知識としてバックエンド言語(JavaやGolang)は
・DB処理
・ページを表示するためのHTMLを吐き出す
などwebアプリケーションはバックエンド言語一つで全てをこなすんじゃないかという万能な言語で、JavaScriptは軽視されていました(実際研修や学校でも一切触れることはありませんでした)
この前提知識があったこともあり、マイクロサービスとは反対のモノリシックな思考をしておりそのシステムでしか使えない汎用性と保守性がとても低いコードばかり書いていました
1~2年目に書いたコードはGolangを使いながらもHTMLをString型で組み立てて、htmlTemplateとして吐き出し表示、JavaScriptはページに簡単な変化をもたらせる言語(例えば一定時間たったらリロードする)という認識で目も当てられないものでした
一人で書いていたということや指摘もなかったこともあり今後もこのような形で作ればよいのかと勝手に考えていました

しかしTwitterやQiitaを見ているとバックエンドは情報を取得してきてそのデータを利用してJavascriptで表示することが主流であるということが分かってきました
どのようにやっているのだろうという単純な疑問と興味がわいてきたので調べて実際に書いてみようと思いました

#Request?Response?問題
ブチ当たった大きな問題として「Requestどう投げればいいかわからねえ!」でした
Getに関してはURLを指定してfetchすればよいだけだったのでよかったのですが、Get以外が調べてもはっきりとわかりませんでした
そもそもJSONとは何かということやfetchにつけるオプション、ラスボスとしてトークン周りをどのようにRequestに含めればよいかさっぱりなど分からないことだらけで、周りにも聞くことが出来ない状態だったのでGoogleのAPIをひたすら試すことができるページやGoogleCloudPlatformのログを調べまくっていました
あるときGoogleCloudPlatform内でheadersという項目を見つけました
試しにそのように記載したところどうにかResponseが帰ってくるようになりました上

もう一つ当たった問題として「Responseまではconsole出力できたけどどうやって参照すればいいか分からねえ!」という問題も出てきました
こちらは幸いにもIDE(統合開発環境)が賢く試しに書いて見た所候補を出してくれたので、ことなきをえました
目で見える情報と使用するIDEはホント大事…

問題を解決していく中で「あれ?これデータを受け取ることに特化してるからいろんな所で使い回しがきくのでは?」と思いました
そこでもう一度マイクロサービスという言葉について調べると何を言っているのかが理解することが出来ました

#やっと分かったよマイクロサービス
ここまでの流れを経てやっとマイクロサービスというものがどういうものであるかという輪郭をつかむことが出来ました
現在はwebアプリケーションを作成していてAPIの作成、バックエンド処理、フロントエンド処理というものをしっかりと意識し、コードを書くことができるようになりました
コツとして表示したいページでは
・どのAPIを使ってデータを取得するのかしっかりと調べること
・もしもAPI作成する場合は着手する前にどのようなResponseがバックエンドから帰ってくるのかというイメージをしっかりと持つこと
が学びとしてありました

#最後に
簡単ですが以上まとめになります
ご指摘などありましたらぜひお声かけください!まだまだ勉強したいのでよろしくお願いいたします

1
2
0

Register as a new user and use Qiita more conveniently

  1. You get articles that match your needs
  2. You can efficiently read back useful information
  3. You can use dark theme
What you can do with signing up
1
2

Delete article

Deleted articles cannot be recovered.

Draft of this article would be also deleted.

Are you sure you want to delete this article?