Add SQLite database to backend, interacting with the frontend
This commit is contained in:
1
.gitignore
vendored
1
.gitignore
vendored
@@ -31,3 +31,4 @@ coverage
|
||||
|
||||
# Build and package files/folders
|
||||
build
|
||||
*.sqlite
|
||||
@@ -1,3 +1,12 @@
|
||||
# HackMyCart
|
||||
|
||||
The most hackable Web Shop!
|
||||
|
||||
## Compile for production
|
||||
|
||||
TODO
|
||||
|
||||
## Internal structure
|
||||
|
||||
### Database
|
||||
|
||||
|
||||
156
misc/database.drawio
Normal file
156
misc/database.drawio
Normal 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="<blockquote style="margin: 0px 0px 0px 8px; border: none; padding: 0px;"><u>id:&nbsp;</u><u style="background-color: initial;">Number</u></blockquote>" 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="<blockquote style="margin: 0px; border: none; padding: 0px;"><b><u>Products</u></b></blockquote>" 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="<blockquote style="margin: 0px 0px 0px 8px; border: none; padding: 0px;">name: String</blockquote>" 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="<blockquote style="margin: 0px 0px 0px 8px; border: none; padding: 0px;">price: Number</blockquote>" 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="<blockquote style="margin: 0px 0px 0px 8px; border: none; padding: 0px;"><i>categoryId: Number</i></blockquote>" 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="<blockquote style="margin: 0px 0px 0px 8px; border: none; padding: 0px;">discount: Number</blockquote>" 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="<blockquote style="margin: 0px; border: none; padding: 0px;"><b><u>User</u></b></blockquote>" 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="<blockquote style="margin: 0px 0px 0px 8px; border: none; padding: 0px;"><u>id:&nbsp;</u><u style="background-color: initial;">Number</u></blockquote>" 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="<blockquote style="margin: 0px 0px 0px 8px; border: none; padding: 0px;">username: String</blockquote>" 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="<blockquote style="margin: 0px 0px 0px 8px; border: none; padding: 0px;">password: String</blockquote>" 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="<blockquote style="margin: 0px; border: none; padding: 0px;"><b><u>OrderedItem</u></b></blockquote>" 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="<blockquote style="margin: 0px 0px 0px 8px; border: none; padding: 0px;"><u>id:&nbsp;</u><u style="background-color: initial;">Number</u></blockquote>" 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="<blockquote style="margin: 0px 0px 0px 8px; border: none; padding: 0px;"><i>usernameId: Number</i></blockquote>" 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="<blockquote style="margin: 0px 0px 0px 8px; border: none; padding: 0px;">totalPrice: Number</blockquote>" 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="<blockquote style="margin: 0px; border: none; padding: 0px;"><b><u>Categories</u></b></blockquote>" 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="<blockquote style="margin: 0px 0px 0px 8px; border: none; padding: 0px;"><u>id:&nbsp;</u><u style="background-color: initial;">Number</u></blockquote>" 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="<blockquote style="margin: 0px 0px 0px 8px; border: none; padding: 0px;">name: String</blockquote>" 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="<blockquote style="margin: 0px 0px 0px 8px; border: none; padding: 0px;"><i>productId:&nbsp;</i><i style="background-color: initial;">Number</i></blockquote>" 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="<blockquote style="margin: 0px 0px 0px 8px; border: none; padding: 0px;">address: String</blockquote>" 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="<blockquote style="margin: 0px 0px 0px 8px; border: none; padding: 0px;">firstName: String</blockquote>" 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="<blockquote style="margin: 0px 0px 0px 8px; border: none; padding: 0px;">lastName: String</blockquote>" 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="<blockquote style="margin: 0px; border: none; padding: 0px;"><b><u>Order</u></b></blockquote>" 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="<blockquote style="margin: 0px 0px 0px 8px; border: none; padding: 0px;"><u>orderId: Number</u></blockquote>" 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="<blockquote style="margin: 0px 0px 0px 8px; border: none; padding: 0px;"><i>orderId:&nbsp;</i><i style="background-color: initial;">Number</i></blockquote>" 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="<blockquote style="margin: 0px 0px 0px 8px; border: none; padding: 0px;">totalPrice: Number</blockquote>" 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="<blockquote style="margin: 0px 0px 0px 8px; border: none; padding: 0px;">quantity: Number</blockquote>" 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
BIN
misc/images/database.png
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 71 KiB |
26
software/backend/database.ts
Normal file
26
software/backend/database.ts
Normal 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
7
software/backend/models/categories.model.ts
Normal 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
7
software/backend/routes/api.routes.ts
Normal 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
20
software/backend/routes/categories.routes.ts
Normal 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)
|
||||
}
|
||||
})
|
||||
@@ -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)
|
||||
}
|
||||
@@ -1,7 +1,9 @@
|
||||
import express from 'express'
|
||||
import cors from 'cors'
|
||||
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 port = 3000
|
||||
@@ -12,8 +14,12 @@ app.use(cors())
|
||||
// Process JSON parameter
|
||||
app.use(bodyParser.json())
|
||||
|
||||
// Use the app routes
|
||||
routes(app)
|
||||
// Create database and tables
|
||||
startDatabase()
|
||||
|
||||
// Routes
|
||||
app.use("/api", api)
|
||||
app.use("/categories", categories)
|
||||
|
||||
// Start server
|
||||
app.listen(port, () => {
|
||||
|
||||
1623
software/package-lock.json
generated
1623
software/package-lock.json
generated
File diff suppressed because it is too large
Load Diff
@@ -22,6 +22,10 @@
|
||||
"concurrently": "^8.2.2",
|
||||
"cors": "^2.8.5",
|
||||
"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",
|
||||
"vuetify": "^3.7.1",
|
||||
"wait-on": "^8.0.0"
|
||||
|
||||
@@ -3,14 +3,25 @@ import { ref } from 'vue';
|
||||
import axios from 'axios';
|
||||
|
||||
const showDrawer = ref(true)
|
||||
const testResponse = ref("")
|
||||
const apiCategories = ref([])
|
||||
const newCategory = ref("")
|
||||
|
||||
|
||||
axios.get('http://127.0.0.1:3000/api')
|
||||
function requestAllCategories() {
|
||||
axios.get('http://127.0.0.1:3000/categories')
|
||||
.then(function (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>
|
||||
|
||||
<template>
|
||||
@@ -26,7 +37,24 @@ axios.get('http://127.0.0.1:3000/api')
|
||||
</v-navigation-drawer>
|
||||
|
||||
<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 -->
|
||||
</v-main>
|
||||
</v-app>
|
||||
|
||||
@@ -6,6 +6,8 @@
|
||||
"isolatedModules": false,
|
||||
"outDir": "build/dist",
|
||||
"esModuleInterop": true,
|
||||
"experimentalDecorators": true,
|
||||
"emitDecoratorMetadata": true,
|
||||
"paths": {
|
||||
"@/*": ["./src/*"]
|
||||
}
|
||||
|
||||
Reference in New Issue
Block a user