[newbie] VueJS + PHP Calendar

Hey guys,

I'm a newbie when it comes to VueJS but the best way to learn anything is to build projects. And btw. I'm not using Laravel but vanilla PHP.

I'm working on a project that has a calendar. Each user will have their own. The data in the calendar would be populated from a MySQL database. When the user changes the date, the data inside the calendar also changes. All of this without refreshing the page.

All I need is to understand the logic, how this would work. I don't want long code snippets.

From what I understand, I would have to convert the data retrieved from MySQL database using PHP, into a JSON format so that Vue can read it.

Would anyone help me try to figure out how I would go about displaying the data from MySQL database inside the Vue calendar? So like, when I change the date, the data that corresponds to that date also is displayed from the DB. I don't have any code at the moment, I'm firstly trying to understand the logic.

Thanks

tomasz.r

9 years ago

Level 5

You would need some kind of API. Something like /api/{user}/calendar/{date}. This should return JSON with your corresponding data. You should also use authorization, so a user can access only the data that belongs to him.

On the Vue side, you of course would need to render a calendar with all the dates needed. Then, after a date is clicked, you fire an AJAX call matching that date, retrieve the response JSON, put it into a variable and display it to the user.

Please or to participate in this conversation.