https://github.com/fumeapp/nova-sample
sample repo for nova integration
https://github.com/fumeapp/nova-sample
Last synced: 8 months ago
JSON representation
sample repo for nova integration
- Host: GitHub
- URL: https://github.com/fumeapp/nova-sample
- Owner: fumeapp
- Created: 2022-12-30T06:48:52.000Z (almost 3 years ago)
- Default Branch: main
- Last Pushed: 2022-12-30T06:52:25.000Z (almost 3 years ago)
- Last Synced: 2025-01-14T03:16:53.978Z (9 months ago)
- Language: PHP
- Size: 2.77 MB
- Stars: 0
- Watchers: 1
- Forks: 0
- Open Issues: 1
-
Metadata Files:
- Readme: readme.md
Awesome Lists containing this project
README
## Laravel + Nuxt.js Boilerplate
> Now supporting [Nuxt v3](https://nuxt.com)
[](https://nuxt.com)
[](https://laravel.com)
[](https://madewithlaravel.com/p/laranuxt/shield-link)
[](https://github.com/fumeapp/laranuxt/actions/workflows/lint-js.yml)
[](https://github.com/fumeapp/laranuxt/actions/workflows/lint-php.yml)
> Examples on using Dark Mode, authentication, and listing data
### What is included
* [NUXT v3](https://nuxt.com) front end, a progressive Vue.js framework - For Nuxt v2 visit [this branch](https://github.com/fumeapp/laranuxt/tree/nuxt2)
* [tailvue](https://github.com/fumeapp/tailvue) a collection of components built for Nuxt.js, powered by WindiCSS|TailwindCSS
* [Authentication library](https://github.com/fumeapp/laranuxt#api-and-authentication) to assist with user sessions and logging in/out
* Example Authentication Middleware
* [Laravel](https://laravel.com) - for our API - `v9.40.0`
* [Model Typer](https://github.com/fumeapp/modeltyper) - Generates Typescript interfaces from Laravel Models
* [MetAPI](https://github.com/fumeapp/metapi) - API helpers and utilities
* [humble](https://github.com/fumeapp/humble) - Passwordless sessioning with detailed device and location
* [debugbar](https://github.com/barryvdh/laravel-debugbar) - awesome debugbar for our API
* [ide-helper](https://github.com/barryvdh/laravel-ide-helper) - Helper files to enable help with IDE autocompletion
### Installation
* clone from GitHub
* run `yarn` and `composer install` to install all of your deps
* copy `.env.example` to `.env` and configure it to your likings
* TL;DR
```bash
git clone git@github.com:fumeapp/laranuxt.git; cd laranuxt; yarn; composer install; cp .env.example .env;
```
* Feel free to delete excess media in `/resources/`
### Local Environment
* run `yarn dev` in one terminal for our nuxt dev setup
* run `yarn api` (alias for `./artisan serve`) in another terminal for our laravel API
### Api and Authentication
* Api and auth can be accessed via the provided `$api` library
```ts
const { $api } = useNuxtApp()
console.log($api.$user.name);
```
#### Authentication
* Take a look at [HeaderLoginModal.vue](https://github.com/fumeapp/laranuxt/blob/main/client/components/header/HeaderLoginModal.vue#L143) to see how we pass the credentials to our library
```ts
const redirect = await $api.login(result)
if (redirect) await router.push({path: redirect})
```
* Once logged on, you have the boolean `$api.loggedIn` and the object `$api.$user`
```html
![User Avatar]()
```
#### API
The API class provides helper functions to easily retrieve, update, and remove data from your Laravel endpoints. If you use and update [modeltyper](https://github.com/fumeapp/modeltyper) regularly you will always have completely typed results
* To get a listing/index of data, use `$api.index`
```ts
const users = $api.index('/user', { page: 1 })
```
* To get an individual by id, use `$api.get`
```ts
const users = $api.get('/user/1')
```
* To update with an id, use `$api.put`
```ts
const result = $api.put('/user/1', user)
```
* To store a new record, use `$api.store`
```ts
const result = $api.store('/user', { name: 'Bob', email: 'bob@mail.com' })
```
* To delete with an id, use `$api.delete`
```ts
const result = $api.delete('/user/1')
```