A starter kit using Laravel Fortify for authentication, PrimeVue & PrimeFlex for the UI, and Intertia.js as the glue. Intended to be an alternative to Laravel Breeze, providing the same UI design and functionality, but built with PrimeTek UI packages instead of Tailwind.
-
Clone the repo
git clone https://github.com/connorabbas/primevue-auth-starter.git
-
Step into the project directory
cd ./primevue-auth-starter
-
Install the framework and other packages
composer install
-
Setup
.env
fileWindows
copy .env.example .env
Unix/Linux/MacOS
cp .env.example .env
-
Generate the app key
php artisan key:generate
-
Migrate database tables (after
.env
and database related config setup)php artisan migrate
-
Install npm packages
npm install
-
Build assets (required to get theme files)
npm run build
-
Start the Vite dev server (if developing)
npm run dev
During the installation steps, you are required to run the Vite build process (npm run build
). The reason for running the build process locally is to gather the necessary theme files for the application, which are copied into the site's /public/themes
directory via the vite-plugin-static-copy plugin in the vite.config.js
file.
The alternative to this approach would be manually copying the theme folders from node_modules/primevue/resources/themes
into the public/themes
directory, and committing the folders/files to your repository source code. (Would require removing the .gitignore
rule as well)
Both the file copying process, and the light/dark theme toggle functionality rely on the LIGHT_THEME
and DARK_THEME
constant values defined in the /resources/js/Modules/constants.mjs
file.
To change what themes are used on the site for light and dark modes, simply modify the constant string values to any theme name that is available from PrimeVue's Built-in Themes. After changing the values to your desired themes, you will need to run the npm run build
command again, to copy the theme files for use.
The lara-light-indigo
and lara-dark-indigo
themes are used by default, since they most closely resemble the Laravel Breeze styling.