Create a Calendar Page/(instances of) Meetup List Page

[dgmouris]

Issue

As an Instructor I'm still updating my students via my own methods to let them know of instances of meetups that are happening around town. This was discussed in the slack here

Feature Request

What I'm looking for is a list page that ballpark would look something like below:

As well maybe it would be good to have an overall calendar view if we had this information ballpark like this:

I know that I have some students that are keen about learning about open source and that would be awesome for them to get a bit more involved.

I feel like this could be done either manually or with the meetup API or with a calendar integration with gmail or something like that. Feel free to discuss potential options below.

[MandyMeindersma]

More info:

Most of our meetups use meetup.com and we can pull events from their either using their API (if we pay for it) or maybe there is a FREE way to port their events to google calendar and then pull the google calendar events on the website. I need someone to investigate this.

This might be an old calendar with only events from meet up on it. You might have to change the user number. https://calendar.google.com/calendar/u/0?cid=dnVuanUyNWlwYWZiczkxcW1xdjZudGhtZWdAZ3JvdXAuY2FsZW5kYXIuZ29vZ2xlLmNvbQ @benzittlau manages it. We could add them to this calendar

OR better yet we have a DES events calendar and we should have the meetups on that calendar. https://calendar.google.com/calendar/u/0?cid=ZGV2ZWRtb250b24uY29tXzE4YmZrNzQyajFlYmE5aWR1aDRwN3U0ZmdzQGdyb3VwLmNhbGVuZGFyLmdvb2dsZS5jb20

[dgmouris]

This might be an old calendar with only events from meet up on it. You might have to change the user number. https://calendar.google.com/calendar/u/0?cid=dnVuanUyNWlwYWZiczkxcW1xdjZudGhtZWdAZ3JvdXAuY2FsZW5kYXIuZ29vZ2xlLmNvbQ @benzittlau manages it. We could add them to this calendar
OR better yet we have a DES events calendar and we should have the meetups on that calendar. https://calendar.google.com/calendar/u/0?cid=ZGV2ZWRtb250b24uY29tXzE4YmZrNzQyajFlYmE5aWR1aDRwN3U0ZmdzQGdyb3VwLmNhbGVuZGFyLmdvb2dsZS5jb20

I think this would be a good approach for those students that are interested in building this.

[dgmouris]

Hey my students and I were taking a look at some potential calendars that might be handy for the frontend here and we looked at https://antoniandre.github.io/vue-cal which seems quite promising.

We're still discussing a way to essentially get the events but maybe it could be like the google calendar API discussed above or store it in something like firebase.

It's taking a while to get folks up and running because they're new with view but we'll try to push up something in the next few weeks.

[MandyMeindersma]

Thanks Dan! So exciting!

[keifererikson]

I have starting taking a crack at the front end for the calendar! This is using https://antoniandre.github.io/vue-cal that @dgmouris mentioned above.

This is what I have so far!

Week View:

Month View:

Dark Mode:

Edit: updated photos and a dark mode screenshot

[MandyMeindersma]

I absolutely love this @keifererikson !! Great work!

Which calendar is this pulling data from?

[keifererikson]

Thanks @MandyMeindersma!

Currently I am just using mock data while working on the front end. I believe @dgmouris is working on the backend. But we may be changing how that is implemented so I will let him explain that part of it! 😁

[dgmouris]

@keifererikson that calendar looks really cool!

Also

Which calendar is this pulling data from?

@MandyMeindersma Hopefully @keifererikson and I can work together so that he can pull in the dates from google calendar. Which leads to ask I think you had mentioned someone having the credentials to the google account for DES. If I could please ask who I can ask for those that would be awesome!

[dgmouris]

@keifererikson now that we have merged #343 hopefully we can integrate it with your badass calendar above.

@MandyMeindersma and myself (if you want the help Mandy!) will be hopefully populating this calendar to make it less bare but I think you could make yours into a PR using https://devedmonton.com/api/events now :)

[MandyMeindersma]

oooooh I will always take help :P I tried to look at a way to import events from meetup.com and we might have to pay (there are integrations you pay for and honestly I wouldn't mind "donating" to the project if we need)

I wonder if I posted in #random if anyone would have ideas too

[keifererikson]

@dgmouris That sounds great! I'll make some modifications now that I have some real world data to work with!

[dgmouris]

oooooh I will always take help :P I tried to look at a way to import events from meetup.com and we might have to pay (there are integrations you pay for and honestly I wouldn't mind "donating" to the project if we need)

I think if we click add to calendar it should work but I have to take a deeper look into it I thought it would add it by default for the organizer. In all honesty I haven't downloaded the calendar yet but I will soon and look at potential solutions because this would make it a lot easier for me to discuss this with students.

[dgmouris]

@MandyMeindersma @arashsheyda do you folks know if we have development previews for PRs on the site?

I think it this would be super helpful for a PR like #346

[arashsheyda]

@dgmouris there is a preview link: netlify/dev-edmonton/deploy-preview but make sure that you don't have any linting errors otherwise it would fail

[dgmouris]

@MandyMeindersma I figured out how to get all of the events in the google calendar and I feel like a goof.

This is going to work perfectly and should have all of the events needed (famous last words)

There might be a couple of issues but I think that's it. I don't think I have access to the calendar itself but it should be quite nice once it's done.

I don't have access to the settings of this but it should have all of the events. Once we do this we should be able to see it in the draft preview here

PS. click the gif below if it's too small.

[MandyMeindersma]

Nice find @dgmouris. I missed it too :P

So there used to be a way that you could like update the events though.

Like right now if I went on meetup and created a new event, it wouldn't be reflected in the google calendar and there used to be a way where it would update. I think that's what the paid services do. I'll look into them more and see if we can do that.

@dgmouris you should have the ability to edit the calendar:

But let me know if it doesn't work. Also @keifererikson let me know if you want to be added too, just send me an email address :)

Either way though I did import the events that we have now.

I wonder if I just set a reminder for myself (or another volunteer on the slack) to update every week and if it would be smart enough to not duplicate the events. I'll try that next week

[dgmouris]

@MandyMeindersma I just wasn't sure if I could affect the settings but I'll take a look at this in a bit :)

I wonder if I just set a reminder for myself (or another volunteer on the slack) to update every week and if it would be smart enough to not duplicate the events. I'll try that next week

Thanks, if it's not maintainable let's take a look at solutions in a bit, thanks @MandyMeindersma!

[MandyMeindersma]

Thank you @keifererikson and @dgmouris

Amazing work!

I have a scheduled message to shout you out tomorrow in the slack!

[keifererikson]

Oh wow thank you so much @MandyMeindersma !

And thank you @dgmouris and @arashsheyda for all the help with everything! This was an amazing experience for me. I hope to continue to contribute, and I'm going to start working on a blog post about my experience with this and I'll post it once I'm done! Thanks again everyone! ❤️

[dgmouris]

This is great folks, huge props to you @keifererikson this was a ton of work.

Now we can build upon awesome calendar, and I don't have to show my students something janky for events!

[MandyMeindersma]

Calendar looks great! Closing this one and we can create another issue if there is anything else we want to add!