Kategori: laravel

vue 2

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
<html>
<head>
    <title>Udemy Vue JS</title>
 
</head>
<body>
<div id="app">
    <div id="form">
        <div class="list">
            <label>Ad Soyad</label>
            <input type="text" v-model="name">
        </div>
        <div class="list">
            <label>Telefon</label>
            <input type="text" v-model="phone">
        </div>
        <div class="list">
            <button @click="newContact">Yeni Ekle</button>
        </div>
    </div>
 
 
 
    <list-component   :data="contacts" ></list-component>
</div>
 
<script src="https://unpkg.com/vue@3/dist/vue.global.js"></script>
<script type="module">
 
 
 
    const { createApp } = Vue;
    const app = createApp({
        data() {
            return {
                name:'',
                phone:'',
                contacts:[]
            };
        },
        methods: {
            newContact() {
                console.log(this.name,this.phone);
                this.contacts.push({name:this.name,phone:this.phone})
                this.name = '',
                this.phone = ''
            },
 
 
        },
    });
 
    app.component('list-component', {
        props:['data'],
        template: '<div><div v-for="(item,index) in data">{{ item.name }} - {{ item.phone }} - <button @click="removeContact(index)">Kaldir</button></div></div>',
        methods: {
            removeContact(index) {
                 this.data.splice(index,1);
            }
        }
    });
 
    app.mount('#app');
 
</script>
</body>
</html>

 

vue 1

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
<html>
<head>
    <title>Udemy Vue JS</title>
 
</head>
<body>
<div id="app">
    {{ message }}
 
    <span v-bind:title="message">ali</span>
    <br>
    <span :title="messagex">ali</span>
    <br>
    <div v-if="isUploaded">Görüntü başarı ile eklendi</div>
    <br>
    <a :href="url">alicancanpolat.com</a>
    <br>
    <div v-if="isProfile">
        <img :src="url">
    </div>
    <br>
    <div v-if="isLoading">
        <div v-for="item in contacts">
            {{ item.name }}
        </div>
    </div>
 
    <p>{{ messageLast }}</p>
    <button @click="changeText">Yazıyı Değiştir</button>
 
    <label>Ad Soyad: {{ textValue }}</label>
    <input type="text" v-model="textValue" placeholder="Ad Soyad Giriniz">
    <button @click="changeName">Ad Değiştir</button>
    <br>
     <item-component v-for="item in contacts" v-bind:data="item" v-bind:key="item.id"></item-component>
</div>
 
<script src="https://unpkg.com/vue@3/dist/vue.global.js"></script>
<script type="module">
 
 
 
    const { createApp } = Vue;
    const app = createApp({
        data() {
            return {
                isUploaded:true,
                isProfile:false,
                message: 'Hello Vue 3.0!',
                messagex: 'Hello Vue 3.12310!',
                url:'https://alicancanpolat.com',
                isLoading:true,
                contacts:[
                    { name: 'ali veli'},
                    { name: 'cafer'},
                    { name: "huseyin"}
                ],
                messageLast: "Merhaba Udemy",
                textValue: "Merhaba Udemy",
                isim: "ali"
            };
        },
        methods: {
            changeText() {
                this.messageLast = "Yeni Mesaj";
            },
            changeName(){
                this.textValue = 'Cec'
            }
        },
        created(){ // başlarken
            console.log(1);
        },
        computed(){ // render işlemi tamamladıktan sonrası
            console.log(2);
        },
        mounted(){ //
            console.log(3);
        },
        watch:{
            textValue(){
                console.log(4)
            }
        }
 
    });
 
    app.component('item-component', {
        props:['data'],
        template: '<li>{{ data.name }}</li>'
    });
 
    app.mount('#app');
 
</script>
</body>
</html>

 

laravel collection create

şimdi laravelde bir User::all(); yaptık ve belli bir biçimde veriler geldi. Bunu diziye çevirdiğimizde aynı şekil kullanamıyordum. Bunu çevirmenin yolunu kendi çapımda buldum. burada subject değişkenini önceden çekilmiş verileri içerir. $subject = User::all() gibi.

1
2
3
4
5
6
7
8
9
$newsubject = new Collection();
        foreach ($subject as $s){
                $newsubject->push((object)[
                    'id' => $s->id
                ]);
            
            $i++;
        }
         $subject = $newsubject;

laravel route api 404 not found

bir api yaparken laravel üzerinde ilgili link üzerinden olmayan bir linke girildiğinde json olarak not found değeri geri döndürmesi için App\Exceptions\Handler.php içine girilmesi gereken kod;

1
2
3
4
5
6
7
8
9
if (strpos($request->getRequestUri(), '/api/', 0) === 0 &&
            get_class($exception) === NotFoundHttpException::class) {
            return response()->json([
                "status" => 'failure',
                "error" => 'Page not found',
                'code' => 404,
                "data" => null
            ], 404);
        }

laravel ajax validation ve error mesajlarını gösterme

controller tarafı böyle. eğer işlem başarılı ise en alta bi de success döndürürsün iş biter.

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
$validator = Validator::make($request->all(), [
            'sender' => ['required'],
            'recipient' => ['required'],
            'account_wallet' => ['required'],  
            'balance' => ['required'],
        ]);
 
        if ($validator->fails()) {
            return response()->json(['errors'=> $validator->errors()->messages()]);
        }
 
        if($request->sender == $request->recipient){
            return response()->json(['errorsv2'=> "farklı bir hata"]);
        }
        if($request->balance < 0){
            return response()->json(['errorsv2'=> "Lütfen rakamı kontrol ediniz"]);
        }
        $user_control = User::find($request->sender);
        if(!$user_control) return response()->json(['errorsv2'=> "Kullanıcı Bulunamadı"]);

view tarafı

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
$("#submit").click(function (){
            $.ajax({
                url: "{{ route("cccccc") }}",
                data: $("#walletform").serialize(),
                type: "POST",
                success: function(answer){
                    if (answer.errors) {
                        $("span[id=myid]").remove();
                        $.each(answer.errors, function (i, error) {
                            var el = $(document).find('[name="' + i + '"]');
                            el.removeClass('is-valid');
                            el.addClass('is-invalid');
                            el.after($('<span id="myid" style="color: red;">' + error[0] + '</span>'));
                        })
                    }else if(answer.errorsv2){
                        swal("Error!", answer.errorsv2, "error");
                    }else if(answer.success){
                        
                        toastr.success('Successful', 'İşlem Başarılı')
                      
                        $('#formid')[0].reset();
                    }
                }
            });
        });

request all insert laravel all update

1
2
3
4
5
6
7
8
$all = $request->except('_token');
    
        $create = CompanyModel::create($all);
        if($create) {
            return redirect()->route('companyList')->with('success','Başarıyla Kaydedildi.');
        } else {
 
        }

1
2
3
4
5
6
7
8
$all = $request->except('_token','company_id');
 
        $create = CompanyModel::find($request->company_id)->update($all);
        if($create) {
            return redirect()->route('companyList')->with('success','Başarıyla Kaydedildi.');
        } else {
 
        }

laravel socket io mesajlaşma uygulaması basic

öncelikle https://www.youtube.com/watch?v=MNf0piqRdHg bu videodan yararlandığımı bildiririm. 2-3 defa kullanım ve videoya dönmemek için kendimce bişiler yazıyorum. ilk defa yapanlar videodan yaparsa iyi olur herkes için.

laravel’i kurduk.
nodejs kurduk. (https://nodejs.org/en/download/)
laravel klasöründe iken terminali açtık ve aşağıdaki kodu yazdık.

1
npm i express

sonra npm socket io kurulumu için;

1
npm install socket.io

ana klasöre server.js adlı bir dosya oluştur. içine aşağıdaki kodları yaz.

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
<!DOCTYPE html>
<html lang="{{ str_replace('_', '-', app()->getLocale()) }}">
    <head>
        <meta charset="utf-8">
        <meta name="viewport" content="width=device-width, initial-scale=1">
 
        <title>Chat App</title>
 
        <!-- Fonts -->
        <link href="https://fonts.googleapis.com/css2?family=Nunito:wght@400;600;700&display=swap" rel="stylesheet">
        <!-- CSS only -->
        <link href="https://cdn.jsdelivr.net/npm/bootstrap@5.1.3/dist/css/bootstrap.min.css" rel="stylesheet" integrity="sha384-1BmE4kWBq78iYhFldvKuhfTAU6auU8tT94WrHftjDbrCEXSU1oBoqyl2QvZ6jIW3" crossorigin="anonymous">
        <!-- JavaScript Bundle with Popper -->
 
    </head>
    <body>
        <script src="https://code.jquery.com/jquery-3.6.0.js" integrity="sha256-H+K7U5CnXl1h5ywQfKtSj8PCmoN9aaq30gDh27Xc0jk=" crossorigin="anonymous"></script>
        <script src="https://cdn.socket.io/4.3.2/socket.io.min.js" integrity="sha384-KAZ4DtjNhLChOB/hxXuKqhMLYvx3b5MlT55xPEiNmREKRzeEm+RVPlTnAn0ajQNs" crossorigin="anonymous"></script>
 
        <div class="container">
            <div class="row">
                <div class="chat-content">
                    <ul>
                        <li>asdasdasdsad</li>
                    </ul>
                </div>
                <div class="chat-box">
                    <div class="chat-input bg-info" id="chatInput" contenteditable=""></div>
                </div>
            </div>
        </div>
        <script>
            $(function (){
                let ip_address = '127.0.0.1';
                let socket_port = '3000';
                let socket = io(ip_address + ':' + socket_port);
 
                let chatInput = $("#chatInput");
                chatInput.keypress(function (e){
                    let message = $(this).html();
 
                    if(e.which === 13 && !e.shiftKey){
                        socket.emit('sendChatToServer',message);
                        chatInput.html('');
                        return false;
                    }
                });
 
                socket.on('sendChatToClient',(message)=>{
                    $('.chat-content ul').append('<li>'+ message +'</li>');
                });
 
            });
        </script>
    </body>
</html>

sonra welcome.blade.php içine aşağıdaki kodları yaz.

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
<!DOCTYPE html>
<html lang="{{ str_replace('_', '-', app()->getLocale()) }}">
    <head>
        <meta charset="utf-8">
        <meta name="viewport" content="width=device-width, initial-scale=1">
 
        <title>Chat App</title>
 
        <!-- Fonts -->
        <link href="https://fonts.googleapis.com/css2?family=Nunito:wght@400;600;700&display=swap" rel="stylesheet">
        <!-- CSS only -->
        <link href="https://cdn.jsdelivr.net/npm/bootstrap@5.1.3/dist/css/bootstrap.min.css" rel="stylesheet" integrity="sha384-1BmE4kWBq78iYhFldvKuhfTAU6auU8tT94WrHftjDbrCEXSU1oBoqyl2QvZ6jIW3" crossorigin="anonymous">
        <!-- JavaScript Bundle with Popper -->
 
    </head>
    <body>
        <script src="https://code.jquery.com/jquery-3.6.0.js" integrity="sha256-H+K7U5CnXl1h5ywQfKtSj8PCmoN9aaq30gDh27Xc0jk=" crossorigin="anonymous"></script>
        <script src="https://cdn.socket.io/4.3.2/socket.io.min.js" integrity="sha384-KAZ4DtjNhLChOB/hxXuKqhMLYvx3b5MlT55xPEiNmREKRzeEm+RVPlTnAn0ajQNs" crossorigin="anonymous"></script>
 
        <div class="container">
            <div class="row">
                <div class="chat-content">
                    <ul>
                        <li>asdasdasdsad</li>
                    </ul>
                </div>
                <div class="chat-box">
                    <div class="chat-input bg-info" id="chatInput" contenteditable=""></div>
                </div>
            </div>
        </div>
        <script>
            $(function (){
                let ip_address = '127.0.0.1';
                let socket_port = '3000';
                let socket = io(ip_address + ':' + socket_port);
 
                let chatInput = $("#chatInput");
                chatInput.keypress(function (e){
                    let message = $(this).html();
 
                    if(e.which === 13 && !e.shiftKey){
                        socket.emit('sendChatToServer',message);
                        chatInput.html('');
                        return false;
                    }
                });
 
                socket.on('sendChatToClient',(message)=>{
                    $('.chat-content ul').append('<li>'+ message +'</li>');
                });
 
            });
        </script>
    </body>
</html>

terminalde en sonra “node server” diyip çalıştır ondan sonra sistemi test et.

laravel 8 auth kurulumu

laravel 6ydı sanırım ondan sonra auth kurulumu biraz değiştirdiler. bootstrap, vue, react gibi işlerle kullanılır diye bir dizi yenilik getirdiler. amk götümüze zor geldiği için en başta isyan etsek de 12131 yıla bizde vue ve react ile kullanırız diye düşünüyorum.

bootstrap için

1
2
3
4
5
composer require laravel/ui
php artisan ui bootstrap
php artisan ui bootstrap --auth
npm install
npm run dev

eğer kendi temanızı kullanacaksınız npm install npm run dev yapmayınız. boş halleri gelsin yeter.