Best approach to render customized content

Hello All,

Long time lurker here, that is finally deciding to take the plunge and learn how to develop web apps with wappler. I do have a question that I am hoping this wonderful community can help me answer. I am working on a custom project management tool, and it should work like this:

  1. Project manager answers a series of questions
  2. Based on the answers, a workflow should be triggered that takes the PM through a sequence of modules
    — There are 40 or so modules, but none of the workflows go through all 40 of them. Sometimes it will be 5, and sometimes it will be 30 modules. Different workflows can and do share some of the modules (e.g. module 1 is mandatory for all workflows).
  3. Each module has its own set of questions, and text. Some modules even are not question and answer based, but it could be configuring a gantt chart, or creating a schedule, etc.

Now here is where I am stuck in my design and planning (and I understand these could be general web design and development questions rather than Wappler specific):

  1. Should I hardcode the mapping between these workflows and modules? Or should this be done with
    some API work, that would query the relevant modules, order of operations, etc.?
  2. For each of the modules, which is better:
    2.1: build the page for each module, with its questions, text, etc. - i.e. a static page
    2.2 build some sort of template, and pull the data from the database? - from what I understand
    about SPAs and dynamic pages, this is how it works, or am I wrong here?

I am just looking for the best performance, and if this has any effect on hosting costs, then I would like to minimize that too.

Thanks in advance for your advice

This is hard to answer because it would depend on how you structure the app. My first reaction is to use server actions.

The latter. I don’t think that there will be thousands of records for the data. In that case, I would pull all of the data from the database and manipulate it on the client.

The way that I see it, each module is self-contained with questions and mappings. The site would be based on a Node server model. Creating a SPA is very easy when using Node.

1 Like

Thanks for the guidance @ben. So basically I would put all of the text, questions, charting add-on, etc. in the database, and render that content only when necessary via server actions? Apologies if the terminology is not clear, I am still new to all of this.

Yes

No worries, we have all had to go through a similar process.

The problem for me at this stage is the lack of specifics. What I have outlined above is based on a general idea. This may have deviations due to the specifics.

I would suggest that you start with just one module so that you get an idea of how things work and how to go about it. And don’t hesitate to come back here for more assistance

1 Like

Thanks a bunch Ben, I will try with one module in Wappler and I guess that would help me define the specifics further.

Hey - this seemed like a fun little problem to solve so I wrote up the hide/show of sections for you as I would approach it. No promises on it being best practice. :slight_smile:

You can see it in action at https://app.triptakers.travel/sections.php

I’ve attached the code for both the sections.php and also customformatters which you’ll need to access the array. Put the customformatters.js in your js folder.

Sections.zip (1.2 KB)

Here’s the gyst of it.

I created an array that stores your list of modules the project manager should cycle through. This is a simple array at the moment. You can manually change the values in the code to see it working but you’ll want to add/remove to that array based on your questionaire.

There are two variables, var_current_position which stores what index # you’re at in the array and var_current_section which is the section number for the current position.

I then created sections and set them to only show when the var_current_section is for that number.

Finally I made two buttons for Next and Done. They are shown/hidden depending on if var_current_section has a value.

HTH

1 Like