Comprehensive SaaS Multi Layouts Template: Built with Laravel, React, Inertia
This template provides a solid foundation for building a SaaS multi layouts application, combining powerful and modern technologies like Laravel, React, TypeScript, Inertia, Vite, Tailwind CSS, and Stripe. Whether you're starting a new project or enhancing an existing one, this template is designed to streamline your development process and help you create a robust, scalable, and user-friendly SaaS platform.
Features
-
Laravel: Robust backend framework with powerful tools and MVC architecture.
-
React & TypeScript: Modern frontend library with static type checking.
-
Inertia: using classic server-side routing. Works with any backend.
-
Vite: Fast build tool for modern web projects.
-
Vitest: A blazing-fast unit testing framework with a Jest-compatible API, built for Vite.
-
Jest: Jest is a delightful JavaScript Testing Framework with a focus on simplicity.
-
Tailwind CSS: Utility-first CSS framework for rapid UI development.
-
Sass: the most mature, stable, and powerful professional grade CSS extension language in the world.
-
material-tailwind: Material Tailwind is a free and open-source components library for ReactJS and Tailwind CSS inspired by Material Design.
-
Laravel Modules: is a Laravel package which was created to manage your large Laravel app using modules.
-
Spatie Permissions: is a Laravel package which was created to manage user permissions and roles.
-
react-icons: which utilizes ES6 imports that allows you to include only the icons that your project is using.
-
prettier: Prettier is an opinionated code formatter.
-
ApexCharts: ApexCharts is a modern charting library that helps developers to create beautiful and interactive visualizations for web pages.formatter.
Getting Started
Prerequisites
Installation
- Clone the repository:
git clone https://github.com/ds-joe/saas-multi-layout-laravel-template.git
cd saas-multi-layout-laravel-template
- Install backend dependencies:
composer install
cp .env.example .env
php artisan key:generate
- Install frontend dependencies:
npm install
- Configure your .env file:
- Update your database and Stripe credentials in the .env file.
- Run migrations:
php artisan migrate
- Start the development servers:
npm start
php artisan serve
- Application Test:
# Test Front-end with vitest
npm test
# Test Front-end with typescript
npm run test:ts
- Demo Data: