Welcome to my blog !

react helmet tutorials with examples

March 2, 2021 ·  4 min read

React Helmet is an npm library provides react components to change and updates tags values inside head tag of an html in react pages. Head is an parent tag for title, meta,script,link, noscript and style tag, So you can change or set this tags values dynamically. This tutorial covers an basic react-helmet package, how to change document head values dynamically, How it is useful in SEO during server side rendering....

How to add script or inline tag to react component

March 1, 2021 ·  2 min read

Sometimes, We want to add the script tag to individual components. This post talks about adding script or inline scripts to individual components multiple approaches Functional components with useHook React class components with componentWillMount React-helmet npm package how to add script tag to react components This section describes adding script tag to class and functional components. React class components There is a call back method componentWillMount which will be called for every render of an react component....

How to change default port in React with create-react-app command?

February 28, 2021 ·  2 min read

React listens at 3000 default port if you create an application with create-react-app command. The project contains package.json which contains scripts for starting and running an application "scripts": { "start": "react-scripts start", "build": "react-scripts build", "test": "react-scripts test", "eject": "react-scripts eject" } Sometimes, We need to change the port to new number which is in between 0 to 2 power 16 -1 unassigned integer. This short post covers an how to change default port in react application...

How to add new property to window object in typescript

February 27, 2021 ·  2 min read

Window is inbuilt JavaScript global object, It provides properties like location and history and also methods like open. It is tricky one to add an property in window object in javascript and typescript This post talks about how do you add property or function in window global namescope in javascript or typescript How do you set new property to window object in javascript? Yes, We can add properties,methods in window global object as seen below...

Change default port in vuejs application

February 26, 2021 ·  2 min read

This blog post cover how to change default port in Vue project, created using vuecli tool. Vue application is created with vue-cli tool using vue create command. By default allication created with default package.json scripts as follows "scripts": { "serve": "vue-cli-service serve", "start": "vue-cli-service serve", "build": "vue-cli-service build", "lint": "vue-cli-service lint" } When you run npm run serve or npm run start it starts web server listens at 8080 port....

You'll get a notification every time a post gets published here.