Asynchronous post challenge

・1 min read

You create a website.
It contains 2 text fields, with a single digit number each.

When the user changes the value of a text field, the client transmits the number to a server, asynchronously. No further interaction with the user is required.

As most visitors of the website are mobile users, the client must be able to deal with going offline. When the client comes back online, the values that have not been transmitted so far need to be transmitted.

Optional extra: showing a check mark next to the text field, for successful transmission to the server.

What would be the simplest solution, given you can use only HTML and JavaScript (and JavaScript libraries/frameworks)?

DISCUSSION (12)
 

Vanilla JS: use localStorage to keep the values (in order they were typed), and check when connections is online send the events from the queue. (local storage or indexedDB).

Any offline capable framework like Google Firestore, AWS APPSync ....

 
 
 

I'm a little confused by the problem being posed. Do you need to give the user a confirmation that the async task finished?

 

What I meant In the optional extra: give the user confirmation that the server actually received the data.

So sending is one thing and sufficient in terms of the challenge.
Confirmation of reception by the server would be the cherry on top. Does that help?

 

In more technical terms: setting the check box as a reaction to a HTTP status ok response from the server qualifies for the optional extra.

 
 

App cache, service worker, local storage and Ajax call. I would stick to plain JavaScript.

 
 

Who’s going to be the heroIne who posts code?

Classic DEV Post from Jan 10

What should production CSS look like? Share your layout-to-web workflow

How does I write good CSS?

Bertil Muth
Agile coach and developer

More developers are using dev.to to keep up with industry trends and grow their careers.

Subscribe Now (free forever).