FiveM UI template

FiveM UI Template


Hi there, I’ve just released an exciting ui template for all the developers to use! Feel free to download and use for free!

Github - Source code

:rocket: Features:


  • Typescript support
    • Write your code in typescript and get all the benefits of typescript
    • Declare all your types in the types folder for ease of debugging and import them anywhere with the alias @types
    • Use the @types alias to import your types from the index.d.ts file in the types folder
  • Esbuild support (for backend)
    • Use esbuild to bundle your code and get the benefits of tree shaking
    • Enjoy blazing fast build times
    • Hot reload support via pnpm watch
  • Tailwindcss support
    • Use tailwindcss to write your css
    • Get all the benefits of tailwindcss
  • ViteJS support (for frontend)
    • Use vitejs to serve your code and get the benefits of vitejs
    • Hot reload support via pnpm watch
    • Enjoy blazing fast build times
  • Static/public folder
    • Use the static or public folder to serve static files which will be copied to the build folder
    • Upload images, fonts, etc. to the public folder and use them in your code as such: '/image.png'
  • Monorepo setup
    • This project is setup as a monorepo fashion so you can just run pnpm -parallel build to build both the web and resource folder into the build directory
  • Plug and play
    • Easily add your own code to the project and run any of the scripts to compile your code:
      • pnpm build - Build the project
      • pnpm watch - Watch the project for changes and build on change
      • pnpm dev - Run the project in development mode on the browser (frontend only)
3 Likes

got some screenshots?

2 Likes

It’s a typescript / vue boilerplate. There isn’t anything to screenshot… lel??

It’s UI template…those two words, especially when combined, very much mean there’s something to screenshot.

Good job !

I mean, if you want screenshots of the code to handle message events, then sure. Or maybe a screenshot of a white page is what you want since there isn’t any actual html code in it. kekw

1 Like

You’ve said it for me! Dang it :frowning_face:

1 Like