Devlog 2

Today i think that i can add google search bar which the user can search and found the results. So i started to work on that, So i created a div section and placed that at the bottom of the page with centered. Inside that i added google icon and a input text-box. I added a tiny animation also whenever the user reloads the webpage again and again.

Its really complicated as much more that of i expected. My plan was very simple but at the implementation time it quite become complicated. So let me try my best to tell how solved the problem and complexity. I changed the main div section of search bar into form field to make more simple to call. I added event listener to this tag and if the user clicks enter or something that triggers submit action will follow the following instructions. First i stored the searched text into a variable with trim() to avoid unnecessary spaces. Then i added if-else condition to work properly, if this variable is not equal to empty do as follows create another variable named googleURL this variable contains the normal (default) google.com search’s link and as well as the variable that i had already stored earlier. Btw i passed that variable through URI encode component to change the normal text into url form.

Then at last i added that to direct the page into that result. After that i found that the searched result window is opened in the same tab thatfor the user have more risky to come back to the webpage. That i decided to open the search resulted in another new tab. That i researched myself and found that a pre-build function ‘window.open()’

Now it working perfectly fine!