Init frontend

.gitignore

@@ -27,3 +27,26 @@ pip-log.txt
 .mypy_cache
 
 .venv
+
+
+
+node_modules/
+/dist/
+
+# local env files
+.env.local
+.env.*.local
+
+# Log files
+npm-debug.log*
+yarn-debug.log*
+yarn-error.log*
+
+# Editor directories and files
+.idea
+.vscode
+*.suo
+*.ntvs*
+*.njsproj
+*.sln
+*.sw*

app/api/api_v1/endpoints/match.py

@@ -1,96 +0,0 @@
-from typing import Any, List
-
-from fastapi import APIRouter, Body, Depends, HTTPException
-from fastapi.encoders import jsonable_encoder
-from pydantic.networks import EmailStr
-from sqlalchemy.orm import Session
-
-from app import crud
-from app.api import deps
-
-from app.models.player import Player, PlayerCreate, PlayerUpdate
-from app.models.user import User
-
-router = APIRouter()
-
-
-@router.get("/{id}", response_model=Player)
-def read_player(
-    *,
-    db: Session = Depends(deps.get_db),
-    firstname: str,
-    lastname: str,
-    current_user: User = Depends(deps.get_current_active_user),
-) -> Any:
-    """
-    Get player by firstname and lastname.
-    """
-    player = crud.player.get_player_by_name(
-        db=db, firstname=firstname, lastname=lastname
-    )
-    if not player:
-        raise HTTPException(status_code=404, detail="player not found")
-    if not crud.user.is_superuser(current_user):
-        raise HTTPException(status_code=400, detail="Not enough permissions")
-    return player
-
-
-@router.post("/", response_model=List[Player])
-def create_player(
-    *,
-    db: Session = Depends(deps.get_db),
-    players_in: list[PlayerCreate],
-    current_user: User = Depends(deps.get_current_active_superuser),
-) -> Any:
-    """
-    Create new user.
-    """
-    player_out = []
-    for player_in in players_in:
-        player = crud.player.get_player_by_name(
-            db, firstname=player_in.firstname, lastname=player_in.lastname
-        )
-        if player:
-            raise HTTPException(
-                status_code=400,
-                detail=f"The user with this username already exists in the "
-                       f"system. Player is {player}",
-            )
-        player = crud.player.create(db, obj_in=player_in)
-        player_out.append(player)
-
-    return player_out
-
-
-@router.get("/", response_model=List[Player])
-def get_players(
-    db: Session = Depends(deps.get_db),
-    skip: int = 0,
-    limit: int = 100,
-    current_user: User = Depends(deps.get_current_active_superuser),
-) -> Any:
-    """
-    Retrieve all players.
-    """
-    player = crud.player.get_multi(db, skip=skip, limit=limit)
-    return player
-
-
-@router.post("/{id}", response_model=Player)
-def update_player(
-    *,
-    db: Session = Depends(deps.get_db),
-    id: int,
-    player_in: PlayerUpdate,
-    current_user: User = Depends(deps.get_current_active_user),
-) -> Any:
-    """
-    Update player.
-    """
-
-    player = crud.player.get(db=db, id=id)
-    if not player:
-        raise HTTPException(status_code=404, detail="Player not found")
-
-    player = crud.player.update(db=db, db_obj=player, obj_in=player_in)
-    return player

app/db/base.py

@@ -1,4 +0,0 @@
-from app.db.base_class import Base  # noqa
-
-# from app.models.item import Item  # noqa
-from app.models.user import User  # noqa

app/models/match.py

@@ -1,24 +0,0 @@
-from typing import Optional
-
-from sqlmodel import SQLModel, Field
-
-from app.db.base_class import Base
-
-
-class Match(SQLModel, Base, table=True):
-    matchname: Optional[str] = Field(nullable=False)
-
-"""
-    match_id = Column(Integer, primary_key=True)
-    team_1 = Column(ForeignKey("team.id"), nullable=False)
-    team_2 = Column(ForeignKey("team.id"), nullable=False)
-    day = Column(ForeignKey("matchday.id"), nullable=False)
-    winner = Column(ForeignKey("team.team_id"), nullable=True)
-    team_1_result = Column(Integer, nullable=True)
-    team_2_result = Column(Integer, nullable=True)
-
-    matchday = relationship("Matchday")
-    team = relationship("Team", primaryjoin="Match.team_1 == Team.team_id")
-    team1 = relationship("Team", primaryjoin="Match.team_2 == Team.team_id")
-    team2 = relationship("Team", primaryjoin="Match.winner == Team.team_id")
-"""

backend/app/api/api_v1/api.py

@@ -1,11 +1,11 @@
 from fastapi import APIRouter
 
-from app.api.api_v1.endpoints import users
+from backend.app.api.api_v1.endpoints import users
-from app.api.api_v1.endpoints import login
+from backend.app.api.api_v1.endpoints import login
-from app.api.api_v1.endpoints import player
+from backend.app.api.api_v1.endpoints import player
-from app.api.api_v1.endpoints import team
+from backend.app.api.api_v1.endpoints import team
-from app.api.api_v1.endpoints import match
+from backend.app.api.api_v1.endpoints import match
-from app.api.api_v1.endpoints import matchday
+from backend.app.api.api_v1.endpoints import matchday
 
 api_router = APIRouter()
 api_router.include_router(login.router, tags=["login"])
@@ -13,4 +13,4 @@ api_router.include_router(users.router, prefix="/users", tags=["users"])
 api_router.include_router(player.router, prefix="/player", tags=["player"])
 api_router.include_router(team.router, prefix="/team", tags=["team"])
 api_router.include_router(matchday.router, prefix="/matchday", tags=["matchday"])
-#api_router.include_router(match.router, prefix="/match", tags=["match"])
+api_router.include_router(match.router, prefix="/match", tags=["match"])

backend/app/api/api_v1/endpoints/login.py

@@ -5,15 +5,15 @@ from fastapi import APIRouter, Body, Depends, HTTPException
 from fastapi.security import OAuth2PasswordRequestForm
 from sqlalchemy.orm import Session
 
-from app import crud
+from backend.app import crud
-from app.api import deps
+from backend.app.api import deps
-from app.core import security
+from backend.app.core import security
-from app.core.config import settings
+from backend.app.core.config import settings
-from app.core.security import get_password_hash
+from backend.app.core.security import get_password_hash
-from app.models.msg import Msg
+from backend.app.models.msg import Msg
-from app.models.token import Token
+from backend.app.models.token import Token
-from app.models.user import User
+from backend.app.models.user import User
-from app.utils import (
+from backend.app.utils import (
     generate_password_reset_token,
     send_reset_password_email,
     verify_password_reset_token,

backend/app/api/api_v1/endpoints/match.py

@@ -0,0 +1,83 @@
+from typing import Any, List
+
+from fastapi import APIRouter, Depends, HTTPException
+from sqlalchemy.orm import Session
+
+from backend.app import crud
+from backend.app.api import deps
+
+from backend.app.models.match import Match, MatchCreate, MatchUpdate
+from backend.app.models.user import User
+
+router = APIRouter()
+
+
+@router.get("/{match_id}", response_model=Match)
+def read_match(
+    *,
+    db: Session = Depends(deps.get_db),
+    match_id: int,
+    current_user: User = Depends(deps.get_current_active_user),
+) -> Any:
+    """
+    Get match by id.
+    """
+    match = crud.match.get(
+        db=db, id=match_id
+    )
+    if not match:
+        raise HTTPException(status_code=404, detail="match not found")
+    if not crud.user.is_superuser(current_user):
+        raise HTTPException(status_code=400, detail="Not enough permissions")
+    return match
+
+
+@router.post("/", response_model=Match)
+def create_match(
+    *,
+    db: Session = Depends(deps.get_db),
+    match_in: MatchCreate,
+    current_user: User = Depends(deps.get_current_active_superuser),
+) -> Any:
+    """
+    Create new user.
+    """
+
+    match = crud.match.create(db, obj_in=match_in)
+
+
+    return match
+
+
+@router.get("/", response_model=List[Match])
+def get_matchs(
+    db: Session = Depends(deps.get_db),
+    skip: int = 0,
+    limit: int = 100,
+    current_user: User = Depends(deps.get_current_active_superuser),
+) -> Any:
+    """
+    Retrieve all matchs.
+    """
+    match = crud.match.get_multi(db, skip=skip, limit=limit)
+    return match
+
+
+@router.post("/{match_id}", response_model=Match)
+def update_match(
+    *,
+    db: Session = Depends(deps.get_db),
+    match_id: int,
+    match_in: MatchUpdate,
+    current_user: User = Depends(deps.get_current_active_user),
+) -> Any:
+    """
+    Update match.
+    """
+
+    match = crud.match.get(db=db, id=match_id)
+    if not match:
+        raise HTTPException(status_code=404, detail="Match not found")
+
+    match = crud.match.update(db=db, db_obj=match, obj_in=match_in)
+    return match

backend/app/api/api_v1/endpoints/matchday.py

@@ -3,12 +3,12 @@ from typing import Any, List
 from fastapi import APIRouter, Depends, HTTPException
 from sqlalchemy.orm import Session
 
-from app import crud
+from backend.app import crud
-from app.api import deps
+from backend.app.api import deps
 
-from app.models.matchday import Matchday, MatchdayCreate, MatchdayUpdate, \
+from backend.app.models.matchday import Matchday, MatchdayCreate, MatchdayUpdate, \
     MatchdayWithPlayers
-from app.models.user import User
+from backend.app.models.user import User
 
 router = APIRouter()
 

backend/app/api/api_v1/endpoints/player.py

@@ -3,12 +3,12 @@ from typing import Any, List
 from fastapi import APIRouter,  Depends, HTTPException
 from sqlalchemy.orm import Session
 
-from app import crud
+from backend.app import crud
-from app.api import deps
+from backend.app.api import deps
 
-from app.models.player import Player, PlayerCreate, PlayerUpdate, \
+from backend.app.models.player import Player, PlayerCreate, PlayerUpdate, \
     PlayerTeamsMatchdays
-from app.models.user import User
+from backend.app.models.user import User
 
 router = APIRouter()
 

backend/app/api/api_v1/endpoints/team.py

@@ -4,10 +4,10 @@ from fastapi import APIRouter, Depends, HTTPException
 
 from sqlalchemy.orm import Session
 
-from app import crud
+from backend.app import crud
-from app.api import deps
+from backend.app.api import deps
-from app.models.team import Team, TeamCreate, TeamWithPlayers
+from backend.app.models.team import Team, TeamCreate, TeamWithPlayers
-from app.models.user import User
+from backend.app.models.user import User
 
 router = APIRouter()
 
@@ -40,7 +40,7 @@ def get_teams(
     """
     Retrieve teams.
     """
-    team = crud.team.get_multi( db, skip=skip, limit=limit)
+    team = crud.team.get_multi(db, skip=skip, limit=limit)
     return team
 
 

backend/app/api/api_v1/endpoints/users.py

@@ -5,10 +5,10 @@ from fastapi.encoders import jsonable_encoder
 from pydantic.networks import EmailStr
 from sqlalchemy.orm import Session
 
-from app import crud, models
+from backend.app import crud
-from app.api import deps
+from backend.app.api import deps
-from app.core.config import settings
+from backend.app.core.config import settings
-from app.models.user import UserUpdate, User, UserCreate
+from backend.app.models.user import UserUpdate, User, UserCreate
 
 router = APIRouter()
 

backend/app/api/deps.py

@@ -6,12 +6,12 @@ from jose import jwt
 from pydantic import ValidationError
 from sqlalchemy.orm import Session
 
-from app import crud
+from backend.app import crud
-from app.models.token import TokenPayload
+from backend.app.models.token import TokenPayload
-from app.models.user import User
+from backend.app.models.user import User
-from app.core import security
+from backend.app.core import security
-from app.core.config import settings
+from backend.app.core.config import settings
-from app.db.session import SessionLocal
+from backend.app.db.session import SessionLocal
 
 reusable_oauth2 = OAuth2PasswordBearer(
     tokenUrl=f"{settings.API_V1_STR}/login/access-token"

backend/app/core/security.py

@@ -4,7 +4,7 @@ from typing import Any, Union
 from jose import jwt
 from passlib.context import CryptContext
 
-from app.core.config import settings
+from backend.app.core.config import settings
 
 pwd_context = CryptContext(schemes=["bcrypt"], deprecated="auto")
 

backend/app/crud/__init__.py

@@ -2,3 +2,4 @@ from .crud_user import user
 from .crud_player import player
 from .crud_team import team
 from .crud_matchday import matchday
+from .crud_match import match

backend/app/crud/base.py

@@ -5,7 +5,7 @@ from pydantic import BaseModel
 from sqlalchemy.orm import Session
 from sqlmodel import select
 
-from app.db.base_class import Base
+from backend.app.db.base_class import Base
 
 ModelType = TypeVar("ModelType", bound=Base)
 CreateSchemaType = TypeVar("CreateSchemaType", bound=BaseModel)

backend/app/crud/crud_match.py

@@ -0,0 +1,19 @@
+from sqlalchemy.orm import Session
+from backend.app.crud.base import CRUDBase
+from backend.app.models.match import Match, MatchCreate, MatchUpdate
+
+
+class CRUDMatch(CRUDBase[Match, MatchCreate, MatchUpdate]):
+
+    def create(self, db: Session, *, obj_in: MatchCreate) -> Match:
+        db_obj = Match(
+            **obj_in.dict()
+        )
+        db.add(db_obj)
+        db.commit()
+        db.refresh(db_obj)
+        return db_obj
+
+
+
+match = CRUDMatch(Match)

backend/app/crud/crud_matchday.py

@@ -1,11 +1,11 @@
-from typing import Any, Dict, Union, Optional
+from typing import Any
 
 from sqlmodel import select
 from sqlalchemy.orm import Session
 
-from app.crud import player as crud_player
+from backend.app.crud import player as crud_player
-from app.crud.base import CRUDBase
+from backend.app.crud.base import CRUDBase
-from app.models.matchday import Matchday, MatchdayCreate, MatchdayUpdate
+from backend.app.models.matchday import Matchday, MatchdayCreate, MatchdayUpdate
 
 
 class CRUDMatchday(CRUDBase[Matchday, MatchdayCreate, MatchdayUpdate]):

backend/app/crud/crud_player.py

@@ -1,9 +1,9 @@
-from typing import Any, Dict, Optional, Union
+from typing import Optional
 
 from sqlalchemy.orm import Session
 
-from app.crud.base import CRUDBase
+from backend.app.crud.base import CRUDBase
-from app.models.player import Player, PlayerCreate, PlayerUpdate
+from backend.app.models.player import Player, PlayerCreate, PlayerUpdate
 
 
 class CRUDPlayer(CRUDBase[Player, PlayerCreate, PlayerUpdate]):

backend/app/crud/crud_team.py

@@ -1,11 +1,8 @@
-from typing import Any, Dict, Optional, Union, List
-
 from sqlalchemy.orm import Session
-from sqlmodel import select
 
-from app.crud.base import CRUDBase
+from backend.app.crud.base import CRUDBase
-from app.crud import player as crud_player
+from backend.app.crud import player as crud_player
-from app.models.team import Team, TeamCreate, TeamUpdate
+from backend.app.models.team import Team, TeamCreate, TeamUpdate
 
 
 class CRUDTeam(CRUDBase[Team, TeamCreate, TeamUpdate]):

backend/app/crud/crud_user.py

@@ -2,9 +2,9 @@ from typing import Any, Dict, Optional, Union
 
 from sqlalchemy.orm import Session
 
-from app.core.security import get_password_hash, verify_password
+from backend.app.core.security import get_password_hash, verify_password
-from app.crud.base import CRUDBase
+from backend.app.crud.base import CRUDBase
-from app.models.user import User, UserCreate, UserUpdate
+from backend.app.models.user import User, UserCreate, UserUpdate
 
 
 

backend/app/db/base.py

@@ -0,0 +1,4 @@
+from backend.app.db.base_class import Base  # noqa
+
+# from app.models.item import Item  # noqa
+from backend.app.models.user import User  # noqa

backend/app/db/init_db.py

@@ -1,17 +1,16 @@
 from sqlalchemy.orm import Session
 
-from app import crud
+from backend.app import crud
-from app.core.config import settings
+from backend.app.core.config import settings
-from app.db import base  # noqa: F401
 
 # make sure all SQL Alchemy models are imported (app.db.base) before initializing DB
 # otherwise, SQL Alchemy might fail to initialize relationships properly
 # for more details: https://github.com/tiangolo/full-stack-fastapi-postgresql/issues/28
-from app.db.base_class import Base
+from backend.app.db.base_class import Base
-from app.db.session import engine
+from backend.app.db.session import engine
-from app.models.player import Player, PlayerCreate
+from backend.app.models.player import PlayerCreate
-from app.models.team import TeamCreate, TeamWithPlayers
+from backend.app.models.team import TeamWithPlayers
-from app.models.user import UserCreate
+from backend.app.models.user import UserCreate
 
 
 def init_db(db: Session) -> None:

backend/app/db/session.py

@@ -1,7 +1,7 @@
 
 from sqlalchemy.orm import sessionmaker
 
-from app.core.config import settings
+from backend.app.core.config import settings
 
 from sqlmodel import create_engine, SQLModel
 

backend/app/main.py

@@ -1,15 +1,13 @@
 import logging
 
-import uvicorn
 from fastapi import FastAPI
-from loguru import logger
 from starlette.middleware.cors import CORSMiddleware
 
-from app.api.api_v1.api import api_router
+from backend.app.api.api_v1.api import api_router
-from app.core.config import settings
+from backend.app.core.config import settings
-from app.db.init_db import init_db
+from backend.app.db.init_db import init_db
-from app.db.session import SessionLocal, create_db_and_tables
+from backend.app.db.session import SessionLocal, create_db_and_tables
-from app.utils import configure_log_handler
+from backend.app.utils import configure_log_handler
 
 db = SessionLocal()
 configure_log_handler(log_level=logging.DEBUG)

backend/app/models/__init__.py

@@ -1,6 +1,6 @@
-from app.models.matchday import Matchday, MatchdayWithPlayers
+from backend.app.models.matchday import Matchday, MatchdayWithPlayers
-from app.models.player import Player, PlayerTeamsMatchdays
+from backend.app.models.player import Player, PlayerTeamsMatchdays
-from app.models.team import Team, TeamWithPlayers
+from backend.app.models.team import Team, TeamWithPlayers
 
 
 Player.update_forward_refs(Team=Team, Matchday=Matchday)

backend/app/models/match.py

@@ -0,0 +1,30 @@
+from typing import Optional
+
+from sqlmodel import SQLModel, Field
+
+from backend.app.db.base_class import Base
+
+
+class MatchBase(SQLModel):
+    team_1_result: int | None
+    team_2_result: int | None
+
+
+class Match(MatchBase, Base, table=True):
+    team_1: Optional[int] = Field(default=None, foreign_key="team.id")
+    team_2: Optional[int] = Field(default=None, foreign_key="team.id")
+    winner: Optional[int] = Field(default=None, foreign_key="team.id")
+    day:  Optional[int] = Field(default=None, foreign_key="matchday.id")
+
+
+class MatchCreate(MatchBase):
+    team_1: Optional[int]
+    team_2: Optional[int]
+    winner: Optional[int]
+    day: Optional[int]
+
+class MatchUpdate(MatchBase):
+    team_1: Optional[int]
+    team_2: Optional[int]
+    winner: Optional[int]
+    day: Optional[int]

backend/app/models/matchday.py

@@ -1,14 +1,14 @@
-from datetime import date, datetime
+from datetime import date
 from typing import List, Optional, TYPE_CHECKING
 
 from sqlalchemy import Date
 from sqlmodel import SQLModel, Relationship, Field, Column,  func
 
-from app.db.base_class import Base
+from backend.app.db.base_class import Base
-from app.models.matchdayplayer import MatchdayPlayerLink
+from backend.app.models.matchdayplayer import MatchdayPlayerLink
 
 if TYPE_CHECKING:
-    from app.models.player import Player
+    from backend.app.models.player import Player
 
 
 class MatchdayBase(SQLModel):

backend/app/models/player.py

@@ -1,13 +1,13 @@
-from typing import Optional, List, TYPE_CHECKING
+from typing import List, TYPE_CHECKING
 
 from sqlmodel import SQLModel, Field, Relationship
-from app.db.base_class import Base
+from backend.app.db.base_class import Base
 
-from app.models.matchdayplayer import MatchdayPlayerLink
+from backend.app.models.matchdayplayer import MatchdayPlayerLink
-from app.models.teamplayers import TeamPlayerLink
+from backend.app.models.teamplayers import TeamPlayerLink
 
 if TYPE_CHECKING:
-    from app.models import Team, Matchday
+    from backend.app.models import Team, Matchday
 class PlayerBase(SQLModel):
     firstname: str = Field(nullable=False)
     lastname: str = Field(nullable=False)

backend/app/models/team.py

@@ -2,12 +2,12 @@ from typing import Optional, List, TYPE_CHECKING
 
 from sqlmodel import SQLModel, Field, Relationship
 
-from app.db.base_class import Base
+from backend.app.db.base_class import Base
 
-from app.models.teamplayers import TeamPlayerLink
+from backend.app.models.teamplayers import TeamPlayerLink
 
 if TYPE_CHECKING:
-    from app.models.player import Player
+    from backend.app.models.player import Player
 
 class TeamBase(SQLModel):
     teamname: Optional[str] = Field(nullable=False)

backend/app/models/user.py

@@ -2,7 +2,7 @@ from typing import Optional
 
 from pydantic import EmailStr
 from sqlmodel import SQLModel, Field
-from app.db.base_class import Base
+from backend.app.db.base_class import Base
 
 
 class UserBase(SQLModel):

backend/app/utils.py

@@ -1,4 +1,3 @@
-import logging
 from datetime import datetime, timedelta
 from pathlib import Path
 from typing import Any, Dict, Optional
@@ -7,7 +6,7 @@ import emails
 from emails.template import JinjaTemplate
 from jose import jwt
 
-from app.core.config import settings
+from backend.app.core.config import settings
 import sys
 import logging
 from loguru import logger

backend/debug_run.py

@@ -1,8 +1,6 @@
 import uvicorn
 from loguru import logger
 
-from app.main import app
-
 
 def main():
     uvicorn.run("debug_run:app", host="0.0.0.0", port=1234, reload=True)

backend/tests/test_floorball_stats.py

@@ -1,4 +1,4 @@
-from app import __version__
+from backend.app import __version__
 
 
 def test_version():

frontend/floorball/.gitignore

@@ -0,0 +1,23 @@
+.DS_Store
+node_modules
+/dist
+
+
+# local env files
+.env.local
+.env.*.local
+
+# Log files
+npm-debug.log*
+yarn-debug.log*
+yarn-error.log*
+pnpm-debug.log*
+
+# Editor directories and files
+.idea
+.vscode
+*.suo
+*.ntvs*
+*.njsproj
+*.sln
+*.sw?

frontend/floorball/README.md

@@ -0,0 +1,24 @@
+# floorball
+
+## Project setup
+```
+npm install
+```
+
+### Compiles and hot-reloads for development
+```
+npm run serve
+```
+
+### Compiles and minifies for production
+```
+npm run build
+```
+
+### Lints and fixes files
+```
+npm run lint
+```
+
+### Customize configuration
+See [Configuration Reference](https://cli.vuejs.org/config/).

frontend/floorball/babel.config.js

@@ -0,0 +1,5 @@
+module.exports = {
+  presets: [
+    '@vue/cli-plugin-babel/preset'
+  ]
+}

frontend/floorball/jsconfig.json

@@ -0,0 +1,19 @@
+{
+  "compilerOptions": {
+    "target": "es5",
+    "module": "esnext",
+    "baseUrl": "./",
+    "moduleResolution": "node",
+    "paths": {
+      "@/*": [
+        "src/*"
+      ]
+    },
+    "lib": [
+      "esnext",
+      "dom",
+      "dom.iterable",
+      "scripthost"
+    ]
+  }
+}

frontend/floorball/package.json

@@ -0,0 +1,45 @@
+{
+  "name": "floorball",
+  "version": "0.1.0",
+  "private": true,
+  "scripts": {
+    "serve": "vue-cli-service serve",
+    "build": "vue-cli-service build",
+    "lint": "vue-cli-service lint"
+  },
+  "dependencies": {
+    "core-js": "^3.8.3",
+    "vue": "^3.2.13",
+    "vue-router": "^4.0.3"
+  },
+  "devDependencies": {
+    "@babel/core": "^7.12.16",
+    "@babel/eslint-parser": "^7.12.16",
+    "@vue/cli-plugin-babel": "~5.0.0",
+    "@vue/cli-plugin-eslint": "~5.0.0",
+    "@vue/cli-plugin-router": "~5.0.0",
+    "@vue/cli-service": "~5.0.0",
+    "eslint": "^7.32.0",
+    "eslint-plugin-vue": "^8.0.3"
+  },
+  "eslintConfig": {
+    "root": true,
+    "env": {
+      "node": true
+    },
+    "extends": [
+      "plugin:vue/vue3-essential",
+      "eslint:recommended"
+    ],
+    "parserOptions": {
+      "parser": "@babel/eslint-parser"
+    },
+    "rules": {}
+  },
+  "browserslist": [
+    "> 1%",
+    "last 2 versions",
+    "not dead",
+    "not ie 11"
+  ]
+}

frontend/floorball/public/index.html

@@ -0,0 +1,17 @@
+<!DOCTYPE html>
+<html lang="">
+  <head>
+    <meta charset="utf-8">
+    <meta http-equiv="X-UA-Compatible" content="IE=edge">
+    <meta name="viewport" content="width=device-width,initial-scale=1.0">
+    <link rel="icon" href="<%= BASE_URL %>favicon.ico">
+    <title><%= htmlWebpackPlugin.options.title %></title>
+  </head>
+  <body>
+    <noscript>
+      <strong>We're sorry but <%= htmlWebpackPlugin.options.title %> doesn't work properly without JavaScript enabled. Please enable it to continue.</strong>
+    </noscript>
+    <div id="app"></div>
+    <!-- built files will be auto injected -->
+  </body>
+</html>

frontend/floorball/src/App.vue

@@ -0,0 +1,30 @@
+<template>
+  <nav>
+    <router-link to="/">Home</router-link> |
+    <router-link to="/about">About</router-link>
+  </nav>
+  <router-view/>
+</template>
+
+<style>
+#app {
+  font-family: Avenir, Helvetica, Arial, sans-serif;
+  -webkit-font-smoothing: antialiased;
+  -moz-osx-font-smoothing: grayscale;
+  text-align: center;
+  color: #2c3e50;
+}
+
+nav {
+  padding: 30px;
+}
+
+nav a {
+  font-weight: bold;
+  color: #2c3e50;
+}
+
+nav a.router-link-exact-active {
+  color: #42b983;
+}
+</style>

frontend/floorball/src/components/HelloWorld.vue

@@ -0,0 +1,58 @@
+<template>
+  <div class="hello">
+    <h1>{{ msg }}</h1>
+    <p>
+      For a guide and recipes on how to configure / customize this project,<br>
+      check out the
+      <a href="https://cli.vuejs.org" target="_blank" rel="noopener">vue-cli documentation</a>.
+    </p>
+    <h3>Installed CLI Plugins</h3>
+    <ul>
+      <li><a href="https://github.com/vuejs/vue-cli/tree/dev/packages/%40vue/cli-plugin-babel" target="_blank" rel="noopener">babel</a></li>
+      <li><a href="https://github.com/vuejs/vue-cli/tree/dev/packages/%40vue/cli-plugin-eslint" target="_blank" rel="noopener">eslint</a></li>
+    </ul>
+    <h3>Essential Links</h3>
+    <ul>
+      <li><a href="https://vuejs.org" target="_blank" rel="noopener">Core Docs</a></li>
+      <li><a href="https://forum.vuejs.org" target="_blank" rel="noopener">Forum</a></li>
+      <li><a href="https://chat.vuejs.org" target="_blank" rel="noopener">Community Chat</a></li>
+      <li><a href="https://twitter.com/vuejs" target="_blank" rel="noopener">Twitter</a></li>
+      <li><a href="https://news.vuejs.org" target="_blank" rel="noopener">News</a></li>
+    </ul>
+    <h3>Ecosystem</h3>
+    <ul>
+      <li><a href="https://router.vuejs.org" target="_blank" rel="noopener">vue-router</a></li>
+      <li><a href="https://vuex.vuejs.org" target="_blank" rel="noopener">vuex</a></li>
+      <li><a href="https://github.com/vuejs/vue-devtools#vue-devtools" target="_blank" rel="noopener">vue-devtools</a></li>
+      <li><a href="https://vue-loader.vuejs.org" target="_blank" rel="noopener">vue-loader</a></li>
+      <li><a href="https://github.com/vuejs/awesome-vue" target="_blank" rel="noopener">awesome-vue</a></li>
+    </ul>
+  </div>
+</template>
+
+<script>
+export default {
+  name: 'HelloWorld',
+  props: {
+    msg: String
+  }
+}
+</script>
+
+<!-- Add "scoped" attribute to limit CSS to this component only -->
+<style scoped>
+h3 {
+  margin: 40px 0 0;
+}
+ul {
+  list-style-type: none;
+  padding: 0;
+}
+li {
+  display: inline-block;
+  margin: 0 10px;
+}
+a {
+  color: #42b983;
+}
+</style>

frontend/floorball/src/main.js

@@ -0,0 +1,17 @@
+import 'bootstrap/dist/css/bootstrap.css';
+import axios from 'axios';
+import Vue from 'vue';
+
+import App from './App.vue';
+import router from './router';
+
+
+axios.defaults.withCredentials = true;
+axios.defaults.baseURL = 'http://localhost:5000/';  // the FastAPI backend
+
+Vue.config.productionTip = false;
+
+new Vue({
+  router,
+  render: h => h(App)
+}).$mount('#app');

frontend/floorball/src/router/index.js

@@ -0,0 +1,25 @@
+import { createRouter, createWebHistory } from 'vue-router'
+import HomeView from '../views/HomeView.vue'
+
+const routes = [
+  {
+    path: '/',
+    name: 'home',
+    component: HomeView
+  },
+  {
+    path: '/about',
+    name: 'about',
+    // route level code-splitting
+    // this generates a separate chunk (about.[hash].js) for this route
+    // which is lazy-loaded when the route is visited.
+    component: () => import(/* webpackChunkName: "about" */ '../views/AboutView.vue')
+  }
+]
+
+const router = createRouter({
+  history: createWebHistory(process.env.BASE_URL),
+  routes
+})
+
+export default router

frontend/floorball/src/views/AboutView.vue

@@ -0,0 +1,5 @@
+<template>
+  <div class="about">
+    <h1>This is an about page</h1>
+  </div>
+</template>

frontend/floorball/src/views/HomeView.vue

@@ -0,0 +1,18 @@
+<template>
+  <div class="home">
+    <img alt="Vue logo" src="../assets/logo.png">
+    <HelloWorld msg="Welcome to Your Vue.js App"/>
+  </div>
+</template>
+
+<script>
+// @ is an alias to /src
+import HelloWorld from '@/components/HelloWorld.vue'
+
+export default {
+  name: 'HomeView',
+  components: {
+    HelloWorld
+  }
+}
+</script>

frontend/floorball/vue.config.js

@@ -0,0 +1,4 @@
+const { defineConfig } = require('@vue/cli-service')
+module.exports = defineConfig({
+  transpileDependencies: true
+})