Use onclick event instead of 'submit' in Javascript
· ☕ 2 min read
Use onclick rather than submit in HTML forms. A typical HTML form has a few fields and a button to submit the data to some back-end server. And, the typical way to do the form submission is through the submit method. 1 2 3 4 5 <form action="/helloMessage.php"> <input type="text" id="name" /><br /> <button type="submit"></button> </form> On clicking the button, the page will submit data to helloMessage.

Use await without async function in Javascript
· ☕ 1 min read
How can you use await without an async function? Don’t click or proceed further if you are not into practical jokes. Say, you try using await in a “normal” function or directly within a module.. 1 2 3 4 5 6 7 function getWeather(loc) { const weather = await fetchWeather(loc); return weather; } // SyntaxError: await is only valid in async function You receive a compilation error that await can be used only in async function.

Generate Fibonacci series using generators
· ☕ 2 min read
Generate Fibonacci series with generators and feel good about yourself. Previously you have seen how the totally practical example of generating Fibonacci series was breathing fire with memoization, and may have also come across using loops or recursion to solve the same problem. But, there is no fun in all that - this is real-life and we have to “generate” fun (yep, there we go again).

Function object and Function in an object
· ☕ 1 min read
Previously, we have talked about all things being an object in Javascript. But to what extent can we apply this to our beloved functions. You can see this almost everywhere with the below syntax - 1 2 3 4 5 6 const getSum = (x, y) => { return x + y; }; console.

Generators in Javascript
· ☕ 5 min read
What are generators and how can I use them? How do you write loops in Javascript - Simple for/while? Recursion? In other less exciting ways? How do you throttle and control function execution? Debounce function? Build your own? What if you could produce the right mix of reusable functions, looping and throttling in one go?

The NPM Problem in Javascript
· ☕ 3 min read
Is there really a problem with NPM use? Short answer: no. Long answer: it’s complicated. I am nothing but thankful for the tonnes of NPM packages. I would never have built web applications that could support thousands of users all by myself without all those hundreds of packages. There are thousands of developers (if not millions) who do much better than what I could.

Flatten recursive arrays
· ☕ 1 min read
Flatten recursive arrays using Array.flat(). We have seen how to flatten arrays before. Array.flat() is quite useful to flatten arrays in one statement and output a simpler array. But, what about situations where you do not know the depth of array hierarchy - 1 const nums = [[1, 2], [3, 4], [[5], [6]], [[[7]]]]; Fear not.

Filter Falsy Values in Array
· ☕ 2 min read
Remember to filter your arrays before doing array-wise operation. Filtering falsy values must be the first operation even if you do not have specific filtering requirements. Consider this array - 1 const nums = [1, 3, 5, undefined, 7, 9, null]; If you are in control of the data source, you can very well expect to filter only when necessary.

Date without brackets in Javascript
· ☕ 1 min read
Can you use the Date object without brackets? Yes, apparently - to a friend’s delight and my chagrin. I should know better than to rely on my somewhat shaky Javascript knowledge. This is the format for a sane Date code.. 1 2 3 const today = new Date(); console.log(today); // 2019-08-23T09:31:12.

Load external scripts asynchronously
· ☕ 2 min read
Load external scripts asynchronously in Javascript. We have seen about loading functions asynchronously in Javascript. But, what about the scripts that you load from other files, CDNs or other external sources You can do a simple async to load scripts without impacting the loading speed as perceived by the user.

Don't use arguments object in Arrow functions
· ☕ 1 min read
Arguments object throws an error when used with arrow functions. Consider this code - 1 2 3 4 5 6 function getSum() { return arguments[0] + arguments[1]; } console.log(getSum(1, 2)); // 3 The result is as expected. But, you cannot do the same using an arrow function.

Modern Desktop UI Using Javascript and Qt
· ☕ 2 min read
One of the interesting projects that I came across recently was NodeGUI. NodeGUI describes itself as an enabler to build cross-platform desktop applications using Javascript (and React) and Qt5. Using NodeGUI, you should be able to - Create desktop applications that run on Windows, Linux or MacOS Styling with CSS Support for desktop events that are listenable from Qt Lower CPU/memory footprint Of course, the comparison with Electron is evident.

String Concatenation and Plus Operator
· ☕ 1 min read
Concatenating strings is a fairly simple affair. 1 2 console.log("hello" + " world"); // hello world This works because Javascript figures out the types, thinks that adding strings is not an intelligent thing to do, and therefore, concatenates the two strings. However, it may lead to problems.