https://github.com/eidellev/adonis-stardust

https://github.com/eidellev/adonis-stardust

Last synced: about 2 months ago
JSON representation

• Host: GitHub
• URL: https://github.com/eidellev/adonis-stardust
• Owner: eidellev
• Created: 2021-08-18T20:17:50.000Z (about 3 years ago)
• Default Branch: main
• Last Pushed: 2023-08-04T17:03:47.000Z (about 1 year ago)
• Last Synced: 2024-07-20T19:09:45.913Z (2 months ago)
• Language: TypeScript
• Size: 1.99 MB
• Stars: 28
• Watchers: 2
• Forks: 5
• Open Issues: 3
• Metadata Files:
  • Readme: README.md

Awesome Lists containing this project

• awesome-adonisjs - AdonisJS Stardust - Access Adonis named routes in the client (inspired by Laravel's ziggy library) (Packages)

README

        
# Adonis Stardust

![](https://img.shields.io/npm/types/typescript?style=for-the-badge)





















# ⭐ Adonis Stardust ⭐

Use your adonis named stardust in the client.

## Installation

```shell

npm i @eidellev/adonis-stardust

node ace configure @eidellev/adonis-stardust

```

## Setup

### Register Middleware

Add the Stardust middleware to `start/kernel.ts`:

```typescript

Server.middleware.register([

  () => import('@ioc:Adonis/Core/BodyParser'),

  () => import('@ioc:EidelLev/Stardust/Middleware'),

]);

```

### Register a Named Route

Create a named route in your stardust file:

```typescript

Route.get('users/:id', () => {

  ...

}).as('users.show');

```

### In Your View

Add the `@routes` Edge tag to your main layout (before your application's JavaScript).

```blade

@routes

@entryPointStyles('app')

@entryPolintScripts('app')

```

## Client-Side Usage

### Client Setup

Stardust should be initialized as early as possible, e.g. in your application's entrypoint

```typescript

import { initRoutes } from '@eidellev/adonis-stardust/client';

initRoutes();

```

Now you can use the `stardust` helper to access your adonis routes:

```typescript

import { stardust } from '@eidellev/adonis-stardust/client';

stardust.route('users.show', { id: 1 }); // => `/users/1`

/**

 * You can also pass path params as an array and they will populated

 * according to their order:

 */

stardust.route('users.show', [1]); // => `/users/1`

```

You can also pass query parameters like so:

```typescript

stardust.route('tasks.index', undefined, { qs: { tags: ['work', 'personal'] } });

// `/tasks?tags=work,personal

```

### Checking the Current Route

```typescript

stardust.current; // => 'tasks.index'

stardust.isCurrent('tasks.index'); // => true

```