tobias/eventmaster
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases 4 Wiki Activity

Add SQLite database to backend, interacting with the frontend

Browse Source
This commit is contained in:
Tobias Zoghaib
2024-09-04 16:42:37 +02:00
parent 8af11151d3
commit 7338bb216a
14 changed files with 1892 additions and 28 deletions
Download Patch File Download Diff File Expand all files Collapse all files

1
.gitignore vendored
View File

@@ -31,3 +31,4 @@ coverage
# Build and package files/folders # Build and package files/folders
build build
*.sqlite

9
README.md
View File

@@ -1,3 +1,12 @@
# HackMyCart # HackMyCart
The most hackable Web Shop! The most hackable Web Shop!
## Compile for production
TODO
## Internal structure
### Database
![database-erm](misc/images//database.png)

156
misc/database.drawio Normal file
View File

@@ -0,0 +1,156 @@
<mxfile host="Electron" modified="2024-09-04T09:39:26.183Z" agent="Mozilla/5.0 (X11; Linux x86_64) AppleWebKit/537.36 (KHTML, like Gecko) draw.io/24.6.4 Chrome/124.0.6367.207 Electron/30.0.6 Safari/537.36" etag="fozS5r_BxbeOsm9uWpcX" version="24.6.4" type="device">
<diagram name="Page-1" id="WevClHWmhzPAQ7FDN5po">
<mxGraphModel dx="1793" dy="1184" grid="1" gridSize="10" guides="1" tooltips="1" connect="1" arrows="1" fold="1" page="1" pageScale="1" pageWidth="1169" pageHeight="827" math="0" shadow="0">
<root>
<mxCell id="0" />
<mxCell id="1" parent="0" />
<mxCell id="-XxvrMC6G6SQ8Xm1xsTM-4" value="&lt;blockquote style=&quot;margin: 0px 0px 0px 8px; border: none; padding: 0px;&quot;&gt;&lt;u&gt;id:&amp;nbsp;&lt;/u&gt;&lt;u style=&quot;background-color: initial;&quot;&gt;Number&lt;/u&gt;&lt;/blockquote&gt;" style="rounded=0;whiteSpace=wrap;html=1;align=left;" parent="1" vertex="1">
<mxGeometry x="130.04000000000002" y="330" width="160" height="30" as="geometry" />
</mxCell>
<mxCell id="-XxvrMC6G6SQ8Xm1xsTM-5" value="&lt;blockquote style=&quot;margin: 0px; border: none; padding: 0px;&quot;&gt;&lt;b&gt;&lt;u&gt;Products&lt;/u&gt;&lt;/b&gt;&lt;/blockquote&gt;" style="rounded=0;whiteSpace=wrap;html=1;align=center;fillColor=#cce5ff;strokeColor=#36393d;" parent="1" vertex="1">
<mxGeometry x="130.04000000000002" y="300" width="160" height="30" as="geometry" />
</mxCell>
<mxCell id="-XxvrMC6G6SQ8Xm1xsTM-21" value="&lt;blockquote style=&quot;margin: 0px 0px 0px 8px; border: none; padding: 0px;&quot;&gt;name: String&lt;/blockquote&gt;" style="rounded=0;whiteSpace=wrap;html=1;align=left;" parent="1" vertex="1">
<mxGeometry x="130.04000000000002" y="360" width="160" height="30" as="geometry" />
</mxCell>
<mxCell id="-XxvrMC6G6SQ8Xm1xsTM-22" value="&lt;blockquote style=&quot;margin: 0px 0px 0px 8px; border: none; padding: 0px;&quot;&gt;price: Number&lt;/blockquote&gt;" style="rounded=0;whiteSpace=wrap;html=1;align=left;" parent="1" vertex="1">
<mxGeometry x="130.04000000000002" y="420" width="160" height="30" as="geometry" />
</mxCell>
<mxCell id="-XxvrMC6G6SQ8Xm1xsTM-23" value="&lt;blockquote style=&quot;margin: 0px 0px 0px 8px; border: none; padding: 0px;&quot;&gt;&lt;i&gt;categoryId: Number&lt;/i&gt;&lt;/blockquote&gt;" style="rounded=0;whiteSpace=wrap;html=1;align=left;" parent="1" vertex="1">
<mxGeometry x="130.04000000000002" y="390" width="160" height="30" as="geometry" />
</mxCell>
<mxCell id="-XxvrMC6G6SQ8Xm1xsTM-24" value="&lt;blockquote style=&quot;margin: 0px 0px 0px 8px; border: none; padding: 0px;&quot;&gt;discount: Number&lt;/blockquote&gt;" style="rounded=0;whiteSpace=wrap;html=1;align=left;" parent="1" vertex="1">
<mxGeometry x="130.04000000000002" y="450" width="160" height="30" as="geometry" />
</mxCell>
<mxCell id="xvubMpEdOjOFzFZ-NZdf-2" value="&lt;blockquote style=&quot;margin: 0px; border: none; padding: 0px;&quot;&gt;&lt;b&gt;&lt;u&gt;User&lt;/u&gt;&lt;/b&gt;&lt;/blockquote&gt;" style="rounded=0;whiteSpace=wrap;html=1;align=center;fillColor=#cce5ff;strokeColor=#36393d;" vertex="1" parent="1">
<mxGeometry x="949.9100000000001" y="300" width="160" height="30" as="geometry" />
</mxCell>
<mxCell id="xvubMpEdOjOFzFZ-NZdf-3" value="&lt;blockquote style=&quot;margin: 0px 0px 0px 8px; border: none; padding: 0px;&quot;&gt;&lt;u&gt;id:&amp;nbsp;&lt;/u&gt;&lt;u style=&quot;background-color: initial;&quot;&gt;Number&lt;/u&gt;&lt;/blockquote&gt;" style="rounded=0;whiteSpace=wrap;html=1;align=left;" vertex="1" parent="1">
<mxGeometry x="949.9100000000001" y="330" width="160" height="30" as="geometry" />
</mxCell>
<mxCell id="xvubMpEdOjOFzFZ-NZdf-4" value="&lt;blockquote style=&quot;margin: 0px 0px 0px 8px; border: none; padding: 0px;&quot;&gt;username: String&lt;/blockquote&gt;" style="rounded=0;whiteSpace=wrap;html=1;align=left;" vertex="1" parent="1">
<mxGeometry x="949.9100000000001" y="360" width="160" height="30" as="geometry" />
</mxCell>
<mxCell id="xvubMpEdOjOFzFZ-NZdf-5" value="&lt;blockquote style=&quot;margin: 0px 0px 0px 8px; border: none; padding: 0px;&quot;&gt;password: String&lt;/blockquote&gt;" style="rounded=0;whiteSpace=wrap;html=1;align=left;" vertex="1" parent="1">
<mxGeometry x="949.9100000000001" y="390" width="160" height="30" as="geometry" />
</mxCell>
<mxCell id="xvubMpEdOjOFzFZ-NZdf-6" value="&lt;blockquote style=&quot;margin: 0px; border: none; padding: 0px;&quot;&gt;&lt;b&gt;&lt;u&gt;OrderedItem&lt;/u&gt;&lt;/b&gt;&lt;/blockquote&gt;" style="rounded=0;whiteSpace=wrap;html=1;align=center;fillColor=#cce5ff;strokeColor=#36393d;" vertex="1" parent="1">
<mxGeometry x="419.91" y="240" width="160" height="30" as="geometry" />
</mxCell>
<mxCell id="xvubMpEdOjOFzFZ-NZdf-7" value="&lt;blockquote style=&quot;margin: 0px 0px 0px 8px; border: none; padding: 0px;&quot;&gt;&lt;u&gt;id:&amp;nbsp;&lt;/u&gt;&lt;u style=&quot;background-color: initial;&quot;&gt;Number&lt;/u&gt;&lt;/blockquote&gt;" style="rounded=0;whiteSpace=wrap;html=1;align=left;" vertex="1" parent="1">
<mxGeometry x="419.91" y="270" width="160" height="30" as="geometry" />
</mxCell>
<mxCell id="xvubMpEdOjOFzFZ-NZdf-8" value="&lt;blockquote style=&quot;margin: 0px 0px 0px 8px; border: none; padding: 0px;&quot;&gt;&lt;i&gt;usernameId: Number&lt;/i&gt;&lt;/blockquote&gt;" style="rounded=0;whiteSpace=wrap;html=1;align=left;" vertex="1" parent="1">
<mxGeometry x="689.9100000000001" y="330" width="160" height="30" as="geometry" />
</mxCell>
<mxCell id="xvubMpEdOjOFzFZ-NZdf-9" value="&lt;blockquote style=&quot;margin: 0px 0px 0px 8px; border: none; padding: 0px;&quot;&gt;totalPrice: Number&lt;/blockquote&gt;" style="rounded=0;whiteSpace=wrap;html=1;align=left;" vertex="1" parent="1">
<mxGeometry x="689.9100000000001" y="360" width="160" height="30" as="geometry" />
</mxCell>
<mxCell id="xvubMpEdOjOFzFZ-NZdf-17" value="&lt;blockquote style=&quot;margin: 0px; border: none; padding: 0px;&quot;&gt;&lt;b&gt;&lt;u&gt;Categories&lt;/u&gt;&lt;/b&gt;&lt;/blockquote&gt;" style="rounded=0;whiteSpace=wrap;html=1;align=center;fillColor=#cce5ff;strokeColor=#36393d;" vertex="1" parent="1">
<mxGeometry x="130.04000000000002" y="170" width="160" height="30" as="geometry" />
</mxCell>
<mxCell id="xvubMpEdOjOFzFZ-NZdf-18" value="&lt;blockquote style=&quot;margin: 0px 0px 0px 8px; border: none; padding: 0px;&quot;&gt;&lt;u&gt;id:&amp;nbsp;&lt;/u&gt;&lt;u style=&quot;background-color: initial;&quot;&gt;Number&lt;/u&gt;&lt;/blockquote&gt;" style="rounded=0;whiteSpace=wrap;html=1;align=left;" vertex="1" parent="1">
<mxGeometry x="130.04000000000002" y="200" width="160" height="30" as="geometry" />
</mxCell>
<mxCell id="xvubMpEdOjOFzFZ-NZdf-19" value="&lt;blockquote style=&quot;margin: 0px 0px 0px 8px; border: none; padding: 0px;&quot;&gt;name: String&lt;/blockquote&gt;" style="rounded=0;whiteSpace=wrap;html=1;align=left;" vertex="1" parent="1">
<mxGeometry x="130.04000000000002" y="230" width="160" height="30" as="geometry" />
</mxCell>
<mxCell id="xvubMpEdOjOFzFZ-NZdf-20" value="" style="endArrow=open;endSize=12;startArrow=diamondThin;startSize=14;startFill=0;edgeStyle=orthogonalEdgeStyle;entryX=0;entryY=0.5;entryDx=0;entryDy=0;exitX=0;exitY=0.5;exitDx=0;exitDy=0;" edge="1" parent="1" source="xvubMpEdOjOFzFZ-NZdf-18" target="-XxvrMC6G6SQ8Xm1xsTM-23">
<mxGeometry x="389.35999999999996" y="350" as="geometry">
<mxPoint x="450.04" y="519.9999999999998" as="sourcePoint" />
<mxPoint x="330.04" y="639.9999999999998" as="targetPoint" />
<Array as="points">
<mxPoint x="90.04000000000002" y="215" />
<mxPoint x="90.04000000000002" y="405" />
</Array>
</mxGeometry>
</mxCell>
<mxCell id="xvubMpEdOjOFzFZ-NZdf-21" value="0..n" style="resizable=0;align=left;verticalAlign=top;labelBackgroundColor=#ffffff;fontSize=10;strokeColor=#003366;shadow=1;fillColor=#D4E1F5;fontColor=#003366" connectable="0" vertex="1" parent="xvubMpEdOjOFzFZ-NZdf-20">
<mxGeometry x="-1" relative="1" as="geometry">
<mxPoint x="-30" y="-35" as="offset" />
</mxGeometry>
</mxCell>
<mxCell id="xvubMpEdOjOFzFZ-NZdf-22" value="1" style="resizable=0;align=right;verticalAlign=top;labelBackgroundColor=#ffffff;fontSize=10;strokeColor=#003366;shadow=1;fillColor=#D4E1F5;fontColor=#003366" connectable="0" vertex="1" parent="xvubMpEdOjOFzFZ-NZdf-20">
<mxGeometry x="1" relative="1" as="geometry">
<mxPoint x="-10" y="-35" as="offset" />
</mxGeometry>
</mxCell>
<mxCell id="xvubMpEdOjOFzFZ-NZdf-23" value="&lt;blockquote style=&quot;margin: 0px 0px 0px 8px; border: none; padding: 0px;&quot;&gt;&lt;i&gt;productId:&amp;nbsp;&lt;/i&gt;&lt;i style=&quot;background-color: initial;&quot;&gt;Number&lt;/i&gt;&lt;/blockquote&gt;" style="rounded=0;whiteSpace=wrap;html=1;align=left;" vertex="1" parent="1">
<mxGeometry x="419.91" y="330" width="160" height="30" as="geometry" />
</mxCell>
<mxCell id="xvubMpEdOjOFzFZ-NZdf-24" value="" style="endArrow=open;endSize=12;startArrow=diamondThin;startSize=14;startFill=0;edgeStyle=orthogonalEdgeStyle;entryX=0;entryY=0.5;entryDx=0;entryDy=0;exitX=1;exitY=0.5;exitDx=0;exitDy=0;" edge="1" parent="1" source="xvubMpEdOjOFzFZ-NZdf-8" target="xvubMpEdOjOFzFZ-NZdf-3">
<mxGeometry x="389.35999999999996" y="350" as="geometry">
<mxPoint x="828.9100000000001" y="489.9999999999998" as="sourcePoint" />
<mxPoint x="708.9100000000001" y="609.9999999999998" as="targetPoint" />
</mxGeometry>
</mxCell>
<mxCell id="xvubMpEdOjOFzFZ-NZdf-25" value="0..n" style="resizable=0;align=left;verticalAlign=top;labelBackgroundColor=#ffffff;fontSize=10;strokeColor=#003366;shadow=1;fillColor=#D4E1F5;fontColor=#003366" connectable="0" vertex="1" parent="xvubMpEdOjOFzFZ-NZdf-24">
<mxGeometry x="-1" relative="1" as="geometry">
<mxPoint y="-25" as="offset" />
</mxGeometry>
</mxCell>
<mxCell id="xvubMpEdOjOFzFZ-NZdf-26" value="1" style="resizable=0;align=right;verticalAlign=top;labelBackgroundColor=#ffffff;fontSize=10;strokeColor=#003366;shadow=1;fillColor=#D4E1F5;fontColor=#003366" connectable="0" vertex="1" parent="xvubMpEdOjOFzFZ-NZdf-24">
<mxGeometry x="1" relative="1" as="geometry">
<mxPoint x="-9" y="-35" as="offset" />
</mxGeometry>
</mxCell>
<mxCell id="xvubMpEdOjOFzFZ-NZdf-27" value="" style="endArrow=open;endSize=12;startArrow=diamondThin;startSize=14;startFill=0;edgeStyle=orthogonalEdgeStyle;entryX=1;entryY=0.5;entryDx=0;entryDy=0;exitX=0;exitY=0.5;exitDx=0;exitDy=0;" edge="1" parent="1" source="xvubMpEdOjOFzFZ-NZdf-23" target="-XxvrMC6G6SQ8Xm1xsTM-4">
<mxGeometry x="389.35999999999996" y="350" as="geometry">
<mxPoint x="309.91" y="414.44" as="sourcePoint" />
<mxPoint x="438.91" y="414.44" as="targetPoint" />
</mxGeometry>
</mxCell>
<mxCell id="xvubMpEdOjOFzFZ-NZdf-28" value="1" style="resizable=0;align=left;verticalAlign=top;labelBackgroundColor=#ffffff;fontSize=10;strokeColor=#003366;shadow=1;fillColor=#D4E1F5;fontColor=#003366" connectable="0" vertex="1" parent="xvubMpEdOjOFzFZ-NZdf-27">
<mxGeometry x="-1" relative="1" as="geometry">
<mxPoint x="-30" y="-35" as="offset" />
</mxGeometry>
</mxCell>
<mxCell id="xvubMpEdOjOFzFZ-NZdf-29" value="1" style="resizable=0;align=right;verticalAlign=top;labelBackgroundColor=#ffffff;fontSize=10;strokeColor=#003366;shadow=1;fillColor=#D4E1F5;fontColor=#003366" connectable="0" vertex="1" parent="xvubMpEdOjOFzFZ-NZdf-27">
<mxGeometry x="1" relative="1" as="geometry">
<mxPoint x="20" y="-35" as="offset" />
</mxGeometry>
</mxCell>
<mxCell id="xvubMpEdOjOFzFZ-NZdf-36" value="&lt;blockquote style=&quot;margin: 0px 0px 0px 8px; border: none; padding: 0px;&quot;&gt;address: String&lt;/blockquote&gt;" style="rounded=0;whiteSpace=wrap;html=1;align=left;" vertex="1" parent="1">
<mxGeometry x="949.9100000000001" y="420" width="160" height="30" as="geometry" />
</mxCell>
<mxCell id="xvubMpEdOjOFzFZ-NZdf-37" value="&lt;blockquote style=&quot;margin: 0px 0px 0px 8px; border: none; padding: 0px;&quot;&gt;firstName: String&lt;/blockquote&gt;" style="rounded=0;whiteSpace=wrap;html=1;align=left;" vertex="1" parent="1">
<mxGeometry x="949.9100000000001" y="450" width="160" height="30" as="geometry" />
</mxCell>
<mxCell id="xvubMpEdOjOFzFZ-NZdf-38" value="&lt;blockquote style=&quot;margin: 0px 0px 0px 8px; border: none; padding: 0px;&quot;&gt;lastName: String&lt;/blockquote&gt;" style="rounded=0;whiteSpace=wrap;html=1;align=left;" vertex="1" parent="1">
<mxGeometry x="949.9100000000001" y="480" width="160" height="30" as="geometry" />
</mxCell>
<mxCell id="xvubMpEdOjOFzFZ-NZdf-40" value="&lt;blockquote style=&quot;margin: 0px; border: none; padding: 0px;&quot;&gt;&lt;b&gt;&lt;u&gt;Order&lt;/u&gt;&lt;/b&gt;&lt;/blockquote&gt;" style="rounded=0;whiteSpace=wrap;html=1;align=center;fillColor=#cce5ff;strokeColor=#36393d;" vertex="1" parent="1">
<mxGeometry x="689.9100000000001" y="270" width="160" height="30" as="geometry" />
</mxCell>
<mxCell id="xvubMpEdOjOFzFZ-NZdf-41" value="&lt;blockquote style=&quot;margin: 0px 0px 0px 8px; border: none; padding: 0px;&quot;&gt;&lt;u&gt;orderId: Number&lt;/u&gt;&lt;/blockquote&gt;" style="rounded=0;whiteSpace=wrap;html=1;align=left;" vertex="1" parent="1">
<mxGeometry x="689.9100000000001" y="300" width="160" height="30" as="geometry" />
</mxCell>
<mxCell id="xvubMpEdOjOFzFZ-NZdf-42" value="&lt;blockquote style=&quot;margin: 0px 0px 0px 8px; border: none; padding: 0px;&quot;&gt;&lt;i&gt;orderId:&amp;nbsp;&lt;/i&gt;&lt;i style=&quot;background-color: initial;&quot;&gt;Number&lt;/i&gt;&lt;/blockquote&gt;" style="rounded=0;whiteSpace=wrap;html=1;align=left;" vertex="1" parent="1">
<mxGeometry x="419.91" y="300" width="160" height="30" as="geometry" />
</mxCell>
<mxCell id="xvubMpEdOjOFzFZ-NZdf-43" value="" style="endArrow=open;endSize=12;startArrow=diamondThin;startSize=14;startFill=0;edgeStyle=orthogonalEdgeStyle;entryX=0;entryY=0.5;entryDx=0;entryDy=0;exitX=1;exitY=0.5;exitDx=0;exitDy=0;" edge="1" parent="1" source="xvubMpEdOjOFzFZ-NZdf-42" target="xvubMpEdOjOFzFZ-NZdf-41">
<mxGeometry x="389.35999999999996" y="350" as="geometry">
<mxPoint x="629.9100000000001" y="390" as="sourcePoint" />
<mxPoint x="729.9100000000001" y="390" as="targetPoint" />
</mxGeometry>
</mxCell>
<mxCell id="xvubMpEdOjOFzFZ-NZdf-44" value="0..n" style="resizable=0;align=left;verticalAlign=top;labelBackgroundColor=#ffffff;fontSize=10;strokeColor=#003366;shadow=1;fillColor=#D4E1F5;fontColor=#003366" connectable="0" vertex="1" parent="xvubMpEdOjOFzFZ-NZdf-43">
<mxGeometry x="-1" relative="1" as="geometry">
<mxPoint y="-25" as="offset" />
</mxGeometry>
</mxCell>
<mxCell id="xvubMpEdOjOFzFZ-NZdf-45" value="1" style="resizable=0;align=right;verticalAlign=top;labelBackgroundColor=#ffffff;fontSize=10;strokeColor=#003366;shadow=1;fillColor=#D4E1F5;fontColor=#003366" connectable="0" vertex="1" parent="xvubMpEdOjOFzFZ-NZdf-43">
<mxGeometry x="1" relative="1" as="geometry">
<mxPoint x="-9" y="-35" as="offset" />
</mxGeometry>
</mxCell>
<mxCell id="xvubMpEdOjOFzFZ-NZdf-46" value="&lt;blockquote style=&quot;margin: 0px 0px 0px 8px; border: none; padding: 0px;&quot;&gt;totalPrice: Number&lt;/blockquote&gt;" style="rounded=0;whiteSpace=wrap;html=1;align=left;" vertex="1" parent="1">
<mxGeometry x="419.91" y="390" width="160" height="30" as="geometry" />
</mxCell>
<mxCell id="xvubMpEdOjOFzFZ-NZdf-47" value="&lt;blockquote style=&quot;margin: 0px 0px 0px 8px; border: none; padding: 0px;&quot;&gt;quantity: Number&lt;/blockquote&gt;" style="rounded=0;whiteSpace=wrap;html=1;align=left;" vertex="1" parent="1">
<mxGeometry x="419.91" y="360" width="160" height="30" as="geometry" />
</mxCell>
</root>
</mxGraphModel>
</diagram>
</mxfile>

BIN
misc/images/database.png Normal file
View File

Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 71 KiB

26
software/backend/database.ts Normal file
View File

@@ -0,0 +1,26 @@
import { Sequelize } from "sequelize-typescript"
// Models
import { Categories } from "./models/categories.model"
const dbName = "database"
const dbUser = "root"
const dbPassword = "123456"
// Definition of the database
export const sequelize = new Sequelize({
database: dbName,
dialect: "sqlite",
username: dbUser,
password: dbPassword,
storage: "database.sqlite",
models: [ Categories ]
})
export function startDatabase() {
// Create database and tables
sequelize.sync({ force: false })
.then(() => {
console.log(`Database & tables created!`)
})
}

7
software/backend/models/categories.model.ts Normal file
View File

@@ -0,0 +1,7 @@
import { Table, Column, Model, PrimaryKey, AutoIncrement } from 'sequelize-typescript';
@Table
export class Categories extends Model {
@Column
name: string
}

7
software/backend/routes/api.routes.ts Normal file
View File

@@ -0,0 +1,7 @@
import { Request, Response, NextFunction, Router } from 'express'
export const api = Router()
api.get("/", (req: Request, res: Response, next: NextFunction) => {
res.send("Hello World!")
})

20
software/backend/routes/categories.routes.ts Normal file
View File

@@ -0,0 +1,20 @@
import { Router, Request, Response, NextFunction } from "express";
import { Categories } from "../models/categories.model";
export const categories = Router()
categories.get("/", (req: Request, res: Response, next: NextFunction) => {
Categories.findAll()
.then(categories => res.json(categories))
.catch(next)
})
categories.post("/", (req: Request, res: Response, next: NextFunction) => {
try {
console.log(req.body)
const category = Categories.create(req.body)
res.status(201).json(category)
} catch (e) {
next(e)
}
})

11
software/backend/routes/routes.ts
View File

@@ -1,11 +0,0 @@
import express, { Request, Response, NextFunction } from 'express'
export const routes = app => {
var router = express.Router()
router.get("/", (req: Request, res: Response, next: NextFunction) => {
res.send("Hello World from the backend!")
})
app.use("/api/", router)
}

12
software/backend/server.ts
View File

@@ -1,7 +1,9 @@
import express from 'express' import express from 'express'
import cors from 'cors' import cors from 'cors'
import bodyParser from 'body-parser' import bodyParser from 'body-parser'
import { routes } from './routes/routes' import { api } from './routes/api.routes'
import { categories } from './routes/categories.routes'
import { startDatabase } from './database'
const app = express() const app = express()
const port = 3000 const port = 3000
@@ -12,8 +14,12 @@ app.use(cors())
// Process JSON parameter // Process JSON parameter
app.use(bodyParser.json()) app.use(bodyParser.json())
// Use the app routes // Create database and tables
routes(app) startDatabase()
// Routes
app.use("/api", api)
app.use("/categories", categories)
// Start server // Start server
app.listen(port, () => { app.listen(port, () => {

1623
software/package-lock.json generated
View File

File diff suppressed because it is too large Load Diff

4
software/package.json
View File

@@ -22,6 +22,10 @@
"concurrently": "^8.2.2", "concurrently": "^8.2.2",
"cors": "^2.8.5", "cors": "^2.8.5",
"express": "^4.19.2", "express": "^4.19.2",
"reflect-metadata": "^0.2.2",
"sequelize": "^6.37.3",
"sequelize-typescript": "^2.1.6",
"sqlite3": "^5.1.7",
"vue": "^3.4.29", "vue": "^3.4.29",
"vuetify": "^3.7.1", "vuetify": "^3.7.1",
"wait-on": "^8.0.0" "wait-on": "^8.0.0"

38
software/src/App.vue
View File

@@ -3,14 +3,25 @@ import { ref } from 'vue';
import axios from 'axios'; import axios from 'axios';
const showDrawer = ref(true) const showDrawer = ref(true)
const testResponse = ref("") const apiCategories = ref([])
const newCategory = ref("")
function requestAllCategories() {
axios.get('http://127.0.0.1:3000/api') axios.get('http://127.0.0.1:3000/categories')
.then(function (response) { .then(function (response) {
console.log(response) console.log(response)
testResponse.value = response.data apiCategories.value = response.data
}) })
}
function addCategory() {
axios.post("http://127.0.0.1:3000/categories", {
name: newCategory.value
})
.then(requestAllCategories)
}
requestAllCategories()
</script> </script>
<template> <template>
@@ -26,7 +37,24 @@ axios.get('http://127.0.0.1:3000/api')
</v-navigation-drawer> </v-navigation-drawer>
<v-main> <v-main>
{{ testResponse }} <v-container>
<v-row>
<v-col>
<v-text-field label="Category name" v-model="newCategory" />
</v-col>
<v-col>
<v-btn @click="addCategory" >Hinzufügen</v-btn>
</v-col>
</v-row>
<v-row>
<v-list>
<v-list-item v-for="category in apiCategories">
{{ category.name }}
</v-list-item>
</v-list>
</v-row>
</v-container>
<!-- todo --> <!-- todo -->
</v-main> </v-main>
</v-app> </v-app>

2
software/tsconfig.json
View File

@@ -6,6 +6,8 @@
"isolatedModules": false, "isolatedModules": false,
"outDir": "build/dist", "outDir": "build/dist",
"esModuleInterop": true, "esModuleInterop": true,
"experimentalDecorators": true,
"emitDecoratorMetadata": true,
"paths": { "paths": {
"@/*": ["./src/*"] "@/*": ["./src/*"]
} }