Web IDE for the Picat programming language based on .net Blazor and Monaco. It provides common moder code editor features like syntax highlighting, code completion with documentation preview (CTRL+Space), indentation helpers, occurences highlighting, search, etc. and compilation/execution of code via an associated compiler wrapper service.
This editor aims to aid in learning Picat syntax and editing Picat programs.
The editor is based on 2 components:
You have several options for how to host the IDE:
The editor comes with a tutorial example that showcases the major features:
% Welcome to the Picat editor based on Blazor and Monaco! % This editor aims to aid in learning Picat syntax and editing Picat programs. % Below you will get a step by step introduction to the available features. % The editor relies on a compiler service to do the actual compilation and code execution, % and to enable some of the features. Nevertheless, it is still possible to get a basic % editing experience without the service running. main => foo. % Syntax highlighting and basic operations: % The typical editing operations known from modern code editors are available, this includes: % copy-paste, undo, auto-intendation on Enter, selection highlighting, Alt+Shift+Click block editing, Ctrl+F search, etc. % You can try some of them by editing the below code: foo() => bar, bar, bar. % Code completion: % You can bring up the code completion options by pressing Ctrl+Space. % Documentation of most built-in functions is included, % and documentation for your own functions is taken from the comment preceding the declaration. % If the documentation is not displayed, you can open by clicking 'Read More' on the very right of a completion entry. % Try bringing up the completion for 'fo' to see it in action: foo2 => fo. % Built-ins hover documentation: % When it comes to built-in functions in existing code you can view their documentation either by: % - Ctrl+Space to bring their completion entry % - Mouse hover % You can try this below: bar => println(hello). % Go to declaration: % For your own functions, you can easily navigate to it's declaration by Ctrl+Click or the context menu. % Try going to 'foo' through the below code: car => foo. % Syntax error highlighting (requires compiler service): % Your code will get compiled in the background as you type, and also when you decide to run it. % Any syntax errors discovered will be market in red, and a hover tooltip to the code describing the error. % The compiler output will be shown in the output panel, and you can double click % the '*** SYNTAX ERROR ***' message to quickly navigate to the target code fragment. % Please try it out on the below code, and use it to help you fix it. dar => true :-) . % Code execution (requires compiler service): % You can run your program by supplying a goal, and clicking the Run button. % The output will be presented in the output panel. % Please note that the editor is not meant as a full-featured runner - you should always use you local Picat compiler for serious runs. % The editor runner limitations include: interactive user input is not supported, max execution time limited to 10s. % Give it a go by running the 'main' goal. % Unit tests (requires compiler service): % The editor provides a convention for defining unit tests: % they are argument-less predicates whose name starts with 'test_', and they can either succeed, fail, or throw. % Unit tests are a great way to gain confidence in the individual pieces of your program, and ensure that any refactorings % or additions of new features do not break the existing logic. % Tests are executed in a randomized order to prevent sequence-dependence, and their total execution time is limited to 15s. % Below you can find some example tests, press 'Run All' in the Tests panel to run them: test_foo => foo. test_true. test_fail => fail. test_dar() => dar. test_dar2() => this_do_not_exist(A, B, c, d). test_throw => X is 1/0. % Custom links: % If you want to share a code example link with someone, you can define a custom link to this editor % by inserting your code as UrlEncoded value of the 'code' parameter like in the below example: % https://localhost:5001?code=main+%3D%3E+bar.%0D%0Abar+%3D%3E+println(hello). % Reporting errors: % Please report any errors to the githu repository at: https://github.com/andrzejolszak/picat-blazor-monaco-ide % If possible, please include the contents of the JS console log after you have triggered the error (F12, or Developers tools in most browsers)
A live demo of the code editor is available on the below link. It runs completely client-side and will not upload your code to the internet. Please note that this demo does not include the Web API Compiler component, so some features like syntax error highlighting, compilation, code execution and test runners will not be available. However, you can easily turn the demo into a complete IDE experience if you simply start the Web API Compiler service component on your own machine.
Source Code: https://github.com/andrzejolszak/picat-blazor-monaco-ide/
It also builds on the foundations of .NET Core to provide a modern and high-performance web development experience. Additionally, Blazor is a natural solution for ASP.NET Web Forms developers looking to take advantage of client-side development and the open-source, cross-platform future of .NET.
This e-book pdf covers the following ASP.NET Web Forms features and practices:-
#articles #asp.net #blazor #blazor for asp.net web forms #blazor for asp.net web forms developers #blazor web forms #convert web forms to blazor
API stands for Application Programming Interface. API is some kind of interface which has a set of functions that allow programmers to access specific features or data of an application, operating system or other services using HTTP protocol.
#blazor #blazor web api #asp.net web api #blazor with core web api #blazor c#
#blazor #blazor tutorial #blazor curd #blazor in c# #blazor webassembly
#blazor #blazor tutorial #blazor crud #blazor in c# #blazor web api
#blazor #blazor tutorial #blazor in c# #blazor web api #blazor crud