[HN Gopher] How I built currency conversion tooltips
___________________________________________________________________
How I built currency conversion tooltips
Author : nicbou
Score : 59 points
Date : 2022-11-24 17:23 UTC (1 days ago)
(HTM) web link (nicolasbouliane.com)
(TXT) w3m dump (nicolasbouliane.com)
| philw_ wrote:
| > I often have an unreliable internet connection on the U-Bahn,
| in hotels, in developing countries, and in Brandenburg
|
| :D
|
| It'd be nice to add a `tabindex` value and add a `:focus` part to
| the tooltip CSS to make it appear for users navigating via their
| keyboard rather than mouse. If you look up 'accessible tooltips'
| there might be a few other tips.
| netsharc wrote:
| Some parts feel over-engineered, do you really need the most
| current rates, it's not like many currencies fluctuate wildly,
| unless you want to show crypto values. And people dealing with
| currencies know between them reading the info and the time they
| need to pay, the number might be different. Also their bank might
| have a different rate. So it seems like it's precision when a ~2%
| imprecision is good enough.
|
| And needing to mouse-over all the numbers would annoy me quickly.
| Here's the peanut gallery suggestion: just like many sites have a
| language dropdown, add a dropdown to select the secondary
| currenc(ies), and all monetary values would then be displayed as
| e.g. "EUR175 (PS150.05, $182.02)"
| lloydatkinson wrote:
| That looks useful. I also built something kind of similar for
| currencies that I care about as well quite recently.
|
| https://www.lloydatkinson.net/posts/2022/tiny-projects-curre...
| nicbou wrote:
| I like your website. This design makes reading very pleasant.
| lloydatkinson wrote:
| Thank you! I'm glad to hear that, can't always tell when it's
| something I'm making compared to someone seeing it for the
| first time.
| gchq-7703 wrote:
| > I want to cache a guide until it changes, but update the
| exchange rates every few hours.
|
| We've found that NextJS's Incremental Static Regeneration[0] hits
| the sweet spot for when we have needed to do this. Specifying a
| regeneration time allows us to say 'this data can be at most X
| seconds old' but if thousands of users hit a URL at once only one
| request is made.
|
| [0] https://nextjs.org/docs/basic-features/data-
| fetching/increme...
| nicbou wrote:
| I think that the page cache is set to 1 day, and dropping it to
| 12 hours would not strain the server. I'd just save the rates
| to a file on the server, and create a twig filter that wraps
| euro amounts with the exchange rate data. I already do this to
| replace constants (BLUE_CARD_MIN_INCOME) with values from a
| file.
|
| However server-side generation would mean that exchange rates
| are cached along with the page by Google and archive.org. An
| old version of the page would show old exchange rates.
|
| I care a great deal about letting users consume the content
| even if the website goes down, either through archive.org,
| Google Cache, CloudFlare, Pocket or their own archives.
| szemy2 wrote:
| Hey, https://allaboutberlin.com/ is great! Wish I have stumbled
| upon this earlier :)
| MauranKilom wrote:
| > I often have an unreliable internet connection on the U-Bahn,
| in hotels, in developing countries, and in Brandenburg.
|
| Ouch, Brandenburg felt that one!
|
| (Brandenburg is a federal state that is "known" for being quite
| rural and lacking all sorts of infrastructure...)
| nailer wrote:
| > Instead, I check the user's preferred locales in
| navigator.languages, and use that to choose which currencies to
| list.
|
| Old answer: Excellent. That's how it should be done. So many
| people seem to ignore things browsers already tell the server.
| nicbou wrote:
| While the locale implies a country, it does not imply its
| currency. Many people set their conputers to en-US without ever
| living there.
|
| It's a hack in my book, but it's the best hack I could come up
| with.
| masklinn wrote:
| > While the locale implies a country, it does not imply its
| currency. Many people set their computers to en-US without
| ever living there.
|
| And the relation between system and browser language is not
| always simple. For instance Safari on macOS doesn't (seem to)
| reflect all the system-configured languages, it just returns
| the primary (or whatever you configured for safari
| specifically).
|
| So if you habitually configure your system in en (-US or -GB)
| then add your "mother culture" as secondary, won't work,
| you'll get USD or GBP which may mean nothing to your day-to-
| day.
|
| > It's a hack in my book, but it's the best hack I could come
| up with.
|
| Since it's your own site, why not add a `localStorage`
| override?
|
| Obviously it requires additional work (a currency picker UI
| of some sort, and a way to get to it from the tooltip), but
| it should allow users to fix things up when the defaults are
| not right for them.
| nicbou wrote:
| The initial design (on paper) let you choose your currency,
| but I went for something simpler. I like that the tooltips
| just use :hover styling, and could even work without
| JavaScript if I set their value on the server side.
| Something more complex would be a bit more finicky (as are
| the current glossary tooltips).
___________________________________________________________________
(page generated 2022-11-25 23:01 UTC)