Welcome to the Data-Driven U.I. Components talk at DevCon6

This project contains the code for the talk given on Day 2 of DevCon6 2022, with the examples for both approaches presented in the conference i.e. Static and Dynamic.

For a quick gist, in this talk, we have discussed the orthodox approach of writing the U.I. components statically then, move on to discuss the need for a Data-Driven approach, and how we can implement it using metadata (data that will lead U.I. to render components as defined by the B.E. instead of hard-coding them on F.E.), benefits of using it and things to watch out for.

You can find the complete Day 2 of the conference here at DevCon6 youtube channel

Here are the slides

Development 👨‍💻

This repo is implemented as a basic mono-repo so, code for both frontend and backend is present inside the same repo. To start development, we need to start both B.E. and F.E. servers. This project is created using node.js so, you should have node.js installed on your system before proceeding further.

Start B.E. Server

We need to install the dependencies then start the server. You need to open the terminal of your choice and run the following command.

cd backend && npm install && npm start

Start F.E. Server

After the B.E. server has been started, then we can start the frontend server, again we need to install the dependencies then start the server, you need to open another instance of the terminal (at project root) of your choice and run the following command.

cd frontend && npm install && npm run serve

Thanks for visiting here 🙏

I encourage you to learn and collaborate

If you have any queries or suggestions or just wanted to say Hey 👋 you can find me at @asadkhalid305