I'm building a small practice website that displays lists of people by profession, such as doctors, firefighters, and lawyers. Selecting a category should show information like each person's name, age, and company in a sortable table. I'd also like to add optional tags, such as "eats apples," that can be toggled to filter the results. There will be around 100 fictional people, and I'll update the list manually a few times a month. Right now I'm writing every row directly in HTML, which is becoming difficult to maintain. Should I store the information in a JavaScript array, a JSON file, or a database? Also, what's a good way to implement the optional tags and sorting?
3 Answers
For only about 100 manually maintained entries, you probably don’t need a database right away. Store the people in a JavaScript array or a people.json file, then use JavaScript to filter, sort, and generate the table. Profession and optional tags can just be properties on each person, and the buttons can apply those filters. This keeps the data separate from the page markup so you aren’t maintaining hundreds of table rows by hand.
A database such as SQLite or PostgreSQL would work if you want to practice server-side programming, add an admin interface, or store larger amounts of changing data. For this small learning project, it may add unnecessary complexity. Start with data, filtering, sorting, and table rendering in the browser, then move the same data structure into SQLite later if you want to learn databases.
Since the entries are fictional and the project is for learning, you can focus on the technical structure. A typical person object might contain a name, profession, age, company, and an array of tags. The interface can combine a profession filter with a tag filter, while JavaScript’s sort function handles fields like name, age, or company.
That makes sense. I’m still a beginner, so starting with a JavaScript array or JSON file sounds less overwhelming, and I can try SQLite after the basic version works.