Laravel Multiple Input Array Crud

Another Tutorials LINK

Index.blade.php

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Document</title>
    <link href="https://fonts.googleapis.com/css?family=Nunito:200,600" rel="stylesheet">
    <link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.4.1/css/bootstrap.min.css">    <link rel="stylesheet" href="https://stackpath.bootstrapcdn.com/font-awesome/4.7.0/css/font-awesome.min.css">
<style>

</style>
</head>
<body>
    <form action="/salesorder" method="post">
        @csrf
    

<div class="container">
    <div class="panel panel-default" style="background-color: #CCC">
        <div class="panel-body">
                <div class="col-sm-6"> <!-- FIRST COLUMN -->
            <!--------------------------------- Customer Code -------------------------------------------->
            <div class="form-group">
                <label for="" class="col-sm-4 control-label">Customer</label>
                <div class="col-sm-8">
                <input type="text" class="form-control" id="" name="CardCode"  placeholder="">
                </div>
            </div>
    
            <!--------------------------------- Customer Name -------------------------------------------->
            <div class="form-group">
                <label for="" class="col-sm-4 control-label"> Name</label>
                <div class="col-sm-8">
                <input type="text" class="form-control" id="" name="CardName" placeholder="">
                </div>
            </div>
            
                </div>
                <div class="col-sm-6"> <!-- Second COLUMN -->
                    <div class="form-group">
                        <label for="" class="col-sm-4 control-label"> Contact Person</label>
                        <div class="col-sm-8">
                        <input type="text" class="form-control" id="" name="CntctCode" placeholder="">
                        </div>
                    </div>

                    <div class="form-group">
                        <label for="" class="col-sm-4 control-label"> Pi No</label>
                        <div class="col-sm-8">
                        <input type="text" class="form-control" id="" name="NumAtCard" placeholder="">
                        </div>
                    </div>
                </div>

                <div class="col-sm-6"> <!-- Third COLUMN -->
                    <div class="form-group">
                        <label for="" class="col-sm-4 control-label"> Currency</label>
                        <div class="col-sm-8">
                        <input type="text" class="form-control" id="" name="DocCur" placeholder="">

                    </div>
                    </div>

                    <div class="form-group">
                        <label for="" class="col-sm-4 control-label">Series </label>
                        <div class="col-sm-8">
                        <input type="text" class="form-control" id="" name="Series" placeholder="">
                        </div>
                    </div>
                </div>

                <div class="col-sm-6"> <!-- Four COLUMN -->
                    <div class="form-group">
                        <label for="" class="col-sm-4 control-label"> So </label>
                        <div class="col-sm-8">
                        <input type="text" class="form-control" id="" name="DocNum" placeholder="">

                    </div>
                    </div>

                    <div class="form-group">
                        <label for="" class="col-sm-4 control-label">Date </label>
                        <div class="col-sm-8">
                        <input type="text" class="form-control" id="" name="DocDueDate" placeholder="">
                        </div>
                    </div>
                </div>

                <div class="col-sm-6"> <!-- Five COLUMN -->
                    <div class="form-group">
                        <label for="" class="col-sm-4 control-label"> Delivery Date </label>
                        <div class="col-sm-8">
                        <input type="text" class="form-control" id="" name="TaxDate" placeholder="">

                    </div>
                    </div>

                    <div class="form-group">
                        <label for="" class="col-sm-4 control-label">Marketing </label>
                        <div class="col-sm-8">
                        <input type="text" class="form-control" id="" name="SlpCode" placeholder="">
                        </div>
                    </div>
                </div>

                <div class="col-sm-6"> <!-- Six COLUMN -->
                    <div class="form-group">
                        <label for="" class="col-sm-4 control-label"> Usd Rate </label>
                        <div class="col-sm-8">
                        <input type="text" class="form-control" id="" name="DocRate" placeholder="">

                    </div>
                    </div>

                    <div class="form-group">
                        <label for="" class="col-sm-4 control-label">Owner </label>
                        <div class="col-sm-8">
                        <input type="text" class="form-control" id="" name="Owner" placeholder="">
                        </div>
                    </div>
                </div>
        </div>
    </div><!-- END PANEL -->
</div>


<h1>Sales Order</h1>

 
   
       
       


            <table class="table table-light " id="myTable">
                <thead class="thead-light">
                    <tr>
                        <th>#</th>
                        <th>Item No</th>
                        <th>Qty</th>
                    </tr>
                </thead>
                <tbody>
                    <tr>
                        <td></td>
                        <td><input type="text" name="itemno[]" id=""></td>
                        <td><input type="text" name="Quantity[]" id=""></td>
                        <td><input type="text" name="Amount[]" id=""></td>
                        <td><input type="text" name="Color[]" id=""></td>
                        <td><input type="text" name="Style[]" id=""></td>
                        <td><input type="text" name="ItemRef[]" id=""></td>
                    </tr>
                    <tr>
                        <td></td>
                        <td><input type="text" name="itemno[]" id=""></td>
                        <td><input type="text" name="Quantity[]" id=""></td>
                        <td><input type="text" name="Amount[]" id=""></td>
                        <td><input type="text" name="Color[]" id=""></td>
                        <td><input type="text" name="Style[]" id=""></td>
                        <td><input type="text" name="ItemRef[]" id=""></td>
                    </tr>
                </tbody>
                <tfoot>
                    <tr>
                        <th>#</th>
                    </tr>
                </tfoot>
            </table>
     
    
        <button class="btn-primary">Save</button>
        </form>
    </div>
</body>
<script>

</script>
</html>

SalesController.php

<?php

namespace App\Http\Controllers;

use App\SalesOrder;
use App\SalesItem;
use Illuminate\Http\Request;

class SalesOrderController extends Controller
{
    /**
     * Display a listing of the resource.
     *
     * @return \Illuminate\Http\Response
     */
    public function index()
    {
        //
    }

    /**
     * Show the form for creating a new resource.
     *
     * @return \Illuminate\Http\Response
     */
    public function create()
    {
        //
    }

    /**
     * Store a newly created resource in storage.
     *
     * @param  \Illuminate\Http\Request  $request
     * @return \Illuminate\Http\Response
     */
    public function store(Request $request)
    {
        //

        $sales = new SalesOrder();
        $sales->CardCode = $request->CardCode;
        $sales->CardName = $request->CardName;
        $sales->CntctCode = $request->CntctCode;
        $sales->NumAtCard = $request->NumAtCard;
        $sales->DocCur = $request->DocCur;
        $sales->DocRate = $request->DocRate;
        $sales->Series = $request->Series;
        $sales->DocNum = $request->DocNum;
        $sales->DocDueDate = $request->DocDueDate;
        $sales->TaxDate = $request->TaxDate;
        $sales->SlpCode = $request->SlpCode;
        $sales->Owner = $request->Owner;
        $id = $sales->save();

        foreach ($request->itemno as $key => $val){
            $data = array("ItemCode"=>$request->itemno[$key],"Quantity"=>$request->Quantity[$key],"Amount"=>$request->Amount[$key],"Color"=>$request->Color[$key],"Style"=>$request->Style[$key],"ItemRef"=>$request->ItemRef[$key]);
            SalesItem::insert( $data);
        }

        

    }

    /**
     * Display the specified resource.
     *
     * @param  \App\SalesOrder  $salesOrder
     * @return \Illuminate\Http\Response
     */
    public function show(SalesOrder $salesOrder)
    {
        //
    }

    /**
     * Show the form for editing the specified resource.
     *
     * @param  \App\SalesOrder  $salesOrder
     * @return \Illuminate\Http\Response
     */
    public function edit(SalesOrder $salesOrder)
    {
        //
    }

    /**
     * Update the specified resource in storage.
     *
     * @param  \Illuminate\Http\Request  $request
     * @param  \App\SalesOrder  $salesOrder
     * @return \Illuminate\Http\Response
     */
    public function update(Request $request, SalesOrder $salesOrder)
    {
        //
    }

    /**
     * Remove the specified resource from storage.
     *
     * @param  \App\SalesOrder  $salesOrder
     * @return \Illuminate\Http\Response
     */
    public function destroy(SalesOrder $salesOrder)
    {
        //
    }
}

SalesItemController.php

<?php

namespace App\Http\Controllers;

use App\SalesItem;
use Illuminate\Http\Request;

class SalesItemController extends Controller
{
    /**
     * Display a listing of the resource.
     *
     * @return \Illuminate\Http\Response
     */
    public function index()
    {
        //
    }

    /**
     * Show the form for creating a new resource.
     *
     * @return \Illuminate\Http\Response
     */
    public function create()
    {
        //
    }

    /**
     * Store a newly created resource in storage.
     *
     * @param  \Illuminate\Http\Request  $request
     * @return \Illuminate\Http\Response
     */
    public function store(Request $request)
    {
        //
    }

    /**
     * Display the specified resource.
     *
     * @param  \App\SalesItem  $salesItem
     * @return \Illuminate\Http\Response
     */
    public function show(SalesItem $salesItem)
    {
        //
    }

    /**
     * Show the form for editing the specified resource.
     *
     * @param  \App\SalesItem  $salesItem
     * @return \Illuminate\Http\Response
     */
    public function edit(SalesItem $salesItem)
    {
        //
    }

    /**
     * Update the specified resource in storage.
     *
     * @param  \Illuminate\Http\Request  $request
     * @param  \App\SalesItem  $salesItem
     * @return \Illuminate\Http\Response
     */
    public function update(Request $request, SalesItem $salesItem)
    {
        //
    }

    /**
     * Remove the specified resource from storage.
     *
     * @param  \App\SalesItem  $salesItem
     * @return \Illuminate\Http\Response
     */
    public function destroy(SalesItem $salesItem)
    {
        //
    }
}

SalesOrderController

<?php

namespace App\Http\Controllers;

use App\SalesOrder;
use App\SalesItem;
use Illuminate\Http\Request;

class SalesOrderController extends Controller
{
    /**
     * Display a listing of the resource.
     *
     * @return \Illuminate\Http\Response
     */
    public function index()
    {
        //
    }

    /**
     * Show the form for creating a new resource.
     *
     * @return \Illuminate\Http\Response
     */
    public function create()
    {
        //
    }

    /**
     * Store a newly created resource in storage.
     *
     * @param  \Illuminate\Http\Request  $request
     * @return \Illuminate\Http\Response
     */
    public function store(Request $request)
    {
        //

        $sales = new SalesOrder();
        $sales->CardCode = $request->CardCode;
        $sales->CardName = $request->CardName;
        $sales->CntctCode = $request->CntctCode;
        $sales->NumAtCard = $request->NumAtCard;
        $sales->DocCur = $request->DocCur;
        $sales->DocRate = $request->DocRate;
        $sales->Series = $request->Series;
        $sales->DocNum = $request->DocNum;
        $sales->DocDueDate = $request->DocDueDate;
        $sales->TaxDate = $request->TaxDate;
        $sales->SlpCode = $request->SlpCode;
        $sales->Owner = $request->Owner;
        $id = $sales->save();

        foreach ($request->itemno as $key => $val){
            $data = array("ItemCode"=>$request->itemno[$key],"Quantity"=>$request->Quantity[$key],"Amount"=>$request->Amount[$key],"Color"=>$request->Color[$key],"Style"=>$request->Style[$key],"ItemRef"=>$request->ItemRef[$key]);
            SalesItem::insert( $data);
        }

        

    }

    /**
     * Display the specified resource.
     *
     * @param  \App\SalesOrder  $salesOrder
     * @return \Illuminate\Http\Response
     */
    public function show(SalesOrder $salesOrder)
    {
        //
    }

    /**
     * Show the form for editing the specified resource.
     *
     * @param  \App\SalesOrder  $salesOrder
     * @return \Illuminate\Http\Response
     */
    public function edit(SalesOrder $salesOrder)
    {
        //
    }

    /**
     * Update the specified resource in storage.
     *
     * @param  \Illuminate\Http\Request  $request
     * @param  \App\SalesOrder  $salesOrder
     * @return \Illuminate\Http\Response
     */
    public function update(Request $request, SalesOrder $salesOrder)
    {
        //
    }

    /**
     * Remove the specified resource from storage.
     *
     * @param  \App\SalesOrder  $salesOrder
     * @return \Illuminate\Http\Response
     */
    public function destroy(SalesOrder $salesOrder)
    {
        //
    }
}

SalesOrder Migration File

<?php

use Illuminate\Database\Migrations\Migration;
use Illuminate\Database\Schema\Blueprint;
use Illuminate\Support\Facades\Schema;

class CreateSalesOrdersTable extends Migration
{
    /**
     * Run the migrations.
     *
     * @return void
     */
    public function up()
    {
        Schema::create('sales_orders', function (Blueprint $table) {
            $table->id();
            $table->string('CardCode');
            $table->string('CardName');
            $table->string('CntctCode');
            $table->string('NumAtCard');
            $table->string('DocCur');
            $table->string('DocRate');
            $table->string('Series');
            $table->string('DocNum');
            $table->date('DocDueDate');
            $table->date('TaxDate');
            $table->timestamps();
            $table->string('SlpCode');
            $table->string('Owner');
        });
    }

    /**
     * Reverse the migrations.
     *
     * @return void
     */
    public function down()
    {
        Schema::dropIfExists('sales_orders');
    }
}

SalesItem Migration File

<?php

use Illuminate\Database\Migrations\Migration;
use Illuminate\Database\Schema\Blueprint;
use Illuminate\Support\Facades\Schema;

class CreateSalesItemsTable extends Migration
{
    /**
     * Run the migrations.
     *
     * @return void
     */
    public function up()
    {
        Schema::create('sales_items', function (Blueprint $table) {
            $table->id();
            $table->string('ItemCode');
            $table->string('Quantity');
            $table->string('Amount');
            $table->string('Color');
            $table->string('Style');
            $table->string('ItemRef');
            $table->timestamps();
        });
    }

    /**
     * Reverse the migrations.
     *
     * @return void
     */
    public function down()
    {
        Schema::dropIfExists('sales_items');
    }
}

SalesItem Model

<?php

namespace App;

use Illuminate\Database\Eloquent\Model;

class SalesItem extends Model
{
    //
    protected $table = "sales_items";
    protected $fillable = ['ItemCode','Quantity','Amount','Color','Style','ItemRef'];
}

SalesOrder model

<?php

namespace App;

use Illuminate\Database\Eloquent\Model;

class SalesOrder extends Model
{
    //
    protected $table = "sales_orders";
    protected $fillable = ['CardCode','CardName','CntctCode','NumAtCard','DocCur','DocRate','Series','DocNum','DocDueDate','TaxDate','SlpCode','Owner'];
}

লারাভেল এ reactjs নিয়ে কাজ করা

লারাভেল এ reactjs নিয়ে কাজ করা :

Download Laravel7 & laravel7react boilarpalte

reactjs এর অনলাইন টুল :অনেক সময় html কোডেকে reactjs এর jsx এ কনভার্ট করার দরকার হয় আবার css কে react এ ভ্যালিড ভাবে লিখার জন্য ঝামেলায় পড়তে হয় তখন আমরা নিচের টুল গুলো ব্যবহার করবো। htmltojsx এন্ড css to reactjs

ভিজ্যুয়াল ষ্টুডিও কোড এ তাড়াতাড়ি reactjs কোড লিখার জন্য আমরা reactjs স্নিপেট এক্সটেনশনটি ইনস্টল করবো তাহলে যদি কোনো ক্লাস তৈরী করতে চাই তবে rcc লিখলে সম্পূর্ণ একটি ক্লাস তৈরী হয়ে যাবে আর ফাঙ্কশন লিখতে চাইলে rrc লিখলে সম্পূর্ণ একটি ফাঙ্কশন তৈরী হয়ে যাবে।

  • ১.প্রথমে php ৭.২ ভার্সন এর ইনভেরনমেন্ট তৈরী করতে হবে। এজন্য আমরা Xamp,Wamp ,Uwamp ,Usbwebserver বা অন্য যেকোনো উপায়ে আমাদের সিস্টেম এ php কোড রান করার পরিবেশ তৈরী করতে পারি।
  • ২.Composer ইনস্টল করতে হবে এবং ইনস্টল করার সময় অবশ্যই ইন্টারনেট কানেকশন লাগবে এবং php.exe ফাইলটি ইনস্টল এর সময় দেখিয়ে দিতে হবে।
  • ৩.Nodejs এর রেকোমেন্ডেড ভার্সন ইনস্টল করতে হবে
  • ৪.লারাভেল এ একটি প্রজেক্ট তৈরী করতে হবে এজন্য cli বা comand prump এ এই কোড টি রান করতে হবে : composer create-project –prefer-dist laravel/laravel projectname এবং ইন্টারনেট সংযোগ সহকারে কিছুক্ষন অপেক্ষা করতে হবে যতক্ষণ পর্যন্ত লারাভেল এ প্রজেক্ট তৈরী কমপ্লিট হয়। প্রজেক্ট তৈরী কমপ্লিট হলে সবুজ কালারে successfull লিখা আসবে।
  • ৫.লারাভেল ৭ এ reactjs নিয়ে কাজ করার জন্য প্রথমে এই কোড প্রজেক্ট ফোল্ডার এ কম্যান্ড পরাম্প এর মাদ্ধমে রান করতে হবে : composer require laravel/ui এবং ইন্টারনেট সংযোগ সহকারে কিছুক্ষন অপেক্ষা করতে হবে যতক্ষণ পর্যন্ত কমপ্লিট না হয়।
  • ৬.এবার এই কোড টি কমান্ড প্রৌম্প এর রান করতে হবে :php artisan ui react এবং ইন্টারনেট সংযোগ সহকারে কিছুক্ষন অপেক্ষা করতে হবে যতক্ষণ পর্যন্ত কমপ্লিট না হয়।
  • ৭.এবার এই কোড টি কমান্ড প্রৌম্প এর রান করতে হবে :npm install এবং ইন্টারনেট সংযোগ সহকারে কিছুক্ষন অপেক্ষা করতে হবে যতক্ষণ পর্যন্ত কমপ্লিট না হয়।
  • ৮.এবার এই কোড টি কমান্ড প্রৌম্প এর রান করতে হবে :npm run devএবং ইন্টারনেট সংযোগ সহকারে কিছুক্ষন অপেক্ষা করতে হবে যতক্ষণ পর্যন্ত কমপ্লিট না হয়।
  • ৯.এবার এই কোড টি কমান্ড প্রৌম্প এর রান করতে হবে : php artisan serve
  • ১০.এবার ব্রাউজার এ http://127.0.0.1:8000/ এই লিংক টি তে গেলে আমরা আমাদের লারাভেল প্রজেক্টটি দেখতে পাবো

১১.আমরা এবার এই ভিউ কে REACT দ্বারা পরিবর্তন করবো এজন্য resources/js/components/ ফোল্ডার এর মধ্যে index.js নাম এ একটি ফাইল তৈরী করবো।
১২. resources/js/components/ ফোল্ডার এর Example.js ফাইল এর সব কপি করে index.js ফাইল এ পেস্ট করে কিছু পরিবর্তন করবো।
১৩. resources/js/App.js ফাইল এ index.js কম্পোনেন্ট টি অ্যাড করবো এই কোড দিয়ে :require(‘./components/index’);
১৪. এবার আমরা view ফোল্ডার এর welcome ফাইল কে এডিট করবো এজন্য html বডি শেষ হওয়ার পর App.js ফাইল জাভাস্ক্রিপ্ট ফাইল হিসাবে অ্যাড করবো এভাবে


১৫. এবং এর মধ্যে যা লিখবো তাই আমাদের শো করবে
১৬.এবার প্রজেক্ট এর রুট ফোল্ডার এ cli বা কমান্ড পরাম্প এ এই কোড টি ইন্টারনেট সংযোগ সহকারে রান করে : npm run dev

১৭. এবার ব্রাউজার এ প্রজেক্ট টি রান আসবে

লারাভেল reactjs এ বুটস্ট্র্যাপ এর css ও js নিয়ে কাজ করার জন্য : আমরা সবাই বুটস্ট্র্যাপ নিয়ে কাজ করতে অভ্ভাসতো তাই আমরা নিচের পদ্ধতি অবলম্বন করবো : প্রথমে প্রজেক্ট ফোল্ডারটি cmd তে ওপেন করে লিখবো
npm install –save bootstrap এবারের কিছুক্ষন অপেক্ষা করে কমপ্লিট হলে App.js ফাইল এ বুটস্ট্রাপটি ইম্পোর্ট করবো এভাবে import Bootstrap from ‘bootstrap/dist/css/bootstrap.min.css’; এবার cmd তে npm run dev লিখে এন্টার করলে reactjs অপ্পটি বিল্ড হবে এবার আমরা প্রজেক্ট এর ইউআরএল টি রিফ্রেশ করলে তার পরিবর্তন যে যেগুলো কম্পোনেন্ট এ আমরা বুটস্ট্র্যাপ এর ক্লাস বেবহার করেছি তা কাজ করছে

লারাভেল reactjs প্রজেক্ট এ রিএক্ট router নিয়ে কাজ করা : সামাদ তে রান করি npm install react-router-dom –save কিছুক্ষন অপেক্ষা করে কমপ্লিট হলে আমরা যে ফাইল এ রিএক্ট রাউটার বেবহার করবো সেই পেজ এ ইম্পোর্ট করি এভাবে : import {
BrowserRouter as Router,
Switch,
Route,
Link
} from “react-router-dom”;

১৮.. এবার আমরা লগইন ও রেজিস্ট্রেশন সিস্টেম তৈরী করবো যাতে অন্য কীয় আমাদের এপ্লিকেশন এ ঢুকতে না পারে এজন্য প্রথমে প্রজেক্ট ফোল্ডার এ গিয়ে
১.composer require laravel/ui এই কোড টি আমাদের লাগবে না কারণ আমরা পূর্বে রিএক্ট ইনস্টল করার পূর্বে এই কোড রান করে ওই গুলো নিয়ে চি এবার নিচের কোড রান করি
২.php artisan ui:auth এবার নিচের কোড রান করি
৩.php artisan ui react –auth (আমরা যদি vue বা bootstrap উসে করি তাহলে এই কোড গুলো রান করবো php artisan ui vue –auth
এবং php artisan ui bootstrap –auth
)
৪. এবার আমরা আমাদের প্রজেক্ট কে ডাটাবেস এর সাথে কনফিগার করবো এজন্য .env ফাইল এ ডাটাবেস কনফিগার করি
৫.এবার আমাদের এপ্লিকেশন migrate করার পালা অনেক সময় মাইগ্রেট করার সময় এরর শো করে এজন্য আমরা app\Providers\AppServiceProvider.php ফোল্ডার এ এই কোড টি লিখবো

use Illuminate\Support\Facades\Schema;
এবং boot ফাঙ্কশনটি এরকম হবে
public function boot()
{
Schema::defaultStringLength(191);
}
৬.এবার migrate করার জন্য এই কোড রান করি : php artisan migrate:fresh

১৯. এবার আমরা আমাদের ইউআরএল এ http://127.0.0.1:8000/home লিখলে নিচের একটি পেজ এর ড্যাশবোর্ড শো করবে

২০.এবার আমি যদি আমার resourse /views /home.blade.php ফাইল টি ওপেন করি তাহলে এরকম কোড দেখতে পাবো

@extends('layouts.app')

@section('content')
<div class="container">
    <div class="row justify-content-center">
        <div class="col-md-8">
            <div class="card">
                <div class="card-header">Dashboard</div>

                <div class="card-body">
                    @if (session('status'))
                        <div class="alert alert-success" role="alert">
                            {{ session('status') }}
                        </div>
                    @endif

                    You are logged in!
                </div>
            </div>
        </div>
    </div>
</div>
@endsection

২১. এবার আমি এটাকে এভাবে মোডিফাই করবো

@extends('layouts.app')

@section('content')
<div class="container">
    <div id="example"></div>
</div>
@endsection

২২.এখানে দিয়েছি যাতে এখানে আমি react এর কম্পোনেন্ট নিয়ে কাজ করতে পারি

২৩. এবার আমি যদি ব্রাউসার রিফ্রেশ করি তাহলে আমি দেখতে পাবো যে example id এর মধ্যে Example component টি লোড হয়ে আছে।

২৪. এবার js/Component/Example.js ফাইল কে App.js ফাইল এ rename করি এবং তারমধ্যে কোড গুলো এরকম হবে

import React from 'react';
import ReactDOM from 'react-dom';

function Example() {
    return (
        <div className="container">
            <div className="row justify-content-center">
                <div className="col-md-8">
                    <div className="card">
                        <div className="card-header">Example Component</div>

                        <div className="card-body">I'm an example component!</div>
                    </div>
                </div>
            </div>
        </div>
    );
}

export default Example;

if (document.getElementById('example')) {
    ReactDOM.render(<Example />, document.getElementById('example'));
}

২৫ এবার js/Component/index.js ফাইল টি এরকম হবে

import React, { Component } from 'react';
import ReactDOM from 'react-dom';
// import App component
import App from './components/App'

// change the getElementId from example to app 
// render App component instead of Example
if (document.getElementById('root')) {
    ReactDOM.render(<App />, document.getElementById('root'));
}

২৬. এবার js/App.js যে ফাইল তা আছে তা এরকম হবে।

/**
 * First we will load all of this project's JavaScript dependencies which
 * includes React and other helpers. It's a great starting point while
 * building robust, powerful web applications using React + Laravel.
 */

require('./bootstrap');

/**
 * Next, we will create a fresh React component instance and attach it to
 * the page. Then, you may begin adding components to this application
 * or customize the JavaScript scaffolding to fit your unique needs.
 */

require('./components/index');

২৭. এবার home.blade.php ফাইলটি এরকম হবে যাতে আমরা example আইডি এর পরিবর্তে root এইড বেবহার করবো

@extends('layouts.app')

@section('content')
<div class="container">
    <div id="root"></div>
</div>
@endsection

২৮. এবার আমাদের js/Component/ ফোল্ডার এ বিভিন্ন কম্পোনেন্ট বানিয়ে বেবহার করার সময়

২৯.এটা করার জন্য react এ যেভাবে কম্পোনেন্ট নিয়ে কাজ করেছিলাম সেইভাবে এখানে কম্পোনেন্ট বানিয়ে কাজ করবো

৩০.এবার আমরা এখন থেকে একটি এপ্লিকেশন বানাবো এই And Eita টিউটোরিয়াল ফলো করে।

লারাভেল ও রিএক্ট এর crud স্টেপ বাই স্টেপ :
১. প্রথমে model,migration,controller তৈরী করে নেই ডেমো হিসাবে আমি Product নাম একটি রিসোর্সে কন্ট্রোলার এর সাথে মডেল তৈরী করলাম

php artisan make:model Product

product.php

<?php

namespace App;

use Illuminate\Database\Eloquent\Model;

class Product extends Model
{
    //
    protected $fillable = ['title','body'];
}

product migration file

<?php

use Illuminate\Database\Migrations\Migration;
use Illuminate\Database\Schema\Blueprint;
use Illuminate\Support\Facades\Schema;

class CreateProductsTable extends Migration
{
    /**
     * Run the migrations.
     *
     * @return void
     */
    public function up()
    {
        Schema::create('products', function (Blueprint $table) {
            $table->id();
            $table->string('title');
            $table->string('body');
            $table->timestamps();
        });
    }

    /**
     * Reverse the migrations.
     *
     * @return void
     */
    public function down()
    {
        Schema::dropIfExists('products');
    }
}

routes/api.php

Route::resource('products', 'ProductController');




laravel+reactjs crud link

laravel crud tutorial

প্রথমে লারাভেল এর project তৈরী করতে হবে। এ জন্য কমান্ড প্রম্প এ blog নাম এ একটি প্রজেক্ট তৈরী করার জন্য এই কোড টি লিখে এন্টার করি।

composer create-project --prefer-dist laravel/laravel blog

এবার আমাদের ডাটাবেস এর কনফিগার অনুযায়ী আমাদের প্রজেক্ট এর মেইন ফোল্ডার এ .env ফাইল এ ডাটাবেস এর ইনফরমেশন দিতে হবে যেমন আমার ডাটাবেস এর ইউআরএল ,উজারনেম,পাসওয়ার্ড,,ডাটাবেস নাম ইত্যাদি।

DB_CONNECTION=mysql
DB_HOST=127.0.0.1
DB_PORT=3306
DB_DATABASE=test
DB_USERNAME=root
DB_PASSWORD=root

Route.php

Route::resource('/student', 'StudentController');

Create a student controller ,model,migration File

php artisan make:model Student -mcr

Student.php

<?php

namespace App;

use Illuminate\Database\Eloquent\Model;

class Student extends Model
{
    //
    protected $table = "students";
    protected $fillable = ['name','roll','class'];

}

StudentController.php

<?php

namespace App\Http\Controllers;

use App\Student;
use Illuminate\Http\Request;

class StudentController extends Controller
{
    /**
     * Display a listing of the resource.
     *
     * @return \Illuminate\Http\Response
     */
    public function index()
    {
        //

        $data = Student::all();
        return view('student.index',compact('data'));
    }

    /**
     * Show the form for creating a new resource.
     *
     * @return \Illuminate\Http\Response
     */
    public function create()
    {
        //
        return view ('student.save');
    }

    /**
     * Store a newly created resource in storage.
     *
     * @param  \Illuminate\Http\Request  $request
     * @return \Illuminate\Http\Response
     */
    public function store(Request $request)
    {
        //
        $validatedData = $request->validate([
            'name'=>'required|max:255',
            'roll'=>'required',
            'class'=>'required'
        ]);
        $show = Student::create($validatedData);
        return redirect('/student')->with('successs','Student Added');
    }

    /**
     * Display the specified resource.
     *
     * @param  \App\Student  $student
     * @return \Illuminate\Http\Response
     */
    public function show(Student $student)
    {
        //
    }

    /**
     * Show the form for editing the specified resource.
     *
     * @param  \App\Student  $student
     * @return \Illuminate\Http\Response
     */
    public function edit($id)
    {
        //
        $studentedit = Student::findOrFail($id);
        return view('student.edit')->with('data',$studentedit);
    }

    /**
     * Update the specified resource in storage.
     *
     * @param  \Illuminate\Http\Request  $request
     * @param  \App\Student  $student
     * @return \Illuminate\Http\Response
     */
    public function update(Request $request,  $id)
    {
        //
        $validatedData = $request->validate([
            'name'=>'required',
            'roll'=>'required',
            'class'=>'required'
        ]);

        $studentupdate = Student::whereId($id)->update($validatedData);
        return redirect('/student')->with('success','Data is successfully updated');
    }

    /**
     * Remove the specified resource from storage.
     *
     * @param  \App\Student  $student
     * @return \Illuminate\Http\Response
     */
    public function destroy( $id)
    {
        //

        $deleteid = Student::findOrFail( $id);
        $deleteid->delete();
        return redirect('/student')->with('success','Data is successfully Deleted');

    }
}

Migration File

<?php

use Illuminate\Database\Migrations\Migration;
use Illuminate\Database\Schema\Blueprint;
use Illuminate\Support\Facades\Schema;

class CreateStudentsTable extends Migration
{
    /**
     * Run the migrations.
     *
     * @return void
     */
    public function up()
    {
        Schema::create('students', function (Blueprint $table) {
            $table->id();
            $table->string('name');
            $table->string('roll');
            $table->string('class');
            $table->timestamps();
        });
    }

    /**
     * Reverse the migrations.
     *
     * @return void
     */
    public function down()
    {
        Schema::dropIfExists('students');
    }
}

Layout View File under student folder resource/view/student/

layout.blade.php

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <meta http-equiv="X-UA-Compatible" content="ie=edge">
    <title>Document</title>
    <link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/4.4.1/css/bootstrap.min.css">

</head>
<body>
    <div class="container">
        @yield('content')
    </div>
</body>
</html>

index.blade.php

@extends('student.layout')
@section('content')
<div class="row">
<a href="/student/create">Aadd Students</a>
    <div class="col-md-12 margin-tb">
            <table class="table-responsive table-bordered">
                <thead>
                    <th>Id</th>
                    <th>Name</th>
                    <th>Roll</th>
                    <th>Class</th>

                    <th>aAction</th>

                </thead>
                <tbody>
                    @foreach ($data as $row)
                    <tr><td>{{$row->id}}</td>
                    <td>{{$row->name}}</td>
                    <td>{{$row->roll}}</td>
                    <td>{{$row->class}}</td>

                    <td><a href="{{route('student.edit',$row->id)}}">Edit</a></td>
                    <td> <form action="{{route('student.destroy',$row->id)}}" method="post">
                        @csrf
                        @method('DELETE')                        <button class="btn btn-danger" type="submit">Delete</button>
                    </form>
                    </td>
                   </tr>
                    @endforeach
                </tbody>
            </table>
    </div>
</div>
@endsection

save.blade.php

@extends ('student.layout')
@section('content')
<div class="card-body">
    @if ($errors->any())
      <div class="alert alert-danger">
        <ul>
            @foreach ($errors->all() as $error)
              <li>{{ $error }}</li>
            @endforeach
        </ul>
      </div><br />
    @endif
<form action="{{route('student.store')}}" method="post">
    @csrf
    <div class="form-group">
              @csrf
              <label for="name">Name:</label>
              <input type="text" id="name" class="form-control" name="name"/>
          </div>
          <div class="form-group">
              <label for="roll">Roll :</label>
              <input type="text" id='roll' class="form-control" name="roll"/>
          </div>
         <div class="form-group">
         <label for="roll">Class :</label>
              <input type="text" id='roll' class="form-control" name="class"/>
         </div>
         <button type="submit" class="btn btn-primary">Add Data</button>
      </form>
</form>
@endsection

edit.blade.php

@extends('student.layout')
@section('content')
<div class="row">
    <div class="col-md-12">
    @if ($errors->any())
      <div class="alert alert-danger">
        <ul>
            @foreach ($errors->all() as $error)
              <li>{{ $error }}</li>
            @endforeach
        </ul>
      </div><br />
    @endif
        <form action="{{route('student.update',$data->id)}}" method="post">
            @csrf
            @method('PATCH')
            <div class="form-group">
                <label for="name">Name</label>
                <input id="name" class="form-control" type="text" name="name" value="{{$data->name}}">
            </div>
            <div class="form-group">
                <label for="roll">Roll</label>
                <input id="roll" class="form-control" type="text" name="roll" value="{{$data->roll}}">
            </div>
            <div class="form-group">
                <label for="class">Class</label>
                <input id="class" class="form-control" type="text" name="class" value="{{$data->class}}">
            </div>
            <button class="btn btn-primary" type="submit">Update</button>
        </form>
    </div>
</div>
@endsection

Laravel Reference By Oleetech

Laravel Database Column Datatype

Command	Description
$table->bigIncrements('id');
$table->bigInteger('votes');	  BIGINT equivalent for the database.
$table->binary('data');	          BLOB equivalent for the database.
$table->boolean('confirmed');	  BOOLEAN equivalent for the database.
$table->char('name', 4);	  CHAR equivalent with a length.
$table->date('created_at');	  DATE equivalent for the database.
$table->dateTime('created_at');	  DATETIME equivalent for the database.
$table->dateTimeTz('created_at'); DATETIME (with timezone) for  database.
$table->decimal('amount', 5, 2);  DECIMAL  with a precision and scale.
$table->double('column', 15, 8);  DOUBLE equivalent with precision, 15 digits in total and 8 after the decimal point.
$table->enum('choices', ['foo', 'bar']);
ENUM equivalent for the database.
$table->float('amount');	FLOAT equivalent for the database.
$table->increments('id');	Incrementing ID (primary key) using a “UNSIGNED INTEGER” equivalent.
$table->integer('votes');	INTEGER equivalent for the database.
$table->ipAddress('visitor');	IP address equivalent for the database.
$table->json('options');	JSON equivalent for the database.
$table->jsonb('options');	JSONB equivalent for the database.
$table->longText('description');	LONGTEXT equivalent for the database.
$table->macAddress('device');	MAC address equivalent for the database.
$table->mediumInteger('numbers');	MEDIUMINT equivalent for the database.
$table->mediumText('description');	MEDIUMTEXT equivalent for the database.
$table->morphs('taggable');	Adds INTEGER taggable_id and STRINGtaggable_type.
$table->nullableTimestamps();	Same as timestamps(), except allows NULLs.
$table->rememberToken();	Adds remember_token as VARCHAR(100) NULL.
$table->smallInteger('votes');	SMALLINT equivalent for the database.
$table->softDeletes();	Adds deleted_at column for soft deletes.
$table->string('email');	VARCHAR equivalent column.
$table->string('name', 100);	VARCHAR equivalent with a length.
$table->text('description');	TEXT equivalent for the database.
$table->time('sunrise');	TIME equivalent for the database.
$table->timeTz('sunrise');	TIME (with timezone) equivalent for the database.
$table->tinyInteger('numbers');	TINYINT equivalent for the database.
$table->timestamp('added_on');	TIMESTAMP equivalent for the database.
$table->timestampTz('added_on');	TIMESTAMP (with timezone) equivalent for the database.
$table->timestamps();	Adds created_at and updated_at columns.
$table->uuid('id');	UUID equivalent for the database.

laravel Tutorial

For Laravel preparetion after basic go to link link2 , Laravel7 Official Doc, laravel 7 coostomdocs custom registrationsystem

১. প্রথমে কম্পোজার ইনস্টল করতে হবে।
২. www ডিরেক্টরি তে ইচ্ছামতো একটি ফোল্ডার এর নাম দিয়ে ফোল্ডার তৈরী করি।
৩. cmd দিয়ে www ডিরেক্টরিতে গিয়ে কম্যান্ড এর মাদ্ধমে লারাভেল ইনস্টল করতে হবে। অনেক সময় cmd দিয়ে ডিরেক্টরি চেঞ্জ হয়না (D:) এভাবে ডিরেক্টরি চেঞ্জ করতে হয় এখানে d: দিলে d ড্রাইভ এ কাজ করবে।

৪.cmd তে লিখ composer create-project laravel/laravel firstproject
এখানে blog হলো ফোল্ডার এর নাম
৫. এবার cmd তে প্রজেক্ট ফোল্ডার এ ফিয়ে এই কমান্ড দিতে হবে php artisan serve

লারাভেল রাউটিং

লারাভেল রাউটিং বা ইউআরএল ফরওয়ার্ডিং : লারাভেল এ ইউআরএল বার এ কোন ইউআরএল হলে কোন পেজ শো করবে তা ঠিক করার জন্য route/web.php ফাইল এ কাজ করতে হবে।
আমরা যদি এভাবে লিখি
Route::get(‘/olee’, function () { return ” Olee Is Best”;});
এবং ইউআরএল এ /olee লিখে এন্টার করি তাহলে এরকম আউটপুট আসবে।

আবার আমরা যদি কোনো ভিউ বা টেম্পলেট ফাইল দেখতে চাই তবে নিচের পদ্ধতি অবলম্বন করতে হবে।
আমরা একটি টেম্পলেট ফাইল হিসাবে views ফোল্ডার এর মধ্যে blade.php এক্সটেনশন সহকারে একটি ফাইল রাখলাম যার নাম olee .blade.php এবং তার মধ্যে ইচ্ছামতো কোডিং করলাম এবার ইউআরএল টি পাওয়ানোর জন্য route/web.php ফাইল এ নিচের মতো কোড লিখতে হবে।

html ফর্ম secure করার জন্য নিচের মতো করে কাজ করতে হবে । ফর্ম ট্যাগ এর ফার্স্ট লাইন এ @csrf লিখতে হবে।

<form method="POST" action="/profile">  
    @csrf  
    ...  
</form>  

লারাভেল route এর মধ্যে ইউআরএল এর সাথে প্যারামিটার পাঠানো যাই দুই ভাবে।

Required Parameters
Optional Parameters

Required Parameters
// get the parameter of name
Route::get(‘students/{name}’, function($name) {
echo ‘Students Name is ‘ . $name;
});

একইভাবে আপনি একাধিক Required Parameter পাঠাতে পারেন, নিচের উদাহরণ লক্ষ্য করুন :

Route::get(‘/olee/{name}/{salary}’, function ($name,$sal) {    return “my name is “.$name.$sal;});

Optional Parameters

আপনি যদি আপনার URL এ এমন কিছু Parameter পাঠাতে চান , যা থাকতেও পারে আবার নাও থাকতে পারে। এই সব ক্ষেত্রে আপনাকে Laravel এর Optional Parameter System ব্যবহার করতে হবে। তখন URL এ এই প্যারামিটার গুলির থাকার আবশ্যকীয় নয়। আর এই Parameter গুলির নামের পরে “?” চিহ্ন দিতে হয়। নিম্নের কোডটি লক্ষ্য করুন :

Route::get('users/{name?}', function($name="Olee Ahmmed") {
        echo 'User Name is ' . $name;
});

লারাভেল কন্ট্রোলার :

প্রথমে আমরা যখন কোনো রিকোয়েস্ট পাঠায় তখন প্রথমে সেটা route এ যায় এরপর কন্ট্রোলার কে খুঁজে কন্ট্রোলের এর মধ্যে আমাদের সকল শর্ত সমূহ থাকে তারপর মডেল এ গিয়ে দেখে যে ডাটাবেস হতে কোনো ডাটা আনতে হবে কিনা তার পর সেটা ভিউ এ শো করে।
Laravel Framework এ কিভাবে Controller তৈরী করা হয় ?
প্রথমে লারাভেল এর প্রজেক্ট ফোল্ডার এ গিয়ে কমান্ড প্রম্প এর মাদ্ধমে কন্ট্রোলার তৈরী করতে হবে।
php artisan make:controller homeController লিখে ইন্টার করলে homeController নাম একটি কন্ট্রোলার ফাইল তৈরী হবে app/http /controller ফোল্ডার এর মধ্যে যদি কোনো ফোল্ডার এর মধ্যে কন্ট্রোলার তৈরী করতে হয় তাহলে php artisan make:controller ফোল্ডারনাম/কন্ট্রোলেরনাম এভাবে লিখে এন্টার করতে হবে।ইটা আসলে একটা ক্লাস ফাইল এর মধ্যে মেথড লিখে route হতে এক্সেস করতে হবে।
route এর মাধ্যমে controller class এর যেকোনো মেথড show করা:
আমরা আমাদের কন্ট্রোলার ক্লাস ফাইল এর মধ্যে একটি মেথড তৈরী করলাম এবং সেটাকে route হতে এক্সেস করার জন্য :

// কন্ট্রোলার ক্লাস এর কোড 
<?php
 
namespace App\Http\Controllers;
 
use Illuminate\Http\Request;
 
class homeController extends Controller
{
    public function index(){
        echo "Hello World";
    }
}
// route ফাইল  এর কোড 
Route::get('/home', 'homeController@index');

URL এ Route এর মাধ্যমে Controller এর নির্দিষ্ট Method এ Parameter পাঠানো :

Route::get('/home/{name}/{age}', 'homeController@index');
// আপনি Parameter দুটিকে Optional করে দিতে পারেন 
Route::get('/home/{name?}/{age?}', 'homeController@index');
// কন্ট্রোলার ক্লাস এর কোড 

<?php
 
namespace App\Http\Controllers;
 
use Illuminate\Http\Request;
 
class homeController extends Controller
{
    public function index($name,$age){
        echo "Welcome $name You're $age years old";
    }
 
}

লারাভেল ভিউ :

লারাভেল ভিউ : ইউসার যা ডিসপ্লে তে দেখবে এবং যার মাদ্ধমে রিকোয়েস্ট পাঠাবে এবং বিভিন্ন কাজ করবে তা হলো ভিউ :
Laravel route এর মাধ্যমে view folder এর যেকোনো file display করা :
প্রথমে আমরা resources/views/ ফোল্ডার এর মধ্যে hello.php নামে একটি file তৈরী করি। এবং সেই ফাইল এ নিচের code গুলো দিবো।আমরা চাইলে ভিউ ফাইলটিকে blade এক্সটেনশন দিয়েও সেভ করতে পারি same কাজ করবে।

<!doctype html>
<html>
    <head>
        <meta charset="utf-8">
        <meta http-equiv="X-UA-Compatible" content="IE=edge">
        <meta name="viewport" content="width=device-width, initial-scale=1">
 
        <title>Laravel</title>
 
        <!-- Fonts -->
        <link href="https://fonts.googleapis.com/css?family=Raleway:100,600" rel="stylesheet" type="text/css">
 
        <!-- Styles -->
        <style>
            html, body {
                background-color: #fff;
                color: #636b6f;
                font-family: 'Raleway', sans-serif;
                font-weight: 100;
                height: 100vh;
                margin: 0;
            }
 
            .title {
                font-size: 26px;
            }
 
             
            .m-b-md {
                margin-bottom: 30px;
            }
        </style>
    </head>
    <body>
         
 
            <div class="content">
                <div class="title m-b-md">
                    <center>Welcome to Laravel World</center>
                </div>
            </div>
    </body>
</html>

এই hello.php file টি ব্রাউজার দেখানোর জন্য একটা route লিখব , নিম্নের কোডটি routes/web.php তে লিখুন :
Route::get('/hello', function (){ return view("hello"); });

লারাভেল Middleware

Laravel Framework এ Middleware হচ্ছে আপনার application এ বিভিন্ন সোর্স থেকে আসা HTTP request গুলোকে controller এ পাঠানোর আগে filtering করার একটা দুর্দান্ত Mechanism বা পদ্ধতি। ধরুন Laravel authentication Middleware এর কথাই ধরা যাক, যখন আপনার application এ কোনো user লগইন করতে চায়, সেক্ষেত্রে Laravel authentication Middleware কাজ হচ্ছে যেই user লগইন করতে চায় , তাকে authentication Middleware নিজে Middle Man হিসেবে verify করবে , যদি ইউজার authenticated না হয় , তাহলে Laravel authentication Middleware সেই user কে login screen এ পাঠাবে , আর যদি authenticated হন, তাহলে laravel authentication Middleware ইউজারকে পরবর্তী কাজ করার বা পরবর্তী ধাপে যাওয়ার অনুমতি প্রধান করবে। সহজ ভাবে বলা যায় , আপনার application এ যেকোনো request এর পর এবং response এর পূর্বে সব ধরণের verification এবং authentication করার Mechanism হচ্ছে Laravel Middleware. Laravel এ Middleware ফাইল গুলা app/Http/Middleware এই ডিরেক্টরিতে রাখতে হয়।

কিভাবে Middleware তৈরী করা হয় : middleware তৈরী করার জন্য এ নিচের কমান্ডটি রান করুন 
// এখানে checkage মিডলওয়ার এর নাম
php artisan make:middleware CheckAge

আপনার app/Http/Middleware ফোল্ডারে checkAge নামে একটা middleware তৈরী হয়েগেছে
নতুন CheckAge Middleware রেজিস্ট্রেশন : নতুন checkAge Middleware নিয়ে কাজ করতে হলে আপনাকে app/Http/kernel.php file এ এটিকে রেজিস্টার করে দিতে হবে , ঠিক নিচের মতো :

protected $routeMiddleware = [
        'auth' => \Illuminate\Auth\Middleware\Authenticate::class,
        'auth.basic' => \Illuminate\Auth\Middleware\AuthenticateWithBasicAuth::class,
        'bindings' => \Illuminate\Routing\Middleware\SubstituteBindings::class,
        'can' => \Illuminate\Auth\Middleware\Authorize::class,
        'guest' => \App\Http\Middleware\RedirectIfAuthenticated::class,
        'throttle' => \Illuminate\Routing\Middleware\ThrottleRequests::class,
        'CheckAge' => \App\Http\Middleware\CheckAge::class,
    ];

লারাভেল প্রজেক্ট লোকাল সার্ভার এ রেখে ডাইরেক্ট লোড করা : আমরা জানি লারাভেল এর প্রজেক্ট php artisan serve এই কম্যান্ড দিয়ে একটি সার্ভার এ রান হয় কিন্তু সরাসরি লোড করার জন্য নিচের পদ্ধতি অবলম্বন করতে হবে।
১. রুট ডিরেক্টরি এর server.php কে index.php করতে হবে public ফোল্ডার এর মধ্যে htaccess ফাইল কে রুট ডিরেক্টরিতে কপি করে আন্তে হবে এরপর config ফোল্ডার এর app.php ফাইল এ application URL এ url লাইন এর নিচে এই কোড লিখবে
‘asset_url’ => env(‘APP_URL’, ‘http://localhost/yourprojectname /public’), এখানে যদি লারাভেল রুট ডিরেক্টরি তে থাকে তাহলে ‘asset_url’ => env(‘APP_URL’, ‘http://localhost/public&#8217;),