HTML Online Spiel programmieren, welche Programmiersprachen?

Hallo,

Wir müssen für unser Schulprojekt Stadt Land Fluss programmieren. Es muss Mehrspielerfähig sein und die Zeit auf allen Clients muss synchron seid (z.B. 30 Sekunden bis zum Ende des Spieles). Die Frage ist mit welchen Programmiersprachen bekommen wir dies einfach geregelt? Welche brauchen wir alle?

LG

Was soll das denn für ein Projekt sein, wo anscheinend keiner von euch Ahnung von Programmierung hat? Ihr müsst euch ja auch in die Sprache einarbeiten und dann noch Netzwerk-Fähigkeit implementieren.
Gibts bereits Sprachen, die du/ihr könnt?

javascript mit websockets..

Java, Html, CSS, PHP, Javascript, AJAX. Alle Sprachen sind etwas änhlich, weswegen es für uns kein großes Problem wäre eine neue zu lernen. Die Frage die wir uns stellen ist, welche werden hierfür benötigt? Html, CSS PHP ist klar aber welche für die Mehrspielerverbindung?

Ihr könnt das komplett in Java machen, mehr braucht ihr an sich nicht.

Mehr brauchts nur, wenn es unbedingt im Browser laufen soll

Webanwendungen unterlaufen immer den Client-Server-Prinzip, weswegen du schon per Default ein "Mehrspielerprinzip" hast.

Soll das über Accounts mit Login ablaufen oder kann da einfach nur jeder die Webseite aufmachen und direkt los gehts?

Aber ja, wenn es nicht zwangsweise Web sein soll - reicht Java locker aus

BlackDemo schrieb:

Html, CSS PHP ist klar aber welche für die Mehrspielerverbindung?

Zum Vergrößern anklicken....

Für die "Mehrspielerverbindnung" benötigt man eine gemeinsame Datenhaltung auf die die verschiedenen Requests zurückgreifen können. Da würde sich z.B. eine Datenbank anbieten. Je nach dem was die Programmiersprache bietet kann man da aber evtl. auch im Arbeitsspeicher als Objekte vorhalten (Ich kenns jetzt nur von ASP.NET, aber Java müsste das auch können, bei PHP weiß ich es nicht)

@Jesterfuchs. Du willst eine Datenbank nutzen für die Kommunikation eines 5-minütigen Spiels? Höchstens, wenn die Spieldaten später noch analysiert werden sollen. Aber für deren "Hausaufgabe" kann man einfach in einer Map im RAM halten. Fertig. Klar, bei PHP wird's etwas schwieriger. Aber mir Java, Node.js, oder .NET ist das ein Kinderspiel.

Wenn ihr nur 1 Sprache lernen wollt, schaut euch Node.js an. Dann könnt ihr Frontend und Backend in JavaScript (oder TypeScript, oder ähnlichem) schreiben. Z.B. mit dem Express Framework. Einfacher kann man eine simple REST API (fast) nicht schreiben: http://expressjs.com/en/starter/hello-world.html

kling1 schrieb:

javascript mit websockets..

Zum Vergrößern anklicken....

Würds auch so lösen.

Es muss auf einem Webserver laufen und eine Verbindung zwischen Client und Server bestehen, das sind die Voraussetzungen.

SqLite ist auch schnell aufgesetzt und würde ja reichen ;-)

Außerhalb von .NET hatte ich halt noch keine Erfahrungen mit sowas, kann daher also schlecht sagen wie einfach das wird. Ne DB geht immer...

Einen Webserver brauchst du so oder so, um das Frontend auszuliefern.

Authentifizierung ist vermutlich unnötig für so ein Schulprojekt. Ich würd's einfach so machen:
1. Nutzer ruft die Seite auf
2. Nutzer sieht ein "Formular" wo er ausschließlich einen Benutzernamen eingeben kann
3. Nutzer sucht sich einen Namen aus und "loggt" sich ein
4. Nutzer sieht eine "Lobby" mit eröffneten, aber nicht gestarteten Spielen
5. Nutzer tritt einem nicht gestarteten Spiel bei oder erstellt ein neues
6. Der Spiel Ersteller startet das Spiel, egal wie viele Mitspieler dabei sind
7. Spielen, spielen, spielen, bis einer gewonnen hat
8. Spiel Ende Bildschirm anzeigen (Spieler X hat gewonnen. Dazu evtl. irgendwelche Statistiken zum Spiel)
9. Wieder zurück in die Lobby

Einen Check auf doppelte Namen kann man machen, muss man aber nicht (wenn jeder Nutzer auf dem Server eine ID zugewiesen bekommt)

Vorsicht bei node.js oder Websocket, da diese neben dem eigentlichen Webserver, was man allgemein so als Webserver kennt (Apache, nginx, ...) einen eigenen Serverprozess auf einen anderen Port laufen lassen müssen. Nichts, was man Online ins Standard-Webhosting-Paket werfen kann. Bei node.js kann man sich den ganzen Webserver sparen,das übernimmt dann die Anwendung komplett. Selbes gilt für eine Anwendung, die vollständig in Java umgesetzt ist.

Wenn das eine Lösung sein muss, die in einer LAMP / WAMP Umgebung laufen muss, muss man Serverseitig etwas in PHP zaubern, was die Spieleclients synchronisiert. Das wird ein ganz schön hässliches Gefummel (ist aber machbar).

Daher die Frage: Was genau ist gemeint mit "Es muss auf einem Webserver laufen"? Es muss auf einen Webserver laufen, der vorgegeben ist und auf dem man keine weiteren Prozesse starten darf (klassisches Webhosting) oder es muss auf einem Webserver laufen, auf den man auch eigene node.js Instanzen starten darf?

Grüße

Wir haben einen extra vServer für das Projekt, den wir für alles und voll benutzen dürfen.

Dann würde ich erst Recht (der Einfachheit halber) auf Node.js + Express für's Backend setzen.

Das Frontend dann wie ihr wollt in React, Angular, Vue, jQuery, reinem JavaScript, oder meinetwegen auch nur stumpfe HTML Formulare.

Vor- und Nachteile:
- React: Ziemlich einfaches Komponenten-basiertes Framework. Von Facebook. Leider muss man sich (falls man was braucht) alle Bibliotheken von Hand zusammen suchen
- Angular: Deutlich komplexer als React. Von Google. Dafür bekommt man alle Bibliotheken die man braucht aus einer Hand
- Vue: So ein Mittelding zwischen React und Angular
- jQuery: Old School dafür sehr einfach. Für sauberen Code braucht's dann aber schon einiges an Erfahrung. Aber bei so einem kleinen Projekt spielt das keine wirkliche Rolle
- Reines JavaScript: Grundsätzlich nicht zu empfehlen, außer man weiß ganz genau was man tut. Dann lieber gleich jQuery, wenn man minimalistisch bleiben will.
- HTML Formulare: Das ist dann wirklich 90er Style. Extrem einfach, aber auch extrem beschränkt in den Möglichkeiten.

Vielen Dank Lieber benneque , laut unserem Professor soll unsere Priorität auf diee Funktion liegen und Design o.Ä. ist eher zu vernachlässigen und benötigt man nur, wenn wir am Ende noch viel Zeit übrig haben. Wir haben auch nicht vor Registrierung o.ä. zu machen. Einfach eine simple Seite, die einen Link generiert, den man an seinen Freund sendet, der via Klick dann mitspielen kann. Das ist die Anfangsintension. Laut Professor ist unser Schwerpunkt die Zeitsynchronität. Das heißt, dass das Spiel bei Spieler 1 und Spieler 2 gleich seien soll und nicht verschieden. Sobald wir das haben, haben wir einen Meilenstein erreicht.

Du hast bei der Entwicklung mehrere "Probleme" zu lösen (Reihenfolge nicht so wichtig):

1. Wie gestaltest du die Benutzeroberfläche? Also bei euch ist das relativ klar: "irgendwie mit HTML und CSS".

2. Wie reagierst du auf Benutzereingaben (z.B. Klicken von Buttons)? Hier nehmen dir die oben genannten Frameworks viel Arbeit ab und sorgen dafür, dass es in allen Browsern gleich funktioniert. Wenn ihr euch möglichst wenig Arbeit machen wollt, würde ich hier zu jQuery raten.

3. Wie kommunizierst du mit dem Backend? Euch wurde gesagt, dass es in "Echtzeit" passieren soll. Also sollte der Client nicht die Daten vom Server holen, wenn er gerade Lust drauf hat. Sondern der Server sollte die Daten an alle Clients "pushen" so schnell es geht. Hier kann man direkt auf WebSockets (oder alternativ ServerSentEvents+REST) setzen.

4. Wie hält man alles synchon? Damit alles synchron läuft, braucht es einen "Master". Alle anderen passen sich an den Master an. Der Einfachheit halber, sollte man das dem Backend Server überlassen. (Man könnte auch einen Client nehmen, aber das wäre unnötiger Aufwand)

Heißt: Der Master bestimmt wann das Spiel startet und endet und entscheidet auch, welche Eingaben gültig und ungültig sind.

Beispiel: Client1 (= Spieler1) sagt nicht "ich habe die Lösung 2 Sekunden nach Spielstart eingegeben", weil sonst könnte ja jeder Spieler einfach sagen, dass er früher die Lösung hatte und "dass die Netzwerkverbindung schuld ist, dass die Daten erst so spät angekommen sind". In aktuellen Netzwerkspielen nennt man eine schlechte Netzwerkverbindung halt Pech. Die Spielsoftware kümmert sich nicht um solche Fälle.

Also wird es eher so ablaufen: Client1 sagt "hier ist meine Lösung". Der Server überprüft die Lösung. Und wenn vorher noch kein anderer Mitspieler eine korrekte Lösung abgeliefert hat, dann hat Client1 die Runde gewonnen.

Ich habe privat mal an einer Websocket-Implementierung für meine Heimautomatisierung gearbeitet, die XMLRPC-Events empfing und die verarbeiteten Daten via Websocket an ein HTML-Frontend weiterleitete. Das ist quasi Echtzeit und funktionierte sehr gut.

Von der Architektur her würde ich euer Anliegen so umsetzen: (wenn ihr nicht noch zusätzlich MVC oder MVVC Umsetzen wollt/müsst)
Ein Webserver (node / nginx / lighthttpd) liefert das Frontend mit Clientseitigem JavaScript für die E/A Behandlung. Eingaben senden, Ausgaben darstellen. Da der Fokus ja eher auf der Datenverarbeitung und weniger auf bunten Knöpfen liegt, würde ich da etwas sehr schlankes einsetzen: vue.js.

Ein Spieleserver (Websocket) liefert die Spielewelt und verarbeitet die von den Clients getätigten Eingaben (JSON) und erzeugt die Ausgaben (JSON).

Für die Evolution würde ich empfehlen zunächst einen lauffähigen Echo-Bot aufzusetzen, den man dann zum Multi-Client-Chatserver erweitert um daraus dann das Spiel zu erstellen.

Frontend: vue.js + html5 + css3
Spieleserver: node.js (+ diverse node module, die es zu finden gilt + ES6)