This is something that's been on my mind to write up for a few weeks now. It is strongly in the "I'm sure everyone knows this" category, but I've always felt like the things everyone knows are precisely the kind of things that everyone doesn't know. This particular tip may be a bit too obvious, but here goes.
Imagine you're working on something involving forms. Let's say a basic Ajax-based search where you take user input and on a button click, you load in remote data to render on screen.
That isn't too difficult, but you may find yourself working a bit to get the layout just right, handle rendering the total number of results, and so forth.
While working on this, your flow may be like this:
- Figure out what you need to fix, change.
- Write some code.
- Reload the page.
- Type 'foo' and hit enter.
- Look at results and repeat.
You can automate that page reload thing if you want of course to make it a bit smoother, but you get the idea. Let's say that search field looks like so:
<input type="search" id="search" placeholder="Search!">
Ok, so here's my tip. You can save sometime by doing this:
<input type="search" id="search" placeholder="Search!"
value="foo"
>
So... right now some people are probably shaking their heads and wondering why I even bothered to blog this. But even today I'll find myself doing a "write/reload/type/hit button/test" cycle for a few minutes before I remember I can set a default to speed things up a bit. I'll normally include line breaks as I did above to remind myself to remove it later.
I know there's browser extensions that can also pre-fill forms, but this is quicker and simpler to set up.
So there ya go. I hope this helps.
Archived Comments
That is pretty handy. Another one I really like is being able to copy a request as cURL in the network panel and then pasting that into Postman. Charles HTTP web debugger is also awesome in that respect
This is a good tip - i have to remind myself from time to time that this is a huge speed boost.
Definitely a good tip to share - I am pretty sure I knew this, but only because I remember the last 2 or 3 times I was working on a form I thought about it 5 minutes before I was done editing the code (after like an hour spent in the code-> debug-> refresh-> repeat loop 🙄 )
Also, I think you have a typo here - after second code sample 1st sentence "skaing" should be "shaking" I think....
Yep - thank you. Pushed a fix just now (will be live in 5).
If today is "tell the Internet something everybody knows" day, then I would have to include "use let and const instead of var" which changes every assignment statement in JavaScript.
Also ngrok--it gives you a local web console interface as well, allowing you to inspect requests and a 'replay' button so you can run it, or a sequence of requests. Especially for webhook development, where generating the request might not be as simple as just a click on a page.