Is it possible to have a leaderboard stored in a database without requiring user

I am in the process of developing a game using Javascript that includes a leaderboard feature.

Originally, my plan was to allow players to enter their name and then click a button to start the game.

Since the game includes a countdown timer, I needed a way to save the player's score in two situations:

  1. When the timer runs out and the game ends
  2. When the player answers all questions correctly and completes the game

To save the player's information, I would send an object like this:

{
 name: 'Fred Smith',
 score: 14
}

My concern is whether this approach is feasible without requiring players to create an account through registration or login.

Each time a player participates, they would be submitting a new score and name, for example:

  1. If you set your player name as Bob
  2. After your first game, a new object would be inserted into the database
  3. When you choose to play again, another object with the name Bob and a new score would be posted

Since I am not very experienced with databases, I am unsure if this method would be sustainable in terms of database size, or if there is a more efficient approach that does not involve implementing registration or login functionalities.

Any advice would be greatly appreciated.

javascriptmongodb

Answer №1

To elaborate on the response from @juliancq:

  1. A user's browser loads the game.
  2. It looks for a cookie.
  3. If none is found, a new cookie with a unique ID is created and stored in the browser (potentially with the user's name); if a cookie already exists, it is parsed to retrieve the UID or UID+name.
  4. The user inputs a name (if not retrieved from the cookie).
  5. The user plays the game until the end condition is met.
  6. A POST request is sent to the chosen database.
// JavaScript (CommonJS)
const { v1: uuidv1 } = require("uuid");
const uid = 'uid='.concat(uuidv1());

// The 'SameSite=' parameter may be omitted or set to 'Lax' in some scenarios
// For more information: https://developer.mozilla.org/en-US/docs/web/api/document/cookie

const name = "name_from_form";

document.cookie = `${uid}; SameSite=None; Secure`;
document.cookie = `name=${name}; SameSite=None; Secure`;

const uidCookieValue = document.cookie
  .split("; ")
  .find((row) => row.startsWith("uid="))
  ?.split("=")[1];
const nameCookieValue = document.cookie
  .split(";")
  .find((row) => row.startsWith("name="))
  ?.split("=")[1];

You can access the sandbox here: https://codesandbox.io/s/set-uuid-name-cookies-sw5gt3

P.S. This is a new account, so I am unable to leave comments :)

Answer №2

To ensure each user has a unique identifier, consider assigning a specific ID to each user and saving it as a cookie. This ID can then be utilized for database storage purposes.

Similar questions

If you have not found the answer to your question or you are interested in this topic, then look at other similar questions below or use the search

Dealing with mistakes in a contact form - Finding the correct function

I developed a form using material-ui in React. I am facing some issues with my submit function. I am using a snackbar to notify the user about the successful submission, as well as a snackbar to alert them about missing required fields. The problem arise ...

javascriptreactjsformsmethodsmaterial-ui

Ways to create a fixed top navigation bar that adjusts content similarly to a non-fixed navbar

I'm looking to achieve a fixed navbar at the top that pushes down content when I open the collapse menu, similar to how it functions in static or regular navbars. Something like this example: (https://getbootstrap.com/examples/navbar-static-top/) but ...

javascriptjqueryhtmlcsstwitter-bootstrap

Upload files via Ajax request is required

I am in the process of trying to upload a binary file to a server while avoiding a full page refresh when the server responds. I must admit, I am not well-versed in this area and I understand if my approach needs some adjustments. This is how I have appro ...

javascriptjqueryajax

What are the steps to customize the color of an icon and text when clicked or when hovering over them

I just entered the world of coding and am currently immersed in a project. Right now, I have a side navbar and I'm attempting to change the color of the icon and text when I hover over it or click on a route. For instance, when I click on the Home lin ...

javascriptcssreactjsbootstrap-5styling

Incorporating the non-typescript npm package "pondjs" into Meteor applications using typescript files

Implementing the Pondjs library into my project seemed straightforward at first: meteor npm install --save pondjs However, I'm encountering difficulties when trying to integrate it with my Typescript files. The documentation suggests: In order ...

javascriptmeteortypescriptnpmangular2-meteor

Mongoose JS is unable to display the query value in the output

Is there a way to use mongoose js to create a collection of kittens with specific attributes like {name: "mike"}? Once this document is created, I need to be able to view its value. I've attempted to write the following code: However, I've enco ...

javascriptnode.jsmongodbmongoose

Tips for validating multiple forms on a single page without altering the JavaScript validation structure

My JSP page currently consists of two forms: <body> <form id="1"></form> <form id="2"></form> </body> Only one form is visible at a time when the page is viewed. A JavaScript validation file is used to check the ...

javascriptjqueryhtmlformsjsp

Implementing a callback function in Vue js 2 for handling dispatched actions within a component

Is there a method to determine if the action dispatched from a component has completed without utilizing state management? Currently, I have an action called createAddress. In my component, there is a modal where users input their address. Once the user en ...

javascriptvuejs2vue-componentaxiosvuex

Executing jQuery function through variable reference

My goal is to modify the jQuery function being used based on the value of a switch statement. In this scenario, I want to select the element and then apply the appropriate jQuery function depending on the 'direction' parameter. $('#'+t ...

javascriptjqueryjquery-plugins

Why won't applying a binding style affect the appearance of my Vue component?

const EventLevelBoard = { name: "EventLevel", data: { levelStyle: { display: "block" }, levelStyleinner: [ { display: "block" }, { display: "block" }, { display: "block&qu ...

javascriptcssvue.jsvuejs2vue-component

After using JSON.parse(), backslashes are still present

Recently Updated: Received server data: var receivedData = { "files":[ { "filename": "29f96b40-cca8-11e2-9f83-1561fd356a40.png", "cdnUri":"https://abc.s3.amazonaws.com/" ...

javascriptjqueryjson

Can you explain the purpose of the bson type in conjunction with the javascript/javascriptwithscope?

I am intrigued by the utilization of the two types of bson, specifically javascript and javascriptwithscope, as the foundational types of bson. What are the use cases for these types and how can a javascriptwithscope object be created and saved in mongodb ...

javascriptmongodbbson

React-Query leads to variable becoming undefined upon component update

I'm currently utilizing dnd-beautiful-kit to organize Cards on my platform. Each Card contains specific information, as shown in the video, along with an Avatar component. The Avatar can either display the user's image (if avatarSource exists) or ...

javascriptreactjsdrag-and-dropreact-query

Angular Unordered Query Exploration

I'm currently working on implementing a search feature in my code where I want to filter elements of a list based on user input. The filtering works well if I search for the elements in a specific order. For example, if I search for 'red blue yel ...

javascripthtmlangulartypescript

Verification needed for local passport authentication in progress

I have been working on an authentication application using Node, MongoDB, Passport, Express, and React. Despite spending the last two days trying to resolve an issue, I am still stuck. The problem arises after sending data to the server; the server does no ...

reactjsmongodbexpressauthenticationpassport-local

Discover the secret to incorporating concealed text in WordPress with a hidden div through the power of JavaScript

For a while now, I've been trying to implement a functionality where clicking on a text reveals a dropdown menu with more information, similar to a "read more" feature. I have limited experience in Java or jQuery, and I can't figure out if the i ...

javascriptphpjqueryhtmlwordpress

Sending a parameter value from a blade view in Laravel to a controller: tips and tricks

What is the best way to pass the value "{{$ item-> id}}" to a method in a controller? For example, if we have show.blade.php with the value: "{{$ item-> id}}" In MyController.php, how can we utilize this value within the method: public function ...

javascriptphpajaxlaravellaravel-blade

Wrap each object in a container and then insert its key and values into that container using jQuery

How can I wrap each item and then insert the object's indexes and values into each created wrapper? I've attempted to accomplish this using the following code: $.ajax({ url: "some url", type: "GET", success: function(data) { var data ...

javascriptjquery

Merge data from various fields into a unified array using MongoDB aggregation techniques

I'm currently exploring different aggregation operator combinations that could produce a single array field in the output document containing distinct values from input documents like these: [ { field1: 1, field2: 2 }, { field1: 2, field2: 3 } ] T ...

mongodb

Are you on the lookout for an Angular2 visual form editor or a robust form engine that allows you to effortlessly create forms using a GUI, generator, or centralized configuration

In our development team, we are currently diving into several Angular2< projects. While my colleagues are comfortable coding large forms directly with Typescript and HTML in our Angular 2< projects, I am not completely satisfied with this method. We ...

javascriptangularformstypescript