跟随我一起踏上 Go 学习之旅

跟随我一起踏上 go 学习之旅

我正在开发一个小游戏,在后端使用 go,在前端使用 typescript 进行 react。在我的日常工作中,我主要使用 laravel 框架来使用 php,因此 go 对我来说是一种新的编程语言,我发现最好的学习方法就是实践。那么请跟随我一起了解构建这个项目的旅程。我已经完成了一半,但我会与您分享未来的 pr。

这款游戏名为“嫌疑人召回”。您可以在这里查看到目前为止我所掌握的内容:https://www.suspectrecall.com 首先,您会看到嫌疑人几秒钟,然后您必须记住嫌疑人具有哪些属性。我稍后会改进设计,尽管这不是这个项目的重点。

接下来的待办事项是随机获取嫌疑人。我为这部分代码打开了 pr:https://github.com/artisanphil/suspect_recall/pull/4 欢迎代码审查!我还计划保存答案,以便我可以了解有多少人尝试过该网站以及他们犯了多少错误。

代码结构概览

原本我有两个文件夹,后端和前端,但我发现实际上最好的方法是将后端代码放在根目录中,将前端文件夹放在后端文件夹中。
我们不需要部署前端代码,只需部署从构建中创建的代码即可。在自述文件中了解如何运行本地开发代码。

如果您刚刚下载了该项目,则需要在前端文件夹中运行 npm install 将依赖项拉入文件夹“node_modules”。
在前端文件夹中创建一个 .env 文件并添加 react_app_mode=development。这样,当通过实时重新加载运行前端代码时,它将调用在另一个端口上运行的 api 端点。然后运行 ​​npm run start。

我们现在可以访问 localhost:3000 并查看前端。正如您将看到的,api端点将不起作用,所以让我们转到根文件夹并运行 go run .. 请注意,我们需要在本地运行时允许跨域请求,因为它在另一个端口上运行(端口 8080,前端为 3000)。

c := cors.New(cors.Options{
        AllowedOrigins:   []string{"http://localhost:3000"},
        AllowedHeaders:   []string{"Origin", "Content-Type", "Accept"},
        AllowCredentials: true,
    })

在生产环境中运行时,它将在同一端口上运行,因为我们在使用 npm run build 构建前端代码(创建静态文件)后运行后端代码。顺便说一句,我将代码部署到了 google app engine。

请查看此 pr,其中我添加了一个新的 api,用于动态获取嫌疑人(当前是硬编码的)并在前端调用该端点:https://github.com/artisanphil/suspect_recall/pull/4

预先感谢您对如何改进代码的任何评论,我将尽力回答您可能有的任何问题。

为了查看未来的进展,请观看此存储库:https://github.com/artisanphil/suspect_recall

以上就是跟随我一起踏上 Go 学习之旅的详细内容,更多请关注其它相关文章!