Api Platform conference
Register now
v3.3 Quasar Framework Generator
API Platform Conference
September 19-20, 2024 | Lille & online

The international conference on the API Platform Framework

Get ready for game-changing announcements for the PHP community!

The API Platform Conference 2024 is happening soon, and it's close to selling out.
API Platform 4, Caddy web server, Xdebug, AI... Enjoy two days of inspiring talks with our friendly community and our amazing speakers.

Only a few tickets left!

# Quasar Framework Generator

Create a Quasar Framework application using Quasar CLI:

npm i -g @quasar/cli
npm init quasar
cd my-app

It will ask you some questions, you can use these answers:

What would you like to build ? App with Quasar CLI, let's go!
Project folder: my-app
Pick Quasar version: Quasar v2 (Vue 3 | latest and greatest)
Pick script types: Typescript
Pick Quasar App CLI variant: Quasar App CLI with Vite
Package name: my-app
Pick a Vue component style: Composition API with <script setup>
Check the features needed for your project: ESLint / State Management (Pinia) / Vue-i18n
Pick an ESLint Preset: Prettier

Install the required dependencies:

npm install dayjs qs @types/qs

In the app directory, generate the files for the resource you want:

npm init @api-platform/client https://demo.api-platform.com src/ -- --generator quasar --resource foo

Replace the URL by the entrypoint of your Hydra-enabled API. You can also use an OpenAPI documentation with https://demo.api-platform.com/docs.jsonopenapi and -f openapi3.

Omit the resource flag to generate files for all resource types exposed by the API.

Note: Make sure to follow the result indications of the command to register the routes and the translations.

Import common translations:

// src/i18n/en-US/index.ts
import common from './common';

export default {
  // ...
  ...common,
}

Finally, make sure to update the config:

// quasar.conf.js
framework: {
  plugins: ['Notify'],
  config: {
    // ...
    notify: {
      position: 'top',
      multiLine: true,
      timeout: 0,
    },
  },

You can launch the server with:

quasar dev

Go to http://localhost:9000/books/ to start using your app.

Note: In order to Mercure to work with the demo, you have to use the port 3000.

You can also help us improve the documentation of this page.

Made with love by

Les-Tilleuls.coop can help you design and develop your APIs and web projects, and train your teams in API Platform, Symfony, Next.js, Kubernetes and a wide range of other technologies.

Learn more

Copyright © 2023 Kévin Dunglas

Sponsored by Les-Tilleuls.coop