LoginSignup
1
1

More than 1 year has passed since last update.

元組み込みC++エンジニアがWebアプリを作ってみる - とりあえず動かしてみる

Last updated at Posted at 2022-04-03

※親ページはコチラ

やること

とりあえず、バックエンドのルーターを作って動かしてみます。
ブラウザでURL(今はローカルなのでlocalhost)を指定して、データが取得できることを確認します。

下準備

だいたいターミナル操作です。

ディレクトリ構成

$ cd ~
$ # 作成するアプリのもろもろを配置するディレクトリ
$ mkdir first_app && cd first_app
$ # ページのルーターを配置するディレクトリ
$ mkdir first_app_router && cd first_app_router

インストール

  • Go
    MacならHomebrewが入っていれば楽ですね。
    現時点で1.18が最新です。
$ brew install go
$ go version
go version go1.18 darwin/amd64

モジュール管理ツールModulesの初期化

依存モジュールを管理するため、Goに組み込まれているモジュール管理ツールModulesを初期化します。

$ # とりあえずGitHubなどで公開しないので、モジュール名はよしなに
$ go mod init first_app_router

実行すると、go.modが生成されるはずです。

$ cat go.mod 
module first_app_router

go 1.18

作ってみましょう

※以下、引き続き~/first_app/first_app_routerで作業します。

処理メイン部分main.goを作成

main.go
package main

import (
	"net/http"
	"github.com/gin-gonic/gin"
)

func main() {
	engine := gin.Default()

	engine.GET("/", func (c *gin.Context) {
		c.JSON(http.StatusOK, gin.H {
			"message": "Hello, my first app!",
		})
	})

	engine.Run(":8080")
}

えっ?これだけで動くの? と思うじゃないですか。動きます。
このソースコードでやっているのは、ブラウザからアクセスするとJSON形式で{"message":"Hello, my first app!"}を表示するだけですが、少なくともこれだけで自分の作ったものが動くことを確認できます。
(本来はちゃんとHTMLを出したいところですが、テンプレートの準備などが必要なため、JSONにしています)

ビルド(失敗します)

ビルドして、実行バイナリを生成します。

$ go build
main.go:5:2: no required module provides package github.com/gin-gonic/gin; to add it:
        go get github.com/gin-gonic/gin

「使用するモジュールがありません」ですね。
main.goimportしているGinが見つからないためです。
エラーメッセージに従って、getしてみましょう。

モジュールをget

$ go get github.com/gin-gonic/gin

追加モジュールがgetできましたね。

今度こそビルド

ビルドして、実行バイナリを生成します。

$ go build

何もエラーが出ていなければ、ビルド成功です!おめでとうございます🎉
エラーが出ていれば、エラーメッセージを読んだり検索かけてみて対処しましょう。
(こちらの環境ではgolang.org/x/sys関連のエラーが発生しており、go get -u golang.org/x/sysが必要でした)

ビルドできれば、実行バイナリfirst_app_routerが生成されています。

動かしてみましょう

起動しないでブラウザからアクセス

まずはお手元のブラウザのURLを入れるところにlocalhost:8080と入れ、アクセスしてみましょう。
表示できませんね?それでOKです。
何か表示されてしまうようなら、そのアプリを止めるか、ソースコードのポート番号(engine.Run(":8080")":8080")を適当なものに変えましょう。

起動

ターミナルからバイナリを起動します。

$ ./first_app_router
...(何か出る)..

起動してブラウザからアクセス

ブラウザでさっき表示できなかったページを再読み込みしてみましょう。
スクリーンショット 2022-04-03 20.54.16.png
このような文字列が表示されましたか?おめでとうございます🎉
もしも自分で作成したものが表示されているのか不安なら、ソースコードを変えてみて再ビルドして同じようにやってみましょう。

実行を止めてブラウザからアクセス

ターミナルでCtrl + Cで実行を止め、ブラウザで再読み込みしてみましょう。
表示できませんね?実行を止めればもちろん表示できなくなります。

いかがでしたか

ソースコード20行くらいだけで、もうバックエンドっぽいものができちゃいました。
GoとGinのおかげですね!

ただし、まだページらしいページは表示できていませんし、デバッグもできていません。
以降はこれらができる方法を紹介します。

1
1
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
1