What’s the best way to build a sortable, filterable people list?

0
0
Asked By MellowPine47 On

I'm building a small website that displays people in categories such as doctors, firefighters, and lawyers. Clicking a category should show the matching people in a table with fields like name, age, and company. I'd also like to sort the table and add optional tags, such as "eats apples," that can be toggled on or off when filtering results.

There will only be around 100 people, and I'll enter the information manually and update it a few times per month. Right now I'm writing every row directly in HTML, which is becoming difficult to maintain. Should I store the data in a database, JSON file, or something else? I'm especially unsure about the best way to implement the optional tags and filters.

4 Answers

Answered By ByteCedar22 On

A database is also a valid approach, especially if you want to practice building a larger application or eventually add an admin page for editing records. SQLite would be a lightweight starting point, while PostgreSQL is another common option. However, a database means adding a server-side component, so it may be more complexity than this project needs right now. Starting with a simple data structure and upgrading later is perfectly reasonable.

Answered By CrispOtter9 On

For only about 100 manually maintained records, you probably don’t need a database yet. Store the people in a JavaScript array or a people.json file, then use JavaScript to generate the table. Your category buttons can filter the array, the optional tags can be additional filter fields, and Array.sort() can handle sorting by name, age, or company. This keeps the data separate from the page markup, so you only maintain each person’s information once.

MellowPine47 -

That sounds much more manageable. I’m still fairly new to programming, but I’ll look into JavaScript arrays and JSON before jumping into a full database.

Answered By QuietMarble6 On

You can represent tags as data instead of creating separate HTML for every combination. For example, each person could have a profession and a tags list such as ["eats-apples", "works-night-shift"]. When a tag checkbox is enabled, filter out anyone whose tags list doesn’t contain that value. If you keep the existing table structure for now, custom attributes such as data-profession="doctor" and data-tags="eats-apples" can store non-visible metadata on each row.

Answered By SageRaven31 On

Since the records are fictional and this is for learning, privacy regulations are less of a concern. For real people, though, publishing personal details like age and employment information would require careful consideration and possibly legal guidance.

Related Questions

LEAVE A REPLY

Please enter your comment!
Please enter your name here

This site uses Akismet to reduce spam. Learn how your comment data is processed.