imissmyarcade

Bored of your studying location? Because same. Search no further because imissmyarcade provides the tools and vibes to help you succeed in your academic and personal life with a retro arcade theme!

Comment

🐸 GitHub Repository

https://github.com/jenellemillison/jenellemillison.github.io

💡Inspiration

Last year with online classes we all missed hearing the noises we would enjoy hearing everyday: people chatting around us, our barista calling out our name, and even the rain tapping on the window while we waited to go to class. We came across imissmycafe and this void was finally filled! We were inspired by imissmycafe and the RowdyHacks 2022 theme and made it retro arcade themed that puts a smile on our faces and motivates us to keep going no matter the adversities or circumstances we may face or go through.

🕹 What it does

Our website imissmyarcade lets the user customize their experience by picking different retro arcade sounds that best fits their mood. The user has the option to use the Pomodoro Technique which helps reduce distractions, maintains energy, manages time, and aids in retention while completing a specific task. The user can also log in to their Google Calendar and get a rundown of their 10 upcoming reminders so they can never miss a deadline! Users can even get to know a little bit about us the developers and connect with us Linkedin!

🛠 How we built it

We built imissmyarcade.tech using HTML and CSS for the front end and JavaScript for the back end. We also utilized Bootstrap for some pre-existing CSS and layout features given the time constraint. The website has a custom domain name from Domain.com and is hosted on GitHub Pages as well as a local server in order to provide Google Calendar Accessibility since GitHub Pages only supports static websites. The Google Calendar API from Google Cloud Platform was utilized in order to feature calendar details on the Timer page, including a list of the 10 most pressing deadlines for a user who logs in using their GMail utilizing OAuth 2.0.

🏗 Challenges we ran into

Building this website challenged each of us as none of us had much experience with JavaScript and 2 of us were still unfamiliar with HTML and CSS. We ran into challenges at the beginning with the layout, specifically the list of sounds because they all had to be clustered together and moved around to fit our website layout. Additionally, our code could be more efficient but there were some functions we struggled with generalizing for all songs to play independently. We then had issues with hosting. No one had previously deployed websites ourselves using GitHub Pages, and we ran into many DNS errors between Domain.com and GitHub Pages. Near the end of the project, we found out GitHub Pages cannot support the Google Calendar API calls, so we had to pivot there as well and host an additional local server. Our persistence in solving these errors was worth while as we learned about website layouts as well as various DNS and hosting errors through solving these issues.

🌟 Accomplishments that we're proud of

We are really proud of the design and layout of our website and that every idea we implemented was functional. We were also proud that we were able to work efficiently and communicate our responsibilities and confusions concisely.

🌱 What we learned

We learned JavaScript, HTML, CSS, Bootstrap, and how to collaborate as a group with multiple moving parts especially through the unknowns. Natalie learned about Bootstrap, its classes, and how to lay them out on a web page. Jenelle learned about how to host websites both locally and remotely. Izzy learned how to use JavaScript to embed audio in a webpage stylistically.

🚀 What's next for imissmyarcade

We hope to implement a game that the user can play after completing a Pomodoro session as a reward for their hard work! We would also like to give the user the option to adjust the volume of each sound for a more personalized experience.

+ 3 more
Share this project:

Updates