A simple crud Web App built with Vue 3 and Laravel 8 to complete the BingHR Assesment.
I used Vue for the frondend instead of the required jQuery because of its data driven approach to reactivity like other mordern Javascript Frameworks. This reduces the need for hunting(traversing) and mainpuating the DOM to acheive interativity.
I 've also opted to expose the backend via a Restful API as this decouples the backend from the frontend and allows easier intergration of other User interfaces such mobile apps, IOT devices and other applicable devices.
The main entity is the app is Users
The web app allows you to:
- Add Users
- Update Users
- Delete Users
- Assign roles(Job titles) to users
- Assign Permissions to users. (Permissions also have variabe actions they can perform (like privileges)
- Clone the project by running
git clone git@github.com:seewhy17/BingHR.gitorgit clone https://github.com/seewhy17/BingHR.gitfrom your CLI of choice. - Run
cd BingHRto change into the project's directory - Run
composer installto install all php dependencies - create an
.envenvironment file file at the root directory and copy the contents of.env.exampleinto it, alternatively you can runcp .env.example .envfrom the CLI - change all DB_~ configurations in the newly created .env file to the required values for your machine
- Create a database with the value of the
DB_DATABASEenvironment variable as the database name. - Run
php artisan migrate:fresh --seedin you CLI to seed the database with sample users, roles and permissions - (Optional) Use
BingHRdirectory as the DocumentRoot of the virtual host (http://binghr.test) if you setup Virtual Hosts - Run
npm installto intall all javascript dependencies. - Run
php artisan key:generateto generate an encryption key for the application - Run
npm run devto compile all frontend assets. - run
php artisan serveto start the application.
- The hamburger(menu) icon on the bottom-left expands or collapses the menu
- The permission rights at the bottom of each modal are submitted as soon as the checkboxes are checked or unchecked, the submit button submits the form above it.
- The permissions and associated privilages are also global (permission privilages are shared across all users with the same permission).