{"id":4395,"date":"2019-01-17T18:38:12","date_gmt":"2019-01-17T17:38:12","guid":{"rendered":"https:\/\/blog.mi.hdm-stuttgart.de\/?p=4395"},"modified":"2023-06-09T12:06:47","modified_gmt":"2023-06-09T10:06:47","slug":"radcup-a-socialmedia-beerpong-app","status":"publish","type":"post","link":"https:\/\/blog.mi.hdm-stuttgart.de\/index.php\/2019\/01\/17\/radcup-a-socialmedia-beerpong-app\/","title":{"rendered":"Radcup – a socialmedia beerpong App"},"content":{"rendered":"

Written by: Immanuel Haag, Christian M\u00fcller, Marc R\u00fcttler<\/p>\n

\"\"<\/a><\/p>\n

Radcup adds a bit of social media to the well-known game Beerpong. With Radcup the user has the possibility to register or login. Afterwards he can display\/localize already existing games and join them if possible or create new games. As soon as 4 players have joined, the real match can begin on a beerpong table. <\/p>\n\n\n\n\n\n\n

Once the game is finished the host adds the result. All Players have the possibility to evaluate past games in their own statistics. <\/p>\n\n\n\n

Radcup was developed years ago. The backend is based on node.js and the frontend is an ionic hybrid app.<\/p>\n\n\n\n

In the following blog posts, the procedure of transforming the radcup backend is described based on the main topics. <\/p>\n\n\n\n

The main topics are \u201c Part 1 \u2013 Refactoring\u201d, \u201cPart 2 \u2013  Transition into Cloud\u201d and \u201cPart 3 \u2013 Automation of the project-setup with Gitlab CI\/CD\u201d. The project was carried out within the scope of the master-lecture system engineering.<\/p>\n\n\n\n

Radcup Part 1: Refactoring the backend<\/a><\/p>\n\n\n\n

Radcup Part 2: Transition into cloud<\/a><\/p>\n\n\n\n

Radcup Part 3: Automation of the project-setup with GitLab CI\/CD<\/a><\/p>\n\n\n\n

In order to get a better view of the ionic app a few screenshots are shown below:<\/p>\n\n\n\n

\"\"
Landingpage radcup<\/figcaption><\/figure>\n\n\n\n
\n<\/div>\n\n\n\n
\"\"
Login-screen radcup<\/figcaption><\/figure>\n\n\n\n
\n<\/div>\n\n\n\n
\"\"
Game-overview screen<\/figcaption><\/figure>\n\n\n\n
\n<\/div>\n\n\n\n
\"\"
Rules screen<\/figcaption><\/figure>\n\n\n\n
\n<\/div>\n\n\n\n
\"\"
Create new-game screen<\/figcaption><\/figure>\n\n\n\n
\n<\/div>\n\n\n\n
\"\"
New game map-view screen<\/figcaption><\/figure>\n\n\n\n
\n<\/div>\n\n\n\n


<\/p>\n","protected":false},"excerpt":{"rendered":"

Written by: Immanuel Haag, Christian M\u00fcller, Marc R\u00fcttler Radcup adds a bit of social media to the well-known game Beerpong. With Radcup the user has the possibility to register or login. Afterwards he can display\/localize already existing games and join them if possible or create new games. As soon as 4 players have joined, the […]<\/p>\n","protected":false},"author":884,"featured_media":0,"comment_status":"open","ping_status":"closed","sticky":false,"template":"","format":"standard","meta":{"_jetpack_memberships_contains_paid_content":false,"footnotes":""},"categories":[651,2],"tags":[206,7,9,3,97,98,145,129,205,25,201],"ppma_author":[762],"class_list":["post-4395","post","type-post","status-publish","format-standard","hentry","category-system-designs","category-system-engineering","tag-beerpong","tag-cloud","tag-devops","tag-docker","tag-git","tag-gitlab","tag-gitlab-ci","tag-ibm-bluemix","tag-ionic","tag-nodejs","tag-social-media"],"aioseo_notices":[],"jetpack_featured_media_url":"","jetpack-related-posts":[{"id":4405,"url":"https:\/\/blog.mi.hdm-stuttgart.de\/index.php\/2019\/01\/04\/radcup-part-3-automation\/","url_meta":{"origin":4395,"position":0},"title":"Radcup Part 3 – Automation with Gitlab CI\/CD","author":"Immanuel Haag","date":"4. January 2019","format":false,"excerpt":"Written by: Immanuel Haag, Christian M\u00fcller, Marc R\u00fcttler The goal of this blog entry is to automate the previously performed steps. At the end all manual steps should be automated when new code changes are added to the repository. The new version of the backend will be made available in\u2026","rel":"","context":"In "DevOps"","block_context":{"text":"DevOps","link":"https:\/\/blog.mi.hdm-stuttgart.de\/index.php\/category\/scalable-systems\/devops\/"},"img":{"alt_text":"","src":"https:\/\/i0.wp.com\/blog.mi.hdm-stuttgart.de\/wp-content\/uploads\/2019\/01\/Gesamtstruktur-der-Architektur-Kurzform-1.png?resize=350%2C200&ssl=1","width":350,"height":200,"srcset":"https:\/\/i0.wp.com\/blog.mi.hdm-stuttgart.de\/wp-content\/uploads\/2019\/01\/Gesamtstruktur-der-Architektur-Kurzform-1.png?resize=350%2C200&ssl=1 1x, https:\/\/i0.wp.com\/blog.mi.hdm-stuttgart.de\/wp-content\/uploads\/2019\/01\/Gesamtstruktur-der-Architektur-Kurzform-1.png?resize=525%2C300&ssl=1 1.5x, https:\/\/i0.wp.com\/blog.mi.hdm-stuttgart.de\/wp-content\/uploads\/2019\/01\/Gesamtstruktur-der-Architektur-Kurzform-1.png?resize=700%2C400&ssl=1 2x, https:\/\/i0.wp.com\/blog.mi.hdm-stuttgart.de\/wp-content\/uploads\/2019\/01\/Gesamtstruktur-der-Architektur-Kurzform-1.png?resize=1050%2C600&ssl=1 3x"},"classes":[]},{"id":4398,"url":"https:\/\/blog.mi.hdm-stuttgart.de\/index.php\/2019\/01\/17\/radcup-part-1-refactoring\/","url_meta":{"origin":4395,"position":1},"title":"Radcup Part 1 – Refactoring","author":"Immanuel Haag","date":"17. January 2019","format":false,"excerpt":"Written by: Immanuel Haag, Christian M\u00fcller, Marc R\u00fcttler Refactoring the Radcup backend is necessary because it was developed in the year 2015. Step 1: Docker-Setup In order to have a complete project setup, the backend was converted to a Docker-Compose setup. This offers the developers the possibility to always work\u2026","rel":"","context":"In "System Designs"","block_context":{"text":"System Designs","link":"https:\/\/blog.mi.hdm-stuttgart.de\/index.php\/category\/system-designs\/"},"img":{"alt_text":"","src":"https:\/\/i0.wp.com\/blog.mi.hdm-stuttgart.de\/wp-content\/uploads\/2019\/01\/user-by-mail-executed-150x150.png?resize=350%2C200&ssl=1","width":350,"height":200,"srcset":"https:\/\/i0.wp.com\/blog.mi.hdm-stuttgart.de\/wp-content\/uploads\/2019\/01\/user-by-mail-executed-150x150.png?resize=350%2C200&ssl=1 1x, https:\/\/i0.wp.com\/blog.mi.hdm-stuttgart.de\/wp-content\/uploads\/2019\/01\/user-by-mail-executed-150x150.png?resize=525%2C300&ssl=1 1.5x, https:\/\/i0.wp.com\/blog.mi.hdm-stuttgart.de\/wp-content\/uploads\/2019\/01\/user-by-mail-executed-150x150.png?resize=700%2C400&ssl=1 2x, https:\/\/i0.wp.com\/blog.mi.hdm-stuttgart.de\/wp-content\/uploads\/2019\/01\/user-by-mail-executed-150x150.png?resize=1050%2C600&ssl=1 3x, https:\/\/i0.wp.com\/blog.mi.hdm-stuttgart.de\/wp-content\/uploads\/2019\/01\/user-by-mail-executed-150x150.png?resize=1400%2C800&ssl=1 4x"},"classes":[]},{"id":4403,"url":"https:\/\/blog.mi.hdm-stuttgart.de\/index.php\/2019\/01\/17\/radcup-part-2-cloud\/","url_meta":{"origin":4395,"position":2},"title":"Radcup Part 2 – Transition into Cloud","author":"Immanuel Haag","date":"17. January 2019","format":false,"excerpt":"Written by: Immanuel Haag, Christian M\u00fcller, Marc R\u00fcttler Several steps are necessary to transfer the Radcup backend to the cloud and make it accessible to everyone from the outside. These are explained in more detail in the following sections. Step 1: External MongoDB We have decided to use an external\u2026","rel":"","context":"In "System Designs"","block_context":{"text":"System Designs","link":"https:\/\/blog.mi.hdm-stuttgart.de\/index.php\/category\/system-designs\/"},"img":{"alt_text":"","src":"https:\/\/i0.wp.com\/blog.mi.hdm-stuttgart.de\/wp-content\/uploads\/2019\/01\/Screen-Shot-2018-12-29-at-23.56.46.png?resize=350%2C200&ssl=1","width":350,"height":200,"srcset":"https:\/\/i0.wp.com\/blog.mi.hdm-stuttgart.de\/wp-content\/uploads\/2019\/01\/Screen-Shot-2018-12-29-at-23.56.46.png?resize=350%2C200&ssl=1 1x, https:\/\/i0.wp.com\/blog.mi.hdm-stuttgart.de\/wp-content\/uploads\/2019\/01\/Screen-Shot-2018-12-29-at-23.56.46.png?resize=525%2C300&ssl=1 1.5x"},"classes":[]},{"id":3314,"url":"https:\/\/blog.mi.hdm-stuttgart.de\/index.php\/2018\/03\/28\/continuous-integration-deployment-for-a-cross-platform-application-part-1\/","url_meta":{"origin":4395,"position":3},"title":"Continuous Integration & Deployment for a Cross-Platform Application – Part 1","author":"Tobias Eberle, Marco Maisel, Tobias Staib, Mario Walz","date":"28. March 2018","format":false,"excerpt":"When we started the project \"Flora CI\" for the lecture \"System Engineering\", we planned to deal with Continuous Integration. As an important aspect of software engineering all of us have previously been involved in projects where code of developers had to be merged and builds had to be automated somehow.\u2026","rel":"","context":"In "DevOps"","block_context":{"text":"DevOps","link":"https:\/\/blog.mi.hdm-stuttgart.de\/index.php\/category\/scalable-systems\/devops\/"},"img":{"alt_text":"","src":"https:\/\/i0.wp.com\/blog.mi.hdm-stuttgart.de\/wp-content\/uploads\/2018\/03\/flora-app.jpg?resize=350%2C200&ssl=1","width":350,"height":200,"srcset":"https:\/\/i0.wp.com\/blog.mi.hdm-stuttgart.de\/wp-content\/uploads\/2018\/03\/flora-app.jpg?resize=350%2C200&ssl=1 1x, https:\/\/i0.wp.com\/blog.mi.hdm-stuttgart.de\/wp-content\/uploads\/2018\/03\/flora-app.jpg?resize=525%2C300&ssl=1 1.5x, https:\/\/i0.wp.com\/blog.mi.hdm-stuttgart.de\/wp-content\/uploads\/2018\/03\/flora-app.jpg?resize=700%2C400&ssl=1 2x, https:\/\/i0.wp.com\/blog.mi.hdm-stuttgart.de\/wp-content\/uploads\/2018\/03\/flora-app.jpg?resize=1050%2C600&ssl=1 3x, https:\/\/i0.wp.com\/blog.mi.hdm-stuttgart.de\/wp-content\/uploads\/2018\/03\/flora-app.jpg?resize=1400%2C800&ssl=1 4x"},"classes":[]},{"id":7396,"url":"https:\/\/blog.mi.hdm-stuttgart.de\/index.php\/2019\/08\/31\/multiplayer-typescript-application-deploy-on-aws-services\/","url_meta":{"origin":4395,"position":4},"title":"Multiplayer TypeScript Application run on AWS Services","author":"bj009","date":"31. August 2019","format":false,"excerpt":"Daniel Knizia - dk100@hdm-stuttgart.deBenjamin Janzen - bj009@hdm-stuttgart.de The project CatchMe is a location-based multiplayer game for mobile devices. The idea stems from the classic board game Scotland Yard, basically a modern version of hide & seek. You play in a group with up to 5 players outside, where on of\u2026","rel":"","context":"In "Cloud Technologies"","block_context":{"text":"Cloud Technologies","link":"https:\/\/blog.mi.hdm-stuttgart.de\/index.php\/category\/scalable-systems\/cloud-technologies\/"},"img":{"alt_text":"","src":"https:\/\/i0.wp.com\/blog.mi.hdm-stuttgart.de\/wp-content\/uploads\/2019\/08\/variables.png?resize=350%2C200&ssl=1","width":350,"height":200,"srcset":"https:\/\/i0.wp.com\/blog.mi.hdm-stuttgart.de\/wp-content\/uploads\/2019\/08\/variables.png?resize=350%2C200&ssl=1 1x, https:\/\/i0.wp.com\/blog.mi.hdm-stuttgart.de\/wp-content\/uploads\/2019\/08\/variables.png?resize=525%2C300&ssl=1 1.5x, https:\/\/i0.wp.com\/blog.mi.hdm-stuttgart.de\/wp-content\/uploads\/2019\/08\/variables.png?resize=700%2C400&ssl=1 2x"},"classes":[]},{"id":3503,"url":"https:\/\/blog.mi.hdm-stuttgart.de\/index.php\/2018\/03\/30\/ci-cd-with-gitlab-ci-for-a-web-application-part-2\/","url_meta":{"origin":4395,"position":5},"title":"CI\/CD with GitLab CI for a web application – Part 2","author":"Nina Schaaf","date":"30. March 2018","format":false,"excerpt":"GitLab Our first approach was to use the existing GitLab instance of HdM for our project. For them, a shared runner was already defined on which we could run our jobs, so we were able to focus on the CI process itself. This plan worked out at first. We simply\u2026","rel":"","context":"In "DevOps"","block_context":{"text":"DevOps","link":"https:\/\/blog.mi.hdm-stuttgart.de\/index.php\/category\/scalable-systems\/devops\/"},"img":{"alt_text":"Shaky Pipeline GitLab","src":"https:\/\/i0.wp.com\/blog.mi.hdm-stuttgart.de\/wp-content\/uploads\/2018\/03\/pipeline-gitlab-1024x156.png?resize=350%2C200&ssl=1","width":350,"height":200,"srcset":"https:\/\/i0.wp.com\/blog.mi.hdm-stuttgart.de\/wp-content\/uploads\/2018\/03\/pipeline-gitlab-1024x156.png?resize=350%2C200&ssl=1 1x, https:\/\/i0.wp.com\/blog.mi.hdm-stuttgart.de\/wp-content\/uploads\/2018\/03\/pipeline-gitlab-1024x156.png?resize=525%2C300&ssl=1 1.5x"},"classes":[]}],"jetpack_sharing_enabled":true,"authors":[{"term_id":762,"user_id":884,"is_guest":0,"slug":"ih038","display_name":"Immanuel Haag","avatar_url":"https:\/\/secure.gravatar.com\/avatar\/3095f100f75fe977c838303e854bb8cd3ffc7fbf01963610781fcd51bb5a4680?s=96&d=mm&r=g","0":null,"1":"","2":"","3":"","4":"","5":"","6":"","7":"","8":""}],"_links":{"self":[{"href":"https:\/\/blog.mi.hdm-stuttgart.de\/index.php\/wp-json\/wp\/v2\/posts\/4395","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/blog.mi.hdm-stuttgart.de\/index.php\/wp-json\/wp\/v2\/posts"}],"about":[{"href":"https:\/\/blog.mi.hdm-stuttgart.de\/index.php\/wp-json\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"https:\/\/blog.mi.hdm-stuttgart.de\/index.php\/wp-json\/wp\/v2\/users\/884"}],"replies":[{"embeddable":true,"href":"https:\/\/blog.mi.hdm-stuttgart.de\/index.php\/wp-json\/wp\/v2\/comments?post=4395"}],"version-history":[{"count":48,"href":"https:\/\/blog.mi.hdm-stuttgart.de\/index.php\/wp-json\/wp\/v2\/posts\/4395\/revisions"}],"predecessor-version":[{"id":5157,"href":"https:\/\/blog.mi.hdm-stuttgart.de\/index.php\/wp-json\/wp\/v2\/posts\/4395\/revisions\/5157"}],"wp:attachment":[{"href":"https:\/\/blog.mi.hdm-stuttgart.de\/index.php\/wp-json\/wp\/v2\/media?parent=4395"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/blog.mi.hdm-stuttgart.de\/index.php\/wp-json\/wp\/v2\/categories?post=4395"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/blog.mi.hdm-stuttgart.de\/index.php\/wp-json\/wp\/v2\/tags?post=4395"},{"taxonomy":"author","embeddable":true,"href":"https:\/\/blog.mi.hdm-stuttgart.de\/index.php\/wp-json\/wp\/v2\/ppma_author?post=4395"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}