A starter code to start the project built with Laravel 9 + InertiaJs + ReactJs

Overview

Contributors Forks Stargazers Issues MIT License LinkedIn


Logo Logo Logo

Laravel Inertia ReactJs Starter

This is a starter code to start the project, which already includes multiple layout admin templates with login for authentication
Explore the docs »

View Demo · Report Bug · Request Feature

Table of Contents
  1. About The Project
  2. Screenshoot
  3. Roadmap
  4. Getting Started
  5. Usage
  6. Contributing
  7. License
  8. Contact
  9. Acknowledgments

About The Project

(back to top)

Built With

(back to top)

Screenshoot

Login Register Landing Page
Login Register Landing Page
Dashboard Manage User Profile Page
Dashboard Manage User Profile Page

(back to top)

Roadmap

  • Integrations Argon Dashboard 2 HTML template to ReactJs
  • Multiple layout (Guest, Base, Auth)
  • Authentication
    • Sign in
    • Register
    • Google Sign in
  • User Management
  • Profile
  • Activity Log
  • Roles and Permissions

See the open issues for a full list of proposed features (and known issues).

(back to top)

Getting Started

Get a local copy (clone the repo)

Prerequisites

install Composer & NodeJs

Installation

  1. Clone the repo
    git clone https://github.com/agungksidik/laravel9-inertiajs-reactjs-starter.git
  2. Install dependency Laravel
    composer install
  3. Install NPM packages
    npm install
    npm run dev
  4. Create table corresponds to .env
    DB_DATABASE=yourdatabase_name
    DB_USERNAME=your_username
    DB_PASSWORD=your_password
  5. Run migration & Seeder
    php artisan migrate --seed
  6. Google Sign In (Insert to your .env)
     GOOGLE_CLIENT_ID='your_client_id'
     GOOGLE_CLIENT_SECRET='your_client_secret'
     GOOGLE_REDIRECT='your_callback_url'

(back to top)

Usage

  1. run server-side (Laravel)
    php artisan serve
  2. See webpack.min js
    mix.browserSync('your_url.test'); //if using Laravel Valet
    mix.browserSync('127.0.0.1:8000'); //if using artisan serve
  3. run client-side (ReactJs)
    npm run hot
  4. Default password
    setup in UserFactory
    default '123456'

(back to top)

Contributing

Contributions are what make the open source community such an amazing place to learn, inspire, and create. Any contributions you make are greatly appreciated.

If you have a suggestion that would make this better, please fork the repo and create a pull request. You can also simply open an issue with the tag "enhancement". Don't forget to give the project a star! Thanks again!

  1. Fork the Project
  2. Create your Feature Branch (git checkout -b feature/AmazingFeature)
  3. Commit your Changes (git commit -m 'Add some AmazingFeature')
  4. Push to the Branch (git push origin feature/AmazingFeature)
  5. Open a Pull Request

(back to top)

License

Distributed under the MIT License. See LICENSE.txt for more information.

(back to top)

Contact

Agung Sidik Muhamad - @agungksidik - [email protected]

Project Link: https://github.com/agungksidik/laravel9-inertiajs-reactjs-starter

(back to top)

Acknowledgments

(back to top)

You might also like...
An quick-start solution for enterprise applications as a React templete.

An quick-start solution for enterprise applications as a React templete.

Encurtador-De-Link-ReactJS - A URL Shortener Project Built With ReactJS
Encurtador-De-Link-ReactJS - A URL Shortener Project Built With ReactJS

Encurtador De Link Encurtador de link, projeto para dar continuidade aos estudos

This project is a template for ReactJS project. This template was built with Create React App.

This project is a template for ReactJS project. This template was built with Create React App.

Simple React-Native boilerplate code in Typescript for getting started with a new project quickly. It has all the essentials that one would require in a project.

react-native-boilerplate-typescript Simple React-Native boilerplate code in Typescript for getting started with a new project quickly. It has all the

Nextjs-ts-mui5-scss-storybook-starter - Next.js + TypeScript + Material UI v5 + Sass + Storybook starter
Nextjs-ts-mui5-scss-storybook-starter - Next.js + TypeScript + Material UI v5 + Sass + Storybook starter

nextjs-ts-mui5-scss-storybook-starter 📕 Next.js + TypeScript + Material UI v5 +

Nextjs-starter - A TypeScript starter for Next.js

Next.js TypeScript Starter Features ⚡️ Next.js 12 ⚛️ React 17 ⛑ TypeScript 📏 ES

React Package Starter - a simple and slightly opinionated starter kit for developing and publishing React packages

React Package Starter This is a simple and slightly opinionated starter kit for developing and publishing React packages. It comes with a several pre-

A TypeScript version of the Nextacular project. An open-source starter kit that will help you build full-stack multi-tenant SaaS platforms efficiently and help you focus on developing your core SaaS features. Built on top of popular and modern t…
A TypeScript version of the Nextacular project. An open-source starter kit that will help you build full-stack multi-tenant SaaS platforms efficiently and help you focus on developing your core SaaS features. Built on top of popular and modern t…

Nextacular 🌙 - TypeScript ‼️ Experimental and In Progress - 🚨 Use with caution Quickly launch multi-tenant SaaS applications An open-source starter

A starter Code for React JS Based Frontend Development.

Getting Started with Create React App This project was bootstrapped with Create React App. Available Scripts In the project directory, you can run: np

Owner
Agung Sidik Muhamad
Agung Sidik Muhamad
React / NextJS Helper for Laravel Developers

React / NextJS Helper for Laravel Developers

{ user.name } 8 Nov 27, 2022
React-Typescript-Webpack was config with React, Typescript, and Webpack without CRA. Faster to start your next react project.

Start your react typescript project with manual webpack config in seconds Flexible to control webpack, easy to deploy Keywords: React Starter, Webpack

jdn97 61 Jan 5, 2023
This project serves as a simple boilerplate to start building an isomorphic rendering application in React and Redux.

Isomorphic Redux App This project serves as a simple boilerplate to start building an isomorphic rendering application in React and Redux. # Features

Anton Izmailov 33 May 15, 2019
The starter code for the final assessment project for Udacity's React & Redux course

Employee Polls Project This is the starter code for the final assessment project

Hilmi Erdem KEREN 3 Jul 27, 2022
This project is collection of large projects's source code (codebases), built with Reactjs. Eg: Bestbuy, Postman, Trello, Udacity, Coursera, Skillshare, Invision, Intercom, Pipedrive, ... and more.

This project is collection of large projects's source code (codebases), built with Reactjs. Eg: Bestbuy, Postman, Trello, Udacity, Coursera, Skillshare, Invision, Intercom, Pipedrive, ... and more.

null 1.1k Dec 30, 2022
Use TypeScript, TailwindCSS & Sass to quick start your new Next.js app!!

Next.js TypeScript TailwindCSS & Sass Starter Use TypeScript, TailwindCSS & Sass to quick start your new Next.js app!! ⚡️ Quick Start ?? Getting Start

MikevPeeren 21 Dec 19, 2022
Javascript Explorer Playground do Start Tech React

Bem-vinde ao JEP! JavaScript Explorer Playground (JEP) é um explorador virtual voltado para o aprendizado da linguagem JavaScript (ECMAScript). Ideali

Start Tech React 9 Nov 25, 2021
Start your development with a Free Tailwind CSS and NextJS UI Kit and Admin.

Notus NextJS A beautiful UI Kit and Admin for Tailwind CSS and NextJS. Start your development with a Free Tailwind CSS and NextJS UI Kit and Admin. Le

Creative Tim 827 Dec 31, 2022
This boilerplate is meant to be a quick start for creating chrome extensions using React, Typescript and Tailwind CSS.

This boilerplate is meant to be a quick start for creating chrome extensions using React, Typescript and Tailwind CSS.

Bronathan 66 Dec 22, 2022
A ready template for a quick start with react. 🚀

A ready template for a quick start with react. ??

Hamid Barkand 6 Dec 15, 2022