StevenJW/YPS-Beer

History

Stedoss 284a36412d Initial commit		2023-12-07 00:20:59 +00:00
..
public	Initial commit	2023-12-07 00:20:59 +00:00
src	Initial commit	2023-12-07 00:20:59 +00:00
.browserslistrc	Initial commit	2023-12-07 00:20:59 +00:00
.editorconfig	Initial commit	2023-12-07 00:20:59 +00:00
.eslintrc.js	Initial commit	2023-12-07 00:20:59 +00:00
.gitignore	Initial commit	2023-12-07 00:20:59 +00:00
index.html	Initial commit	2023-12-07 00:20:59 +00:00
package-lock.json	Initial commit	2023-12-07 00:20:59 +00:00
package.json	Initial commit	2023-12-07 00:20:59 +00:00
README.md	Initial commit	2023-12-07 00:20:59 +00:00
tsconfig.json	Initial commit	2023-12-07 00:20:59 +00:00
tsconfig.node.json	Initial commit	2023-12-07 00:20:59 +00:00
vite.config.ts	Initial commit	2023-12-07 00:20:59 +00:00

README.md

YPM Beer (frontend)

A super-simple frontend for viewing and searching Beers from the PunkAPI.

Setup

Requirements

To run in development mode, you will need:

node (v20>=)

Installing dependencies

To install the node dependencies required, run:

npm i

Running locally

To run in development mode, run:

npm run dev

The application should be accessable at:

http://localhost:3000

Configuring

The app should already be configured to connect to the backend once it is running, but the URL can be modified at src/utils/configuration.ts.

Technology

To create this project, the following was used:

Node 20
Vite & Vitest
Vue3 (with composition API & TypeScript & VueRouter)
Vuetify for the UI framework
Vue-Query (Tanstack Query) for communicating with the backend.

To improve:

UI

The UI isn't the best at all, it's somewhat responsive but data display should be a lot better.

Testing

If I had more time, I would have loved to use Testing-Library to add some tests for the frontend.

Auth Handling

Right now, it uses very simple cookie auth - which can be a little hard to manage.