Go-Vue-Todos 项目教程

Go-Vue-Todos 项目教程

go-vue-todosSimple Todos using GoLang and Vue项目地址:https://gitcode.com/gh_mirrors/go/go-vue-todos

1. 项目的目录结构及介绍

go-vue-todos/
├── backend/
│   ├── cmd/
│   │   └── main.go
│   ├── config/
│   │   └── config.go
│   ├── models/
│   │   └── todo.go
│   ├── routes/
│   │   └── routes.go
│   └── utils/
│       └── utils.go
├── frontend/
│   ├── public/
│   │   └── index.html
│   ├── src/
│   │   ├── assets/
│   │   ├── components/
│   │   │   └── TodoList.vue
│   │   ├── App.vue
│   │   └── main.js
│   └── package.json
├── .gitignore
├── README.md
└── docker-compose.yml

目录结构介绍

• backend/: 后端代码目录，包含Go语言编写的API服务。
  • cmd/: 主程序入口。
  • config/: 配置文件和配置管理。
  • models/: 数据模型定义。
  • routes/: API路由定义。
  • utils/: 工具函数和辅助类。
• frontend/: 前端代码目录，包含Vue.js项目。
  • public/: 公共资源，如HTML文件。
  • src/: 源代码目录。
    • assets/: 静态资源文件。
    • components/: Vue组件。
    • App.vue: 主组件。
    • main.js: 入口文件。
  • package.json: 前端项目依赖管理。
• .gitignore: Git忽略文件配置。
• README.md: 项目说明文档。
• docker-compose.yml: Docker容器编排文件。

2. 项目的启动文件介绍

后端启动文件

• backend/cmd/main.go:

  package main
  
  import (
      "go-vue-todos/backend/config"
      "go-vue-todos/backend/routes"
      "log"
      "net/http"
  )
  
  func main() {
      config.LoadConfig()
      router := routes.NewRouter()
      log.Fatal(http.ListenAndServe(":8080", router))
  }
  

前端启动文件

• frontend/src/main.js:

  import Vue from 'vue'
  import App from './App.vue'
  import axios from 'axios'
  
  Vue.config.productionTip = false
  Vue.prototype.$http = axios
  
  new Vue({
    render: h => h(App),
  }).$mount('#app')
  

3. 项目的配置文件介绍

后端配置文件

• backend/config/config.go:

  package config
  
  import (
      "log"
      "os"
  
      "github.com/joho/godotenv"
  )
  
  type Config struct {
      DBHost     string
      DBPort     string
      DBUser     string
      DBPassword string
      DBName     string
  }
  
  var Cfg Config
  
  func LoadConfig() {
      err := godotenv.Load()
      if err != nil {
          log.Fatal("Error loading .env file")
      }
  
      Cfg = Config{
          DBHost:     os.Getenv("DB_HOST"),
          DBPort:     os.Getenv("DB_PORT"),
          DBUser:     os.Getenv("DB_USER"),
          DBPassword: os.Getenv("DB_PASSWORD"),
          DBName:     os.Getenv("DB_NAME"),
      }
  }
  

前端配置文件

• frontend/package.json:

  {
    "name": "go-vue-todos",
    "version": "1.0.0",
    "private": true,
    "scripts": {
      "serve": "vue-cli-service serve",
      "build": "vue-cli-service build",
      "lint": "vue-cli
  

go-vue-todosSimple Todos using GoLang and Vue项目地址:https://gitcode.com/gh_mirrors/go/go-vue-todos