[TF2] Custom Backpack Viewer

• This project is developed with the Bun Runtime
• This README is intended to document everything in the project including it's aim, implementation, important details and design visions.

Source Layout:

• /src/app/ - Root project structure.
• /app/api/auth/[...nextauth]/route.tsx - NextAuth Steam Provider initialization.
• /app/components - All components related to displaying the app.
• /app/components/client - All client side components.
• /app/users/page.tsx - Demo fetching page

Dependencies

External

• MariaDB/MySQL Database

Node Modules

• next-auth
• next-auth-steam
• steamidconvert
• Prisma

Setup

MariaDB (Required)

• Setup a MariaDB / MySQL server.
• Create a database with a name of your choice.
• Create a user & password with privileges to the new database.
• Fill the connection details laid out in your .env file.

Project

• Install bun-runtime
• Clone repository at your preferred directory
• Enter bun install in the top-level project directory.
• Copy .env.example to .env and fill as required.
• Enter prisma generate && prisma migrate dev to ensure prisma establishes a connection to the MySQL server & automatically inputs the schema from the project.
• Enter bun run dev to start the project & navigate to https://localhost:3000 or the URL set in your .env file.

Preview

Logged Out

Logged In

Class Preview

Gameserver Manager Preview

Custom Weapon Manager Preview