Last night, I wrote a Tampermonkey script for a friend. The scenario was a form with many input fields, mostly for frequently filled strings. My friend mentioned it to me, and since I didn't have much to do, I spent a couple of hours after dinner writing it quickly.
The requirement was to have multiple preset templates that can be added with custom content later. These templates should be displayed at the top of the webpage, and when a button is clicked, the pre-set text should be filled into the form on the webpage.
The implementation was straightforward. I initially planned to use AJAX to call a JSON file and store the templates in the JSON, making it easy to add data later. However, during testing, I found that the target website blocked external files, so I abandoned this approach. Instead, I created an array, with each object representing a set of templates. Then, I implemented a scalable popup window and bound the interaction buttons to click events. Clicking the corresponding button would fill the form on the website with the selected template's text.
That's roughly the process. After finishing, I added some finishing touches and wrote some CSS code. Overall, it wasn't difficult, and I finished it in less than two hours.
However, I realized that writing Vue and using Element UI too often made me a bit rusty in basic JavaScript. For example, I encountered errors when manipulating and iterating through arrays, which shouldn't have happened upon careful inspection.
I deeply reflected on myself and realized that it's important to solidify fundamental knowledge. We shouldn't rely solely on frameworks, even if they make coding enjoyable.