Merge pull request #11 from Tatsumi0000/feature/ticket-9

Vuetifyの設定と、axiosを使った通信部分、CORS設定を書いてみる

.github/workflows/backend-ci.yml

@@ -19,6 +19,9 @@ concurrency:
   group: ${{ github.workflow }}-${{ github.ref }}
   cancel-in-progress: true
 
+env:
+  RAILS_MASTER_KEY: ${{ secrets.RAILS_MASTER_KEY }}
+
 jobs:
   backend-ci:
     runs-on: ubuntu-latest

web/backend/.gitignore

@@ -18,7 +18,7 @@
 /tmp/pids/*
 !/tmp/pids/
 !/tmp/pids/.keep
-
+.env
 # Ignore uploaded files in development.
 /storage/*
 !/storage/.keep

web/backend/Dockerfile

@@ -1,7 +1,7 @@
 FROM rubylang/ruby:3.2.0-dev-jammy
 RUN apt update && \
     apt -y upgrade && \ 
-    apt -y install imagemagick libyaml-dev libmysqlclient-dev 
+    apt -y install vim imagemagick libyaml-dev libmysqlclient-dev 
 
 RUN gem update && \
     bundle config set path vendor/bundle

web/backend/Gemfile

@@ -41,8 +41,7 @@ gem 'bootsnap', require: false
 # gem "image_processing", "~> 1.2"
 
 # Use Rack CORS for handling Cross-Origin Resource Sharing (CORS), making cross-origin AJAX possible
-# gem "rack-cors"
-
+gem 'rack-cors'
 group :development, :test do
   # See https://guides.rubyonrails.org/debugging_rails_applications.html#debugging-with-the-debug-gem
   gem 'debug', platforms: %i[mri mingw x64_mingw]

web/backend/Gemfile.lock

@@ -151,6 +151,8 @@ GEM
       nio4r (~> 2.0)
     racc (1.7.1)
     rack (3.0.8)
+    rack-cors (2.0.1)
+      rack (>= 2.0.0)
     rack-session (2.0.0)
       rack (>= 3.0.0)
     rack-test (2.1.0)
@@ -272,6 +274,7 @@ DEPENDENCIES
   mysql2 (~> 0.5)
   numo-narray
   puma (~> 6.4)
+  rack-cors
   rails (~> 7.1.0)
   rspec-rails
   rubocop

web/backend/config/application.rb

@@ -23,6 +23,8 @@ class Application < Rails::Application
                        routing_specs: false
     end
 
+    config.x.cors_allowed_origins = ENV.fetch('CORS_ALLOWED_ORIGINS', 'http://localhost:5173')
+
     # Configuration for the application, engines, and railties goes here.
     #
     # These settings can be overridden in specific environments using the files

web/backend/config/credentials.yml.enc

@@ -1 +1 @@
-Ep0j2SQQjNdbD9mU3fgHvbB5eRSrOIifbVP/1qz/J0336lFz/OL7vjs5Jt66OLbLaq6ywtJFnZvlbmh1NMFeCrqMg6jchXh1lkgJcvGj+Uz6OxNSJ0c1dL9mlgd/SzmXEkz63fw5CUfQVRgZVMo7MLIVvqwPXSrHAxWwlsvn1tSe/f8b2NuODykNOyULd4Eb+SEjrHXyuwaU0+yLG/6Wkh7WiyQ+HidS72z6pXDy8LXZjDmD8Ij6Rcfk3rDFrHQcUKXFY4seqYoFcSne7D5OcfK5AfDfvfADS19vHqooc02+zCFMBbPhB1njshvpEUmQ6e8Nfp9OYoF1rfkE1ISEbHfUEzAIm0qA0vhjrec1PP7JmXZYd3Y3kurSScKqVkhJTfTEubW6dTc4Va3GRdVQX0SHMy3OYOyMpsuU--rHQ3Dvh2vIkzhKdR--i7l+9K+4IibecW4xIAqfig==
+BmH7TPjQLwiGCcFeLNTdeUuTz27Fv2bouxrDK8SWS0yiW/xhgPMBmPpd4EPA/yEN5hL5biM/llfatqDGpua8UCFtEm62+7FjBYE0ON51gcw0EBPczkFtMNcMdDDJYuACxMCAFyHBSIvgUOswGpRGtQpqyXCfSiM4anMpr2yQJqyUcMfm0i0AhyIAkE/KtBjVPh7X0Vk2vgZQe/4Mu1JNaw9SetjgXhFnmryQCfUpffZakwmQZ5123ZiB2Vz63FGLDuL5zLHtlpSIy8roDWDS6hngss5SUoLWZKjm0GRD5L+8ZkpHV8gHNEyxIrWxJlY52ZnzowqT0i0LhpI7RjZSbIYUlx4PplwsX3CUapW6UZFpFq8ALdOoqfa42Rgt5+/H8KsDH5Mwml8jfySgGcMbThX0ah5CIj09CuqymAXnYO4bJECtEWmLbxVrXBYpCg7GvJGTZXX2eLEvvAIXDtGISZSeotI9AJIDWgEIxJJfcsfrLEJIkCv//X6s8W3Hn6/yXY+2DQEqvN/pyQeirlfjJdfdFq1SbcUi14pV7hTGL9whni++mX1ayuIl5NqHeIwT1UBHNS28xxWRLJ8bo6GHtNLl4XmCUx+feQ1kERc6eC2giMjFKzPEDKG2G+0xxlzmehUQ6fRX6LIOlPU+SnpZGW88Oox20z2SVgN0iBsfX/J9dGeTwg==--+OnXQEJldTk28UGt--7gRg9i7GtwWFfXvzOOpWfg==

web/backend/config/database.yml

@@ -50,6 +50,7 @@ test:
 #
 production:
   <<: *default
-  database: backend_production
-  username: backend
-  password: <%= ENV["BACKEND_DATABASE_PASSWORD"] %>
+  host: <%= Rails.application.credentials.starrykids[:db_host] %>
+  database: <%= Rails.application.credentials.starrykids[:db_name] %>
+  username: <%= Rails.application.credentials.starrykids[:db_username] %>
+  password: <%= Rails.application.credentials.starrykids[:db_password] %>

web/backend/config/initializers/cors.rb

@@ -5,12 +5,12 @@
 
 # Read more: https://github.com/cyu/rack-cors
 
-# Rails.application.config.middleware.insert_before 0, Rack::Cors do
-#   allow do
-#     origins "example.com"
-#
-#     resource "*",
-#       headers: :any,
-#       methods: [:get, :post, :put, :patch, :delete, :options, :head]
-#   end
-# end
+Rails.application.config.middleware.insert_before 0, Rack::Cors do
+  allow do
+    origins Rails.application.config.x.cors_allowed_origins
+
+    resource "*",
+      headers: :any,
+      methods: [:get, :post, :put, :patch, :delete, :options, :head]
+  end
+end

web/frontend/.env.development

@@ -0,0 +1 @@
+VITE_API_BASE_URL='http://localhost:3000/v1'

web/frontend/.eslintrc.json

@@ -0,0 +1,46 @@
+{
+  "env": {
+    "browser": true,
+    "es2022": true
+  },
+  "extends": [
+    "eslint:recommended",
+    "plugin:@typescript-eslint/recommended",
+    "plugin:@typescript-eslint/eslint-recommended",
+    "plugin:vue/vue3-essential",
+    "prettier"
+  ],
+  "parser": "vue-eslint-parser",
+  "parserOptions": {
+    "ecmaVersion": 13,
+    "parser": "@typescript-eslint/parser",
+    "sourceType": "module",
+    "project": [
+      "./tsconfig.json"
+    ],
+    "extraFileExtensions": [
+      ".vue"
+    ]
+  },
+  "plugins": [
+    "@typescript-eslint",
+    "vue"
+  ],
+  "rules": {
+    "semi": [
+      "error",
+      "always"
+    ],
+    "no-unused-vars": [
+      "error",
+      {
+        "args": "all",
+        "argsIgnorePattern": "^_"
+      }
+    ],
+    "quotes": [
+      "error",
+      "double"
+    ]
+  }
+}

web/frontend/.gitignore

@@ -12,6 +12,7 @@ dist
 dist-ssr
 *.local
 
+.env.production
 # Editor directories and files
 .vscode/*
 !.vscode/extensions.json

web/frontend/index.html

@@ -1,10 +1,10 @@
 <!doctype html>
-<html lang="en">
+<html lang="ja">
   <head>
     <meta charset="UTF-8" />
     <link rel="icon" type="image/svg+xml" href="/vite.svg" />
     <meta name="viewport" content="width=device-width, initial-scale=1.0" />
-    <title>Vite + Vue + TS</title>
+    <title>StarryKids</title>
   </head>
   <body>
     <div id="app"></div>