In this post, we’ll continue our journey in displaying the content of a zipped dotnet project in a Blazor WebAssembly application and then learn how to modify its content using a rich text editor.
Now that we have loaded our zipped project file, we need a way to store the content of the zip file in the application state so that we can navigate and view the different
To achieve this, we’ll be using a “unidirectional data flow” architecture based on the Flux/Redux architecture. We’ll be going over how this presentation design pattern works at a high level as it’s not the objective of this post. We’ll explore this topic in a future article.
Here is the architecture diagram for the Flux/Redux architecture.
Here is the final Flux/Redux architecture diagram for our application.
#blazor #blazor in c# #blazor tutorial #blazor webassembly #blazor crud #blazor with asp.net core
#blazor #blazor tutorial #blazor in c# #blazor crud #blazor webassembly #blazor with asp.net core
The Blazor Rich Text Editor is a feature-rich WYSIWYG HTML editor and WYSIWYG Markdown editor. The Rich Text Editor is used to create blogs, forum posts, notes sections, support tickets (incidents), comment sections, messaging applications, and more. The control provides an efficient user interface for a better editing experience with mobile support. It has a variety of tools to edit and format rich content and returns valid HTML markup or Markdown (MD) content. It allows users to insert images, links, tables, and lists with modular architectures.
#wysiwyg #editor #blazor rich text editor #web-development
#blazor #blazor tutorial #blazor curd #blazor in c# #blazor webassembly
The Syncfusion React Rich Text Editor component is a WYSIWYG editor component that can be used to frame a UI form control. It works seamlessly with React Redux Form and can validate inputs in form fields.
This blog explains the procedure to merge our Rich Text Editor component with Redux Form fields to validate inputs. The following topics are covered in this blog:
Refer to the redux-form documentation page to get more information.
Now, let’s see how to create a React app with Redux and integrate our React Rich Text Editor within it.
To create a React application, follow these steps:
Step 1: Use the create-react-app command to install the NuGet package globally that we will use to create a basic React application.
npm i create-react-app -g
You can create the app in any directory by using the create-react-app command.
Step 2: Move to the directory where you want to create the application and run the following command. Here, I am naming this app RichTextEditor-Redux-Form.
Thus, we have created the application.