jaec86

Systems Engineer at Zeerbyte

Member Since 3 Years Ago

Guayaquil

Experience Points
32,480
Total
Experience

2,520 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
315
Lessons
Completed
Best Reply Awards
1
Best Reply
Awards
  • start-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-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-token Created with Sketch.

    Subscriber

    Earned if you are a paying Laracasts subscriber.

  • lifer-token Created with Sketch.

    Lifer

    Earned if you have a lifetime subscription to Laracasts.

  • lara-evanghelist 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.

Level 7
32,480 XP
May
04
5 months ago
Activity icon

Replied to Restful Api Middleware

You can create your own guard and middleware to handle restful authentication.

Mar
23
6 months ago
Activity icon

Replied to Trouble Editing And Updating An Image..

I may guess you're using PUT to send the request to the Laravel server. There's an issue with PUT requests and multipart/form-data in Symfony. You may try using POST instead.

Mar
08
7 months ago
Activity icon

Replied to [Vue Warn]: Unknown Custom Element - Did You Register The Component Correctly?

@unlikenesses Maybe you can include the code where you use the component to see what exactly is wrong.

Activity icon

Replied to Lucene Search Of Expression In Javascript

I have done this before using computed properties in Vue.

<template>
    <input v-model="serach">
</template>

<script>
    export default {
        data () {
            return {
                events: [
                    { name: 'Some random name' },
                    { name: 'Another weird name' }
                ],
                search: ''
            }
        },
        computed: {
            eventsFiltered () {
                let terms = this.search.toLowerCase().split(' ')
                return this.events.filter(event => {
                    let words = event.name.toLowerCase().split(' ')
                    return terms.every(term => words.some(word => word.includes(term))
                })
            }
        }
    }
</script>

The eventsFiltered property will update every time the search field updates. You may modify it to suit your specific needs. Also you can implement on the input some debounce directive so the update would not trigger after some time has passed.

Sep
14
1 year ago
Activity icon

Replied to Display A Date In A Format And Store It In Other (Datepicker In Laravel)

Adding to @jlrdw answer you can use accesor and mutator in your model.

Aug
05
1 year ago
Activity icon

Replied to Lazy Eager Loaded Relationship Not Included In ToArray()

@staudenmeir Tried it with same and different database. But when I check the test response there is no order_items. Only happens with hasMany relationship, if I load user it is included in the response.

Activity icon

Replied to Lazy Eager Loaded Relationship Not Included In ToArray()

Well after making a fresh install and some tests it appears to work in tinker and making a real request but not working in tests. And I was looking at the response of the test, didn't try it anywhere else yet. Do you know if this is the intended behavior on testing? @Cronix

Aug
04
1 year ago
Activity icon

Replied to Lazy Eager Loaded Relationship Not Included In ToArray()

@Cronix no it doesn’t work either. I’ll try to reproduce it with a fresh install. Maybe is something else in my code that I’m not aware of.

Activity icon

Replied to Lazy Eager Loaded Relationship Not Included In ToArray()

@Cronix I can't see any difference between what I have with what you have. The best solution I could found for now is using append().

Activity icon

Replied to Lazy Eager Loaded Relationship Not Included In ToArray()

@Cronix sorry my bad. I tried before returning the response inside the dd() that is commented.

Activity icon

Replied to Lazy Eager Loaded Relationship Not Included In ToArray()

@Cronix Thanks for your suggestion but I already tried toArray(), that's why is in the title. And actually I think that's the problem. @staudenmeir My Laravel version is 5.6.

Activity icon

Started a new conversation Lazy Eager Loaded Relationship Not Included In ToArray()

I have an Order model

class Order extends Model
{
    public function user()
    {
        return $this->belongsTo(User::class);
    }
    
    public function orderItems()
    {
        return $this->hasMany(OrderItem::class);
    }
}

Also have an OrderItem model

class OrderItem extends Model
{
    public function order()
    {
        return $this->belongsTo(Order::class);
    }
}

And finally an Order Controller

class OrderController extends Controller
{
    public function show(Order $order)
    {
        $order->load('orderItems');
        // dd($order)
        return response()->json([
            'message' => 'We found your order.',
            'order' => $order
        ]);
    }
}

The problem I have is that order items are not included in the response. If I dd() the order before the response it already has the order items loaded. Also the order is related with user model and when I load the user it appears on the response. It's not loading only the order items. I also tried using makeVisible('orderItems') but the items are not included. I know I'm missing something but can't find out what the problem is. I appreciate your help.

Jul
03
1 year ago
Activity icon

Replied to Hosting Vue JS Project, 'no Input File Specified' On Reload

Laravel Forge by default looks for index.php in the root directory, so you need to change it to look for index.html. You can edit the nginx config file yourself in forge, at the end of the "app" section there is a "files" button. You should replace:

location / {
    try_files $uri $uri/ /index.php?$query_string;
}

for the following:

location / {
    try_files $uri $uri/ /index.html;
}

I'm currently using this configuration and it's working. Let me know if it worked for you.

Apr
16
1 year ago
Activity icon

Replied to How Do I Use Symfony's DomCrawler In Laravel?

I used this package before, you should give it a try https://github.com/dweidner/laravel-goutte

Feb
24
1 year ago
Activity icon

Replied to Intervention Image Orientation Taken By IPhone

You have to check EXIF meta data to see orientation. Usually I use some vue component to handle this for me like https://github.com/alessiomaffeis/vue-picture-input

Feb
15
1 year ago
Activity icon

Replied to How To Avoid Error That Non-static Model Method Should Not Be Called Statically

I don’t think you need a wrapper method in your model. Keep using increment method.

If you really want to use a wrapper method you shoul change Item::increment for $this->increment

May
09
2 years ago
Activity icon

Replied to How Do I Handle Login/registration And Sessions With Vue-router And Axios For An SPA

I was playing around with laravel and vue and made a small project to get started with spa auth. You can check it https://bitbucket.org/zeerbyte/laravelvue.

As I said, I was playing around and rewrote the auth process of laravel to use api_token. It does not include jwt, but it shouldn't be a big issue to add it. Hope it helps.

Activity icon

Replied to Vue Router And Social Sharing

@JillzTom That's exactly what I did with a couple of rewrite rules on .htaccess file and it works just fine.

May
05
2 years ago
Activity icon

Started a new conversation Vue Router And Social Sharing

I made a blog as SPA with Vue. Everything is working find but now I have to share with facebook and twitter every article that is published. The problem is that the route after the hash '#' is not considered as part of the URL and both facebook and twitter remove it. How can I solve this?

Apr
08
2 years ago
Activity icon

Replied to Access Parent Component Data From The Nested Child Component

I don't know it is the best way, but when I have to access a component (which is not the parent) from component that is deep nested I use reference.

Following the example from @Abi

root first ref="frist" second ref="second" third ref="third"

You can access the first component from the third component with:

this.$root.$refs.first.data_you_want

Mar
27
2 years ago
Activity icon

Replied to Reactivity Not Working - Can't Figure It Out

You have filteredData, which is a filtered result from origData. I guess origData is where your records are, so you should add a isDisabled field for every record. This way you won't be disabling every button on every row, and you can acces it in the loop with entry.isDisabled

Activity icon

Replied to Vue Components

You should add some code in order to understand the error

Mar
13
2 years ago
Activity icon

Replied to Vuejs Autocomplete

I made a small component to do this, it's not perfect but it worked for me. I use this component for address autocomplete with google places api.

<template>
    <div class="input-field" :class="{ 'is-focused': isFocused, 'has-value': value !== '' }">
        <label>{{ label }}</label>
        <input type="text" :name="name" v-model="value" @focus="isFocused = true" @blur="isFocused = false" @input="getAddress" @keydown="selectItem">
        <div class="error" :class="{ 'is-visible': error !== '' }">{{ error }}</div>
        <div class="dropdown" :class="{ 'is-visible': isFocused }">
            <div class="loader1" v-if="isLoading">
                <div class="bounce1"></div>
                <div class="bounce2"></div>
                <div class="bounce3"></div>
            </div>
            <div class="dropdown-item" v-for="(item, index) in items"
            :class="{ 'is-selected': isSelected === index }"
            @mouseover="onMouseover(index)"
            @click="setItem(index)">{{ item.label }}</div>
        </div>
    </div>
</template>

<script>
    export default {
        data() {
            return {
                items: [],
                error: '',
                isFocused: false,
                isLoading: false,
                isSelected: -1,
                value: this.default
            }
        },
        props: {
            default: {
                type: [String, Number],
                default: ''
            },
            label: {
                type: String,
                required: true
            },
            name: {
                type: String,
                required: true
            },
            type: {
                type: String,
                default: 'text'
            }
        },
        methods: {
            getAddress() {
                this.error = '';
                this.items = [];
                this.isLoading = true;
                var search = new google.maps.places.AutocompleteService();
                var request = {
                    input: this.value,
                    location: new google.maps.LatLng({lat: -2.18333333, lng: -79.883333}),
                    radius: 10000,
                    componentRestrictions: {country: 'ec'}
                };
                if (this.value !== '') {
                    search.getPlacePredictions(request, (results) => {
                        if (results !== null) {
                            this.items = [];
                            _.forEach(results, (address, key) => {
                                this.items.push({
                                    label: address.description,
                                    value: address.description,
                                    place_id: address.place_id
                                });
                            });
                        }
                        this.isLoading = false;
                    });
                } else {
                    this.isLoading = false;
                }
            },
            getPlaceIdCoords(placeId) {
                let geocoder = new google.maps.Geocoder;
                let myComponent = this;
                geocoder.geocode({'placeId': placeId}, function(results, status) {
                    let coords = {lat: results[0].geometry.location.lat(), lng: results[0].geometry.location.lng()}
                    myComponent.$parent.$refs.map.marker.setPosition(coords);
                    myComponent.$parent.$refs.map.map.panTo(coords)
                });
            },
            onMouseover(index) {
                this.isSelected = index;
            },
            selectItem(event) {
                if (event.keyCode === 13) {
                    event.preventDefault();
                    if (this.isSelected !== -1) {
                        this.setItem(this.isSelected);
                    } else if (this.isSelected === -1 && this.items.length) {
                        this.setItem(0);
                    }
                } else if (event.keyCode === 27) {
                    event.preventDefault();
                    document.querySelector('input[name="' + this.name + '"]').blur();
                } else if (event.keyCode === 38) {
                    event.preventDefault();
                    if (this.isSelected >= 1) this.isSelected -= 1;
                } else if (event.keyCode === 40) {
                    event.preventDefault();
                    if (this.isSelected < this.items.length - 1) this.isSelected += 1;
                }
            },
            setItem(index) {
                var selectedItem = this.items[index];
                this.isSelected = 0;
                this.items = [selectedItem];
                this.value = selectedItem.label;
                document.querySelector('input[name="' + this.name + '"]').blur();
                this.getPlaceIdCoords(selectedItem.place_id);
            }
        }
    }
</script>

The selectItem method is called with keydown event. You just have to include this component and pass at least the required props. Something like:

<autocomplete $refs="plan" label="Plan" name="plan"></autocomplete>