React + Laravel

Psiko

Well-known member
  • Mar 10, 2023
    4,609
    4,404
    113
    Arituza
    oka vue ekka neda yanne ?

    oka karanna epa,,ethakota ekata lock wenawa..SPA alternative ekak widihata wage okun oka introduce karala thiyenne..

    mage nam adahasa front end app eka backend eken decouple karala gahanna onei kiyala
    man kiuwe dan karan yana ara kalin widihata karan yanawa .. me video eka passe kaleka thama :yes:
     
    • Like
    Reactions: B.Chat and kolavari

    NEMISIS

    Well-known member
  • Nov 13, 2013
    9,385
    15,102
    113
    Colombo
    not directly related to OP's question
    but
    api kohomada hadana software ekaka (eg: billing system of a pastry shop network like P&S, large system like food city cashiering system) REST API thiyena monolith or REST api Micro service yanawada da kiyala decide karanne?

    primary deciding factor is scalability, and there are lot of other factors like budgets etc.

    for small scale application, if you have a few dozen shops and a few thousands customers, monolithic app would work, mostly a single code base. but lot of problems arise when you want to scale up. you can't scale up single service, you have to scale up the whole thing. there are some strategies you can use to scale up monolithic systems but running cost can be high, and maintainability is low, there are other problems like single point of failures etc. If you are building an application for a business in sri lanka, 70-80% of the time, you would be able get away with a monolithic application.

    Micro service architecture is highly scalable. you have granular level control when scaling. In the real world there will be some services called more often than others, and there will be some services that are rarely used. If you break these in to multiple micro service, you can simply scale up one service as we need it.

    For an example, site like Daraz/Amazon, there will be lot of requests for "Search" and relatively low number of requests for "View profile", if you have micro services, you can simply scale up the Search and View Profile services differently. you can't do that if you have a monolithic application which both services are in a single deployment.

    You have to carefully decide based on scalability/expected number of users etc. for a small business with few branches/shops, monolithic application can be be a better option.
    Both options has its own pros and cons.
     
    Last edited:

    Addin Aiya

    Well-known member
  • Apr 5, 2016
    1,997
    318
    83
    Dekama eketh puluwan wena wenmath puluwan
    Eke karana eka lesi laravel background ekein nm uba ene
    Nathan api eka withark liya ganin react master karala thiyanwanm
    End result eka wena oni smmoth run app
     
    • Like
    • Love
    Reactions: B.Chat and Psiko

    Psiko

    Well-known member
  • Mar 10, 2023
    4,609
    4,404
    113
    Arituza
    Laravel asse gahanne kohomda bn

    Laravel kiyanne server side render wena ekak ne..react eka client eka.

    Hodama de wena wenama gahapan, Laravel api and react front end app eka


    react + laravel connect karala , login , register wade nam karagtta ... Thanks browww :P.... thw thiynw krnna protected routes ghnna onee

    laravel eke backend eka witharak use karankota me interface eka mehemmama thibunaweda? (laravel eke frontend paththa pawichchi wenne nane)

    Backend eka rest api ekak widiyata gahapan.
    React kathawak adala na backend ekata.
    Wenam github repo ekaka dapan.

    Frontend eken rest api eka call karapan. (fetch use karapan, axios danna epa den use karanne na wediya)
    Wenama repo ekaka dapan.
    Fetch use kara :love2::love2::love2::love2:
    ------ Post added on Jan 3, 2024 at 11:05 PM
     

    Software_Eng

    Well-known member
  • Dec 15, 2017
    1,137
    1,188
    113


    react + laravel connect karala , login , register wade nam karagtta ... Thanks browww :P.... thw thiynw krnna protected routes ghnna onee

    laravel eke backend eka witharak use karankota me interface eka mehemmama thibunaweda? (laravel eke frontend paththa pawichchi wenne nane)


    Fetch use kara :love2::love2::love2::love2:
    ------ Post added on Jan 3, 2024 at 11:05 PM

    thawa ona deyak ahapan. uba supiri
     
    • Love
    • Like
    Reactions: Psiko and B.Chat

    kolavari

    Well-known member
  • Aug 11, 2012
    32,790
    1
    24,032
    113
    කැළෑ පොජ්ජේ


    react + laravel connect karala , login , register wade nam karagtta ... Thanks browww :P.... thw thiynw krnna protected routes ghnna onee

    laravel eke backend eka witharak use karankota me interface eka mehemmama thibunaweda? (laravel eke frontend paththa pawichchi wenne nane)


    Fetch use kara :love2::love2::love2::love2:
    ------ Post added on Jan 3, 2024 at 11:05 PM


    Production yana ekak nam ain karala mokak hari ekak dapan...403 ekak wage..

    Nikan uba athal ekata gahana ekak nam echara worry wenna one na adaala nathi nisa
     
    • Like
    Reactions: Psiko and B.Chat

    Shamal3001

    Well-known member
  • Sep 22, 2021
    3,258
    5,993
    113
    oka vue ekka neda yanne ?

    oka karanna epa,,ethakota ekata lock wenawa..SPA alternative ekak widihata wage okun oka introduce karala thiyenne..

    mage nam adahasa front end app eka backend eken decouple karala gahanna onei kiyala
    decouple kalama maintenance lesi ..dev walata patta oluwa kakkumai...screen dekak oni open karan wada karanna...

    anyway ,mata num LARAVEL inertia vue mara lesi .. FULL STACK wage scene ekak..habai ..

    anyway, its depend...taste eka anuwa use karanna puluwan...dekama aulak nehe
     
    • Like
    Reactions: kolavari and Psiko

    Psiko

    Well-known member
  • Mar 10, 2023
    4,609
    4,404
    113
    Arituza
    logout eka fail wenawa


    ayi kiyala balapuwama unauthorized kiyala enne . e kiynne access_token eken authenticated user kenk kiyala detect karagena na kiyana eka neda?


    localstorage ekata save wenna haduwe access_tokens kohoma hri eketh na kiyala neda kiynne methanin



    me thiyenne logout button eka ebuwama user wa ain krn logic eka frontend eke

    JSX:
    const LogoutButton = () => {
    
        const handleLogout = async () => {
            // logic to handle logout
            try {
    
                const accessToken = localStorage.getItem('access_token');
                console.log(accessToken)
    
                if(!accessToken) {
                    console.error('Access token not found')
                    // handle where access token not available
                }
    
                const response = await fetch('http://127.0.0.1:8000/api/logout', {
                    method: 'POST',
                    headers: {
                        'Content-Type': 'application/json',
                        Authorization:  `Bearer ${accessToken}`
                    }
                })
    
                if(response.ok) {
                    console.log('Logout Successful');
                    //  Handle successfull logout or redirect to login page
                } else {
                    console.error('Logout Failed Huththo');
                    // Handlle logout failiure
                }
            } catch (error) {
                console.error('Error during logout', error)
                // Handle unexpected error
                
            }
        }
    
      return (
        <button onClick={handleLogout} >Logout</button>
      )
    }
    
    export default LogoutButton

    me thiyenne laravel backend eke logout dunnama user authenticated da nadda kiyala balana logic eka

    PHP:
    <?php
    
    namespace App\Http\Controllers;
    
    use App\Models\User;
    use Illuminate\Http\Request;
    use Illuminate\Support\Facades\Auth;
    use Illuminate\Support\Facades\Hash;
    use Illuminate\Support\Str;
    
    
    
    class UserController extends Controller
    {
        public function logout(Request $request) {
    
            // Check if user authenticated before logout
            if(auth()->user()){
                auth()->user()->tokens->each(function ($token) {
                    $token->delete();
                } );
            return response()->json([ 'message' => 'Logout Successful' ]);
    
            }
    
            return response()->json(['message' => 'User not authenticated'], 401);
        }
    
        
    
        public function login(Request $request) {
            $request->validate([
                'email' => 'required|email',
                'password' => 'required|string',
            ]);
    
            if(Auth::attempt(['email' => $request->email, 'password' => $request->password  ])) {
                $user = Auth::user();
                $token = $user->createToken('authToken')->accessToken;
    
                return response()->json(['user' => $user, 'access_token' => $token, 'message' => 'Login Successfull']);
    
            }
    
            return response()->json(['message' => 'Login Failed'], 401);
        }
    
        public function register(Request $request)
    {
        $request->validate([
            'name' => 'required|string|max:255',
            'email' => 'required|email|unique:users',
            'password' => 'required|string|min:6',
        ]);
    
        $user = User::create([
            'name' => $request->name,
            'email' => $request->email,
            'password' => Hash::make($request->password),
            'remember_token' => Str::random(10),
        ]);
    
        return response()->json(['user' => $user, 'message' => 'Registration successful'], 201);
    }
    }

    database eke remember_token kiyala table ekk thiyanwa register deddi eka fill wenawa
     

    kolavari

    Well-known member
  • Aug 11, 2012
    32,790
    1
    24,032
    113
    කැළෑ පොජ්ජේ
    decouple kalama maintenance lesi ..dev walata patta oluwa kakkumai...screen dekak oni open karan wada karanna...

    anyway ,mata num LARAVEL inertia vue mara lesi .. FULL STACK wage scene ekak..habai ..

    anyway, its depend...taste eka anuwa use karanna puluwan...dekama aulak nehe

    deployment wage dewal gana hithanna one bn..

    monolith wala thiyena eka drawback ekak ne monawa hari podi change ekakata mulu application ekama build karala, deploy karanna karanna one...downtime ekak thibunoth eka mulu app ekatama effect wenawa :)

    anith de, oyata development teams wena wenama innawa nam front end backend kiyala, hodama de wena wenama yana eka,,ethakota prashna adui,,,deployment ehema lesi,,,

    UI update ekakata API eka down karanna one naha,,API update ekakata UI eka down wenne naha :yes:

    kohomath unath meka ithin design decision ekak,,,eka hithala balala galapena eka thoraganna one..meka thamai harima eka kiyala kohewath naha :)
     

    Shamal3001

    Well-known member
  • Sep 22, 2021
    3,258
    5,993
    113
    deployment wage dewal gana hithanna one bn..

    monolith wala thiyena eka drawback ekak ne monawa hari podi change ekakata mulu application ekama build karala, deploy karanna karanna one...downtime ekak thibunoth eka mulu app ekatama effect wenawa :)

    anith de, oyata development teams wena wenama innawa nam front end backend kiyala, hodama de wena wenama yana eka,,ethakota prashna adui,,,deployment ehema lesi,,,

    UI update ekakata API eka down karanna one naha,,API update ekakata UI eka down wenne naha :yes:

    kohomath unath meka ithin design decision ekak,,,eka hithala balala galapena eka thoraganna one..meka thamai harima eka kiyala kohewath naha :)
    agreed ..
     
    • Like
    Reactions: kolavari

    kolavari

    Well-known member
  • Aug 11, 2012
    32,790
    1
    24,032
    113
    කැළෑ පොජ්ජේ
    not directly related to OP's question
    but
    api kohomada hadana software ekaka (eg: billing system of a pastry shop network like P&S, large system like food city cashiering system) REST API thiyena monolith or REST api Micro service yanawada da kiyala decide karanne?

    I'm not @NEMISIS :P but here's my 2 cents..

    oya okkoma base wenne requirements, budgets anuwa thamai...mokada microservices kiyanne overhead ekak :yes:

    specially uba hithapan uba oya kiyana category eke software ekak nam gahanne, ubata microservices dala waatha wenna wenawa...

    implementation patta amarui,,(transactions track karana ekama amarui services godak athara) okata thiyenawa SAGA , CQRS wage ewa..owa implment karanna efftort eka wadii...:no: (effort eka wadi kiyane, time eka wadii == $$$ ),,

    anith athin deployments walata ehema cost eka wadi..

    godak un mama dakka microservices walin monolith walata maru wela thiyenawa cost eka save karaganna :)

    ubata loku team ekak nattham, monolith walin start karana eka thamai hodama de..mokada eka atthatama fast..(habai drawbacks thiyenawa..deployments ehema kachal ithin,,

    scaling prashna thiyenawa (hithapan, ubage thiyenawa billing service ekak, user service ekak ohoma kiyala,,,nattham order service ekak,,whatever,,,)

    dan oya services walin, atthatama billing service ekata comparatively requests wadi wenna puluwan user service ekata wada...e welawata ubata e service eka witharak scale karanna puluwan,,,

    but monolith ekak ehema karanna ba :no: ( habai mehema ekak thiyenawa,,,ehema welawata ara okkoma monolith eke thiyenna arala, shape eke kalla kalla awashya welaawata microservice widihata gahanna puluwan..okata kiyanne microservice decomposition kiyala..)

    microservices kiyanne kohomath ehema saralwa awata giyata karanna puluwan ekak nemei,,,hariyata study karala, hodata plan karala gahanna one :yes:

    hope it helps!
     

    harshasoon

    Well-known member
  • Feb 4, 2007
    791
    786
    93
    Pluto
    Laravel backend + API use කරලා VUE or React Front End (separate apps) කරන Tutorial එකක් තියේනං share කරන්නකෝ..
     
    • Like
    Reactions: Psiko