Bro, I suggest you change your channel name to Gold Mine because you have an amazing content please make more tutorials about GrapesJs and FabricJs, you are the first one who makes videos about those topics + RecactJs
Great video's about GrapesJS tou have! Question; How would you handle blocks / components that render dynamic data from the database? For example; A product block. The product block once dragged into the canvas lets users choose the product they want to showcase, and then data from this product will be used when rendering. When actually rendering the page, the product data should always be up to date, thus a database query would be made.
Thank you for the comment. I did that by using axios to fetch data like "Title", and "Description" and populate in real-time blocks in the editor. First, you fetch data into the state, then render blocks. Upon reloading/opening the page that loads content into the editor you need to add a condition to check if the content of the original block has changed, if yes - force to update the block's content. Similarly to how I handle Dynamic Icons - check the video: th-cam.com/video/ovO1kHpm4jc/w-d-xo.html
Just following good practices and design requirements. For example, if you plan to use Column to create Web Content only, you could implement properties based on Flexbox CSS - which will help you create layouts. Personally, I would recommend adding accessibility props like "role", and "tabindex" - in case you build interfaces for web apps - this will enable keyboard support and screen reader support. Feel free to take a look at my custom Flex component: system.blocksin.com/flex might help you to foresee different use cases.
Hi its awesome tutorial i like to know about the binding csv with the grapes js content could show that or any repository or resource to get reference for that
Great tutorial, learning grapejs right now
You're a live saver. I was looking for an easy tutorial for this library since the docs is easy to learn from. ❤❤❤
awesome! thanks
Bro, I suggest you change your channel name to Gold Mine
because you have an amazing content
please make more tutorials about GrapesJs and FabricJs, you are the first one who makes videos about those topics + RecactJs
Great video's about GrapesJS tou have! Question; How would you handle blocks / components that render dynamic data from the database?
For example; A product block. The product block once dragged into the canvas lets users choose the product they want to showcase, and then data from this product will be used when rendering. When actually rendering the page, the product data should always be up to date, thus a database query would be made.
Thank you for the comment. I did that by using axios to fetch data like "Title", and "Description" and populate in real-time blocks in the editor. First, you fetch data into the state, then render blocks. Upon reloading/opening the page that loads content into the editor you need to add a condition to check if the content of the original block has changed, if yes - force to update the block's content. Similarly to how I handle Dynamic Icons - check the video: th-cam.com/video/ovO1kHpm4jc/w-d-xo.html
Awesome content ❤ Do you have any resources to create a custom react column component or in general react components in grapesjs. Thanks in advance
Just following good practices and design requirements. For example, if you plan to use Column to create Web Content only, you could implement properties based on Flexbox CSS - which will help you create layouts. Personally, I would recommend adding accessibility props like "role", and "tabindex" - in case you build interfaces for web apps - this will enable keyboard support and screen reader support. Feel free to take a look at my custom Flex component: system.blocksin.com/flex might help you to foresee different use cases.
@@sebikostudioThanks for the reply, looking forward to more grapesjs content
Hi its awesome tutorial i like to know about the binding csv with the grapes js content could show that or any repository or resource to get reference for that
Thank you. It's a custom solution I came up with. Unfortunately, I don't have any resources but I might make a video explaining the process.