I have a VueJS app, I want to make the <title> and <meta> tags to be populated in page source itself for better SEO. I could use Server Side Rendering but it was difficult, express.js keeps crashing and there’s JavaScript inconsistencies (ES Module imports didn’t work in node). More explanation at the very bottom. To solve this problem, I did something wild. I made a Go server, served the JS app.... [READ MORE]

If you’re developing a web page in Chrome and some changes you applied to code doesn’t take effect on the page, you will be angry. You will look and look into the code for errors. But it’s not the problem with your code. It’s the problem with the browser. The resources loaded on the page are cached. Hence the changes made to the code won’t be applied. So, you need some way to disable the cache.... [READ MORE]

If you are running an app on the web that requires Internet Connection all the time, sometimes the internet connection will fail on the client side and your app won’t properly work. The best example is the New Tab Chrome Apps that will display the URL icons grayscale when offline and will make the icons back to color when online. To check whether the client’s internet connection is online, we use jQuery.... [READ MORE]

As you know, Google Chrome‘s Browser History is not efficient. It’s history is not like any other browsers. I think they made the History page in a hurry. If we want to search for a page we visited before, we won’t get it by searching on History page. That’s the main problem. This problem was solved when a lot of users created an alternate History Page extension on Chrome Webstore. In this post I’m gonna tell the most used History Alternate Extension.... [READ MORE]

I recently noticed a Google Chrome Webstore app that can be used for making a request to a web site or local site. I loved the app from the beginning. You can send a request to any site with header data, form data etc… You can also attach a file to the form. Ain’t that Awesome. Every web developer must have this app. Install it from Chrome Webstore Features – Integrated with Google Drive – It’s own backend service to store and share data between coworkers – convenient HTTP headers and payload editor thanks CodeMirror – Make a HTTP request (via XmlHttpRequest level 2) – Debug socket (via web socket API).... [READ MORE]

Here is a simple plugin to check if the mouse is over an element in JQuery. Open your jQuery source file and search for window.jQuery = window.$ = jQuery; Paste the code shown below after the code you have just found. <span class="pln" style="border: 0px; margin: 0px; padding: 0px; vertical-align: baseline;"> $</span><span class="pun" style="border: 0px; margin: 0px; padding: 0px; vertical-align: baseline;">.</span><span class="pln" style="border: 0px; margin: 0px; padding: 0px; vertical-align: baseline;"... [READ MORE]

If you want to make images grayscale ie black & white you can use this tutorial. Note that this trick will only work on browsers that runs webkit which is used by browsers like Google Chrome, Safari, Midori etc. Other browsers using different engines do not support the gray scake option. Hence this trick does not support all browsers. DEMO Grayscaled Image Using CSS & Original Image Here’s the CSS code which will make all images grayscale.... [READ MORE]