Overview:
Pronto Fuel is a heavily opinionated starter kit for Laravel and Inertia.js powered by Vite. It provides a comprehensive set of features and leverages the latest technologies and frameworks such as Inertia.js, Vue 3, Vite, Tailwind CSS, and Quasar Framework. The starter kit aims to streamline the development process by offering autoimporting features, code splitting, server-driven toast notifications, and more. It also includes preconfigured development environments like the VSCode Dev Container with all the necessary tools. Pronto Fuel is designed to enforce code quality through ESLint and StandardJS integration.
Features:
- Inertia.js: Pronto Fuel utilizes Inertia.js, which allows developers to build single-page applications using server-side routing and server-driven rendering.
- Vue 3: The starter kit leverages Vue 3, the latest version of the popular JavaScript framework, to enable the development of interactive and dynamic user interfaces.
- Vite: Pronto Fuel is powered by Vite, a fast build tool for Vue.js applications, offering rapid server hot-reloading and optimized production builds.
- <script setup> syntax for Vue: Pronto Fuel encourages the use of the new <script setup> syntax for Vue, providing a cleaner and more concise approach to writing component logic.
- Components auto importing: The starter kit facilitates component management by automatically importing common Vue and Inertia APIs, reducing boilerplate code.
- Pages Code Splitting: Pronto Fuel offers out-of-the-box code splitting functionality, allowing for more efficient loading of pages in the application.
- Server Driven toast notification system: Pronto Fuel includes a server-driven toast notification system with a queue in place, ensuring the display of relevant and timely notifications to users.
- Server Driven dialogs: The starter kit supports server-driven dialogs, enabling dynamic creation and display of dialogs based on server-side responses.
- Inline Inertia Persistent Layouts: Pronto Fuel integrates inline Inertia persistent layouts, allowing for consistent and easily maintainable layouts across pages.
- Tailwind CSS configured with common PostCSS plugins: The starter kit comes preconfigured with Tailwind CSS, a highly customizable CSS framework, and includes common PostCSS plugins like nesting and extend rule for enhanced styling capabilities.
- Quasar Framework configured with over 70 ready-to-use Material Design components: Pronto Fuel offers preconfigured integration with Quasar Framework, providing a wide range of ready-to-use Material Design components for faster and more efficient development.
- Use icons from any icon sets: Pronto Fuel allows developers to easily use icons from any icon sets without any compromise on design or flexibility.
- VSCode Dev Container with everything you need to start developing: The starter kit includes a VSCode Dev Container, providing a ready-to-use development environment with all the necessary tools and dependencies preconfigured.
- Debug with Ray on port 23517 by default: Pronto Fuel offers debugging capabilities with Ray, a debugging tool, by default on port 23517.
- Enforce code quality with ESLint and StandardJS: Pronto Fuel enforces code quality through integration with ESLint and StandardJS, helping developers write clean and consistent code.
Installation:
To install Pronto Fuel and get started, follow these steps:
- Clone the repository:
git clone <repository-url>
- Install the
npmdependencies:
npm install
- Start the development server:
npm run dev
- Access the application in your browser at
http://localhost:3000.
Summary:
Pronto Fuel is a highly opinionated starter kit for Laravel and Inertia.js that offers a wide range of features and preconfigured tools to streamline the development process. It leverages the latest technologies and frameworks, such as Inertia.js, Vue 3, Vite, Tailwind CSS, and Quasar Framework. With autoimporting features, code splitting, server-driven notifications and dialogs, and inline Inertia persistent layouts, Pronto Fuel aims to enhance productivity and code quality. The included VSCode Dev Container and integration with ESLint and StandardJS further simplify development and enforce code consistency.