app_dev

Member Since 8 Months Ago

Experience Points
5,290
Total
Experience

4,710 experience to go until the next level!

In case you were wondering, you earn Laracasts experience when you:

  • Complete a lesson — 100pts
  • Create a forum thread — 50pts
  • Reply to a thread — 10pts
  • Leave a reply that is liked — 50pts
  • Receive a "Best Reply" award — 500pts
Lessons Completed
4
Lessons
Completed
Best Reply Awards
1
Best Reply
Awards
  • start your engines Created with Sketch.

    Start Your Engines

    Earned once you have completed your first Laracasts lesson.

  • first-thousand Created with Sketch.

    First Thousand

    Earned once you have earned your first 1000 experience points.

  • 1-year Created with Sketch.

    One Year Member

    Earned when you have been with Laracasts for 1 year.

  • 2-years Created with Sketch.

    Two Year Member

    Earned when you have been with Laracasts for 2 years.

  • 3-years Created with Sketch.

    Three Year Member

    Earned when you have been with Laracasts for 3 years.

  • 4-years Created with Sketch.

    Four Year Member

    Earned when you have been with Laracasts for 4 years.

  • 5-years Created with Sketch.

    Five Year Member

    Earned when you have been with Laracasts for 5 years.

  • school-in-session Created with Sketch.

    School In Session

    Earned when at least one Laracasts series has been fully completed.

  • welcome-newcomer Created with Sketch.

    Welcome To The Community

    Earned after your first post on the Laracasts forum.

  • full-time-student Created with Sketch.

    Full Time Learner

    Earned once 100 Laracasts lessons have been completed.

  • pay-it-forward Created with Sketch.

    Pay It Forward

    Earned once you receive your first "Best Reply" award on the Laracasts forum.

  • subscriber Created with Sketch.

    Subscriber

    Earned if you are a paying Laracasts subscriber.

  • lifer Created with Sketch.

    Lifer

    Earned if you have a lifetime subscription to Laracasts.

  • evangelist Created with Sketch.

    Laracasts Evangelist

    Earned if you share a link to Laracasts on social media. Please email [email protected] with your username and post URL to be awarded this badge.

  • chatty-cathy Created with Sketch.

    Chatty Cathy

    Earned once you have achieved 500 forum replies.

  • lara-veteran Created with Sketch.

    Laracasts Veteran

    Earned once your experience points passes 100,000.

  • 10k-strong Created with Sketch.

    Ten Thousand Strong

    Earned once your experience points hits 10,000.

  • lara-master Created with Sketch.

    Laracasts Master

    Earned once 1000 Laracasts lessons have been completed.

  • laracasts-tutor Created with Sketch.

    Laracasts Tutor

    Earned once your "Best Reply" award count is 100 or more.

  • laracasts-sensei Created with Sketch.

    Laracasts Sensei

    Earned once your experience points passes 1 million.

  • top-50 Created with Sketch.

    Top 50

    Earned once your experience points ranks in the top 50 of all Laracasts users.

  • Community Pillar

    Earned once your experience points ranks in the top 10 of all Laracasts users.

Level 2
5,290 XP
Jan
20
1 day ago
Activity icon

Started a new Conversation How To Start With Laravel Suggestion?

I want to prepare a question-answer system. Show your code and ask about the problem. People who know the answers. How can I get started? It's like a simplified version of Stackoverflow and laracast. Do you know of an application written before?

Jan
18
3 days ago
Activity icon

Replied to VUE Is Regret.

I feel very good. Come on show your project.

Activity icon

Replied to VUE Is Regret.

https://laracasts.com -> Do you think this is a SPA?

Activity icon

Replied to VUE Is Regret.

Come on man. Google uses Jquery in most places. But there is a place where you are right I will not use vue. It's that easy.

Activity icon

Replied to VUE Is Regret.

Ok come on show me a project. theme uniquely coded. with vue ...

Activity icon

Started a new Conversation VUE Is Regret.

He runs the so-called dom. It has nothing to do. Not responsive. Jquery is easier. I stop developing VUE. Laravel and PHP are sufficient. It wastes time. Everything is individually packaged as if the manufacturer has endured a lot of trouble. Fullstack is a complete nuisance for a developer. Sorry Evan You. Rasmus Lerdorf and Taylor Otwell is much better. Ex. Jquery to : $dom.slideUp() but vue to: packet download and import. Bullshit. Nobody can improve the responsive site. You impose on people. VUE you are nothing. If you use VUE, think twice. "Evan You" show me your project that works perfectly. Prove me wrong. But you can't. Because you do not even believe what it produced.

Activity icon

Replied to Vue 2.0 Resize Screen Error

Could you please suggest a method? Vue is not at all suitable for responsive.

Activity icon

Started a new Conversation Vue 2.0 Resize Screen Error


<template>
    <fragment>
    <HEADER v-if="screen"></HEADER>
    <MHEADER v-else></MHEADER>
        <div class="container-fluid viewContainer">
            <router-view></router-view>
        </div>
    <FOOTER></FOOTER>
    </fragment>
</template>
<script>
import HEADER from "./Main/Header.vue"
import FOOTER from "./Main/Footer.vue"
import MHEADER from "./Mobile/mHeader.vue"

export default {
    data () {
      return {
          baseUrl: "https://example.com/",
          screen: this.scWidth()
      }
    },
    components: {
      HEADER,
      FOOTER,
      MHEADER
    },
    beforeCreate(){
        
    },
    created(){
      window.addEventListener("resize", this.myEventHandler);
    },
    beforeMount(){

    },
    mounted(){

    },
    beforeUpdate(){

    },
    updated(){
      
    },
    beforeDestroy(){

    },
    destroyed(){
      window.removeEventListener("resize", this.myEventHandler);
    },
    methods: {
        scWidth(){
          if(window.innerWidth >= 992){
            return true;
          }else{
            return false;
          }
        },
        myEventHandler(e) {
          if(window.innerWidth >= 992){
            this.screen = true;
          }else{
            this.screen = false;
          }
        }
    }
}
</script>

Error;

[Vue warn]: Error in nextTick: "NotFoundError: Failed to execute 'insertBefore' on 'Node': The node before which the new node is to be inserted is not a child of this node."

Jan
17
4 days ago
Activity icon

Started a new Conversation Vue JS 2.0 "div" Single Root Element Remove

How can I delete a single root element. I am using Bootstrap 5 and this is confusing.

Activity icon

Started a new Conversation Where Can I Find Paid Value Components?

I need properly coded vue components. Where can I get them?

Jan
14
1 week ago
Activity icon

Started a new Conversation VUE Screen Size And After Resize Is It Possible To Combine ?

"document ready" and "window.resize".

As you know, we want to develop websites that will work with all screens. Before coding the application, we need to create the main frame. Is it possible to combine the events I have mentioned ?

I want to combine these two events and get the screen width. Then I want to design for bootstrap's breakpoints. So I will have a responsive framework.

        data () {
            return {
                scsize: window.innerWidth, //ready default size
            };
        },

	//event listener component add and remove
        created() {
        window.addEventListener("resize", this.myEventResize);
        },
        destroyed() {
        window.removeEventListener("resize", this.myEventResize);
        },
            myEventResize(e) {
                this.scsize= window.innerWidth; // re-size and data update
            },

This works. But I'm not sure I'm doing it right. Because when I query it with "if" it only acts according to the default value. Whereas I want it to be alive.

Do we have to constantly parse these two events in order for screens to always work responsibly ?

Can't we build our code on it ?

Activity icon

Started a new Conversation Vue JS Change The Value Of The Variable In Data()


        data () {
            return {
		mchck: false;
            };
        },

"this.mchck" variable is recognized outside, not inside. But what is the solution?

		    console.log(this.mchck); //it's good work.
                    $(document).mouseup(function(e) 
                    {
                        var container = $("#menu");
                        
                        if (!container.is(e.target) && container.has(e.target).length === 0) 
                        {
                            container.slideUp();
			    console.log(this.mchck); //loss. tired. not work :( why ?
			    //what i want to do: after slide up this.mchck = true;
                        }
                       
                    });


Jan
07
2 weeks ago
Activity icon

Started a new Conversation Why Is There No "down Allow" In Laravel 8.0?

Command; php artisan down --allow=11.111.5.224

Response; The "--allow" option does not exist.

Jan
06
2 weeks ago
Activity icon

Started a new Conversation What Is Your UI Suggestion For Laravel And Vue?

I am developing e-commerce software. I need a UI for the front end that will speed me up. What do you suggest me? I use vue, vuerouter. I will use Axios for my APIs. Using Bootstrap with vue is a waste of time. Vue compatible UI is required.

Activity icon

Awarded Best Reply on Laravel 9x-dev Jquery Warning!

I found the solution somewhere for those who are curious, friends; https://stackoverflow.com/questions/32498328/how-to-add-jquery-in-laravel-project

But in its most abstract form; npm i -D jquery

Activity icon

Replied to Laravel 9x-dev Jquery Warning!

I found the solution somewhere for those who are curious, friends; https://stackoverflow.com/questions/32498328/how-to-add-jquery-in-laravel-project

But in its most abstract form; npm i -D jquery

Activity icon

Started a new Conversation Laravel 9x-dev Jquery Warning!

My resources/js/app.js

window._ = require('lodash');

/**
 * We'll load jQuery and the Bootstrap jQuery plugin which provides support
 * for JavaScript based Bootstrap features such as modals and tabs. This
 * code may be modified to fit the specific needs of your application.
 */

try {
    window.Popper = require('popper.js').default;
    window.$ = window.jQuery = require('jquery');
    require('bootstrap');
} catch (e) {}

/**
 * We'll load the axios HTTP library which allows us to easily issue requests
 * to our Laravel back-end. This library automatically handles sending the
 * CSRF token as a header based on the value of the "XSRF" token cookie.
 */

window.axios = require('axios');

window.axios.defaults.headers.common['X-Requested-With'] = 'XMLHttpRequest';

/**
 * Echo exposes an expressive API for subscribing to channels and listening
 * for events that are broadcast by Laravel. Echo and event broadcasting
 * allows your team to easily build robust real-time web applications.
 */

// import Echo from 'laravel-echo';

// window.Pusher = require('pusher-js');

// window.Echo = new Echo({
//     broadcaster: 'pusher',
//     key: process.env.MIX_PUSHER_APP_KEY,
//     cluster: process.env.MIX_PUSHER_APP_CLUSTER,
//     forceTLS: true
// });

Mix compile working success but this warning;

WARNING in ./resources/js/bootstrap.js
Module not found: Error: Can't resolve 'jquery' in '/home/example.com/e-commerce/resources/js'
 @ ./resources/js/bootstrap.js
 @ ./resources/js/app.js
 @ multi ./resources/js/app.js ./resources/scss/app.scss ./resources/sass/style.sass

I installed jquery with npm. Still jQuery Why it not find ?

Activity icon

Replied to Why Error ? Laravel 8 Install

@jlrdw @tray2 You are right. But let me give a detail; each website has its own php version. If you are working on the main server like me, change the php version of both the website and CLI.

Activity icon

Replied to Why Error ? Laravel 8 Install

Gives 5.8. Not installed 8.0.

Activity icon

Replied to Why Error ? Laravel 8 Install

"dev-develop" not the project name. A reference to the 8.0 installation. Project name: "e-commerce"

Activity icon

Started a new Conversation Why Error ? Laravel 8 Install

it is use. "composer create-project --prefer-dist laravel/laravel e-commerce dev-develop"

error: "

[InvalidArgumentException]

Could not find package laravel/laravel with version dev-develop in a version installable using your PHP version, PHP extensions and Composer version.

"

But WHY ???

Activity icon

Started a new Conversation Laravel, How Do Control User Roles ?

I want user roles.

admin/moderator/onlogged/offlogged

Is there a document to require which changes ?

I will arrange;

Model file, Migration file,

What other files should I edit ? Can you give me a clue ?

Jan
05
2 weeks ago
Activity icon

Awarded Best Reply on About Github Markdown Syntax For Link Target

@paulmaxos Pre-made. But now seems impossible. In the past, it has been used by bad people in methods such as XSS.

Activity icon

Replied to About Github Markdown Syntax For Link Target

@paulmaxos Pre-made. But now seems impossible. In the past, it has been used by bad people in methods such as XSS.

Activity icon

Replied to About Github Markdown Syntax For Link Target

demo With this suggestion, the page does not open in a new tab. This can be used for the current tab.

Activity icon

Started a new Conversation About Github Markdown Syntax For Link Target

Can users of Github help ?

I want the page to be run in a new tab to view the demo. Here's what I've tried for markdown (README.md) syntax.


Live Demo: [demo](https://example.com){:target="_blank"} //kramdown

Live Demo: [demo](https://example.com){target="_blank"} //markdown

Live Demo: <a href="https://example.com" target="_blank">demo</a> //html

{:target="_blank"} and {target="_blank"} It was marked as plain text by markdown.

I have read some sources. He talks about removing the target attribute. Is this true? Isn't there really a way to run it in new page?

Dec
31
3 weeks ago
Activity icon

Started a new Conversation Where I Find Clear Code Laravel Template ?

Hello dear friends, where can I get clean coded front-end starter templates? It could be VUE. Could be Bootstrap. It may be paid. It can be free. As you know, front-end templates generally don't meet the back-end logic as expected.

Dec
30
3 weeks ago
Activity icon

Started a new Conversation How To Update Bootstrap 5 In Laravel?

Laravel uses bootstrap 4 to start. How do I upgrade to Bootstrap 5.0 ?

Dec
28
3 weeks ago
Activity icon

Started a new Conversation Sidebar Navs Issue.

I am having a problem on responsive. Let's see what a solution you suggest for this situation.

I have a "rezise" method in Vue.

            reziseHandler(e) {
                if(screen.width >= 992){
                    $(".sideTab").show();
                }else if(screen.width <= 991){
                    $(".sideTab").hide();
                }
            }

You know what I'm aiming for here. The screen will enlarge when the screen is resized, ie when the mobile view is turned sideways. For example iPad. According to Bootstrap grid, I need to have the "sidebar" menu displayed again.

There seems to be no problem. But the problem is big. As you know, safari is installed on devices like iPhone. And I detonate the bomb; "Address bar".

My dear friends; this address bar is idiot. Bother! I am rebelling. "APPLE" listen here. Why don't you respect the code we write ? Look at the photo. See it there.

https://imagesharing.com/uploads/20201228/f8e2815cda7533f66ab4332b0e0c9bb059db5746.png

The address bar gets smaller when there is something to scroll on the page. Isn't that a good thing for users? It enlarges the area on the screen.

I think this is unnecessary and complicates the developers' job. This address bar should be fixed small.

And you my friend What do you think about this subject ? Can you offer a solution? What would you do if you were?

Activity icon

Replied to VUE On Run When IOS Safari Web Browser URL Bar Change Status.

I cant believe. There is no solution. There's no way to reduce or pin the address bar size. The only remedy is to change the header from "sticky-top" to "fixed-top".

Dec
25
3 weeks ago
Activity icon

Started a new Conversation VUE On Run When IOS Safari Web Browser URL Bar Change Status.

How to fix it iOS safari web browser URL Bar => Width/Height ?

Because when the "scrool" moves up and down, the "URL Bar" gets smaller and larger. With what technologies is it possible to fix this small?

CSS OR JAVASCR─░PT (VUE / javascript only)

Dec
24
4 weeks ago
Activity icon

Awarded Best Reply on The "Vue Js" Function Is Not Responding At All.

Here is the solution. I do some research. Not the most accurate method. But for now I can use this.

Codes after changes:


<template>
                <li>
                    <a href="#" class="subMenu">Test Link</a>
                        <ul>
                        <li><a href="#">Sub 1</a></li>
                        <li><a href="#">Sub 2</a></li>
                        <li><a href="#">Sub 3</a></li>
                        </ul>
                </li>
</template>

<script>

    export default {

        created() {
        this.$nextTick(() => {
            $(".subMenu").click(function(){
                $(this).parent().children("ul").slideToggle();
            });
        });
        },
        methods: {
		
        },
        computed:{
            baseUrl(){
                return window.Laravel.baseUrl
            }
        },
        mounted: function(){
            
        }

    }
</script>

Activity icon

Replied to The "Vue Js" Function Is Not Responding At All.

Here is the solution. I do some research. Not the most accurate method. But for now I can use this.

Codes after changes:


<template>
                <li>
                    <a href="#" class="subMenu">Test Link</a>
                        <ul>
                        <li><a href="#">Sub 1</a></li>
                        <li><a href="#">Sub 2</a></li>
                        <li><a href="#">Sub 3</a></li>
                        </ul>
                </li>
</template>

<script>

    export default {

        created() {
        this.$nextTick(() => {
            $(".subMenu").click(function(){
                $(this).parent().children("ul").slideToggle();
            });
        });
        },
        methods: {
		
        },
        computed:{
            baseUrl(){
                return window.Laravel.baseUrl
            }
        },
        mounted: function(){
            
        }

    }
</script>

Activity icon

Replied to The "Vue Js" Function Is Not Responding At All.

It can happen. You are still interested. Thank you for that.

Activity icon

Replied to The "Vue Js" Function Is Not Responding At All.

This component "App.vue". Think like index. And ─▒ use vue router. The "handleSubMenu" function is installed by default in the "Mounted" section. So when a click event is triggered on the css class, the "DOM" works as expected. In jquery the selector works correctly. But vue doesn't run this.

Activity icon

Replied to The "Vue Js" Function Is Not Responding At All.

@spyworld I shared the Vue template. How can I explain it more clearly?

Activity icon

Started a new Conversation The "Vue Js" Function Is Not Responding At All.

I'm developing a menu. I've completed the CSS and HTML sections. Now it is necessary to run the "slideToggle" function. But it doesn't react at all. You can check it out below. I think the "this" selector doesn't work properly. "parent" cannot be selected.


<template>
                <li>
                    <a href="#" class="subMenu">Test Link</a>
                        <ul>
                        <li><a href="#">Sub 1</a></li>
                        <li><a href="#">Sub 2</a></li>
                        <li><a href="#">Sub 3</a></li>
                        </ul>
                </li>
</template>

<script>

    export default {
        methods: {
            handleSubMenu(){
                $(".subMenu").click(function(){
                    $(this).parent('ul').slideToggle();
                });
            }
        },
        computed:{
            baseUrl(){
                return window.Laravel.baseUrl
            }
        },
        mounted: function(){
            this.handleSubMenu();
        }

    }
</script>

Dec
18
1 month ago
Activity icon

Started a new Conversation How Do I Get Screen Width On Vue Component ?

How can I get the screen width on "methods" in Vue template ?

    export default {
        methods: {
            handleSearch(){
                //get the screen size. (Always)
            }
        },
        computed:{
            baseUrl(){
                return window.Laravel.baseUrl
            }
        },

    }

Dec
17
1 month ago
Activity icon

Replied to When The Page Is Refreshed, Only The Component Is Refreshed To VUE Router?

Yeah that's bad idea. I guess I should try another way.

Activity icon

Started a new Conversation When The Page Is Refreshed, Only The Component Is Refreshed To VUE Router?

The VUE Router works fine. But can we only refresh the component when the page is refreshed with "F5" or with the browser button? Is this possible ?

Activity icon

Replied to How Does The Component Wait For The Axios Response Before It Is Shown?

Is this the only solution? So is it the shortest solution? Do you have a more creative idea?

Activity icon

Started a new Conversation How Does The Component Wait For The Axios Response Before It Is Shown?

I don't want the component to display without Axios returning the result. How can I do this according to my codes below?

<template>
    <div v-if="auth">
    user component
    </div>
    <div v-else>
    login component
    </div>
</template>
<script>
    export default {
        data: function (){
            return {
                auth: this.initauth
            }
        },
        props: {
            initauth: Boolean
        },
        methods: {
            queryAuthInfos(){
                axios.get('/user-api/authinfos')
                .then(response => this.auth = response.data.auth);
            }
        },
        created(){
            this.queryAuthInfos();
        },
    }
</script>

Activity icon

Replied to Vue Props Directly Error ?

Yes, use data()

Activity icon

Started a new Conversation How Use Vue Page Loading Animation ?

How do I apply transition effects? I tried "vue-progress-path" but it didn't work. I guess I don't know where to put it.

//APP.VUE

<template>

        <p>
            <router-link :to="{ name: 'home' }">Home</router-link> |
            <router-link :to="{ name: 'user' }">User Page</router-link>
        </p>

        <div class="container">
            <router-view></router-view>
        </div>

</template>

<script>

    export default {

        computed:{
            baseUrl(){
                return window.Laravel.baseUrl
            }
        },

    }
</script>

Dec
16
1 month ago
Activity icon

Replied to Laravel Vue Work But Have Error ?

This document could not help.

Activity icon

Started a new Conversation Laravel Vue Work But Have Error ?

How can I fix the error?

<template>
    <div v-if="auth">
    user component
    </div>
    <div v-else>
    login component
    </div>
</template>
<script>
    export default {
        props: {
            auth: Boolean
        },
        methods: {
            queryAuthInfos(){
                axios.get('/user-api/authinfos')
                .then(response => (this.auth = response.data.auth));
            }
        },
        beforeMount(){
            this.queryAuthInfos();
        },
    }
</script>

/*

Console Error;

[Vue warn]: Avoid mutating a prop directly since the value will be overwritten whenever the parent component re-renders. Instead, use a data or computed property based on the prop's value. Prop being mutated: "auth"

found in

---> <User> at resources/js/views/User.vue
       <App> at resources/js/views/App.vue
         <Root>

*/


Activity icon

Replied to Vue Props Directly Error ?

what if there is a build that uses "beforeMount"?

        beforeMount(){
            this.initialpropUpdate();
        },

Activity icon

Started a new Conversation Vue Props Directly Error ?

Why am I getting such an error ?

[Vue warn]: Avoid mutating a prop directly since the value will be overwritten whenever the parent component re-renders. Instead, use a data or computed property based on the prop's value. Prop being mutated: "auth"

found in

---> <User> at resources/js/views/User.vue
       <App> at resources/js/views/App.vue
         <Root>

Activity icon

Started a new Conversation How Do Import Other Template On Vue Template ?

I use laravel to authenticate users. I trust PHP. I'm getting a json response using axios that returns verification pass / fail states. And I am using a vue router. Accordingly, a boolean type of data is returned "true/false". I keep this in a variable in the props part of Vue.

Now I have to write a condition. Can you help me with this? My condition looks like this;

If "props value" == "false" run "login.vue" else "user.vue". How am I going to achieve this? I'm very new to Vue yet.