Prices are at the end of description field in "Comic" Table

[WillBridge0789]

Trying to show a price for each of the comics when rendered, however, the price is at the end of the comic description.

[emberborja]

This is a website that is a good resource for regex. I put in one of the comic descriptions in order to create a regex that can find a price within the larger text of the description.

https://regex101.com/r/lrmDRy/1

The good thing about that site is that if you hover over a rule it will show you what it does. You can also use the built in tools of the site to figure out what the different symbols in regex do and what is available.

[$]\d+[.]\d\d => this code looks like a literal $ symbol because it is wrapped in brackets "[$]", followed by a digit [0-9] match "\d", the "+" says 0-many of what it trails, so in this case it means $ followed by any number of digits. After any number of digits it will look for a period "[.]" and then it will try to match on exactly two digits.

You can play around with the data on that site and see what makes the regex break so you can account for edge cases.

For example, it will match on this => $19.99. It will find that out of the text and return what it matched. It can handle a comic that is hundred of dollars, but it will fail on this $19,000.99 and would fail on this $19.

You have ownership of your data so you can format it to be however you want. Making assumptions about your data means you can write less code on the frontend and it could result in code that is more performant.

[emberborja]

This is some handy documentation that explains reges: https://developer.mozilla.org/en-US/docs/Web/JavaScript/Guide/Regular_expressions https://developer.mozilla.org/en-US/docs/Web/JavaScript/Guide/Regular_expressions/Cheatsheet

[emberborja]

The regex could be used to determine price programmatically at render, for each comic. That would be a drain on performance. There are several approaches you can take to improve that though.

• You could pull the list of comics out of your component state and into your global context. There, you perform the data manipulation as you see fit with every request to the comics API.
• You could paginate the API request so that you return fewer comics in any given request. That would require you to modify your comics API endpoint to include a skip and take parameter. example: https://ignaciochiazzo.medium.com/paginating-requests-in-apis-d4883d4c1c4c
• You could virtualize your comics list so that you perform the regular expression on a small subset of comics as they come in and out of view. example: https://legacy.reactjs.org/docs/optimizing-performance.html#virtualize-long-lists