-
When I first accepted this feature, I did not realize that I would have to work with something completely new to me: Svelte, an open-source component-based front-end framework! This came as a shock to me as I opened the ChatInput component and realized that this was a file where there was TypeScript code, HTML elements, and styles all in the same file!
-
SaaSHub
SaaSHub - Software Alternatives and Reviews. SaaSHub helps you find the best software and product alternatives
-
For this release, I wanted to take things up a notch. For the first project, I wanted to choose a new big project to work with: react-chatbotify. This project had many issues related to testing, which seemed right because, at the time, our weekly assignment was to write test cases, use mocks, etc., in our own project. For the second project I chose to contribute to, I went back to HuggingFace's chat-ui. This time, I wanted to contribute something much larger than I was used to, ideally something that I hadn't done before.
-
However, after doing some extensive research, I realized that almost none of them were compatible with Svelte, and those that were did not offer what I was looking for. That is, until I found tiptap, which is a headless wrapper around another WYSIWYG editor called ProseMirror. However, ProseMirror is very low level, and tiptap is super Svelte friendly!
-
OptimizeIt
OptimizeIt is a tool that is meant to help you Optimize your code. You simply run this command-line application and give it a source code file name which it then optimizes for peak performance and readability.
For this release, I wanted to take things up a notch. For the first project, I wanted to choose a new big project to work with: react-chatbotify. This project had many issues related to testing, which seemed right because, at the time, our weekly assignment was to write test cases, use mocks, etc., in our own project. For the second project I chose to contribute to, I went back to HuggingFace's chat-ui. This time, I wanted to contribute something much larger than I was used to, ideally something that I hadn't done before.
-
For this release, I wanted to take things up a notch. For the first project, I wanted to choose a new big project to work with: react-chatbotify. This project had many issues related to testing, which seemed right because, at the time, our weekly assignment was to write test cases, use mocks, etc., in our own project. For the second project I chose to contribute to, I went back to HuggingFace's chat-ui. This time, I wanted to contribute something much larger than I was used to, ideally something that I hadn't done before.
-
Now that I knew what I knew, it was time to start. Before I even began to consider how to solve this, I knew how these large projects feel about dependencies, so I went to the package.json file to check and see if there were things that I could work with. And what do you know? highlight.js was already included! What I immediately thought of was perhaps using the marked parser in addition to highlight.js to create and use my code blocks. But after quite a lot of time attempting this, I realized that hand-rolling this solution would not only take a lot of time but would also require a lot of code.
-
markdown-it
Markdown parser, done right. 100% CommonMark support, extensions, syntax plugins & high speed
I then tried something different: markdown-it, which is another Markdown parser that offers some other features that I could find useful. I almost succeeded in creating this; however, I still needed a lot of code to listen in on key presses and conditions of when and when not to convert into markdown, etc.