Full-Stack Web Development

This web app is created for a company event, which invited people to share their riddles and collect those riddles in a gallery. As shown in the framework sketch, the web app has 3 major components:

Homepage: Displaying welcome text and event information

Riddle submission page: Allowing user to input their riddle contents, then submit those to the database

Gallery: Retrieving and displaying all the riddles that users submitted, allowing users to switch between random and chronological display mode 

By using PHP and MySQL, a content management system is used to collect, store and display the riddles that users submitted. The database has one table that stores the riddle contents and answers, name of users, ect. If users react to a riddle by clicking the ‘like’ button, then the data is sent to a seperate database table through AJAX. When displaying, the two tables are joined on riddels.id = reactions.riddle_id.