How to render HTML tags from API response in React Js - Headless WordPress with React Js | Ep 7
#reactjs #innerhtml #wordpress #api In this video, we will learn how to use .env file in our react js project. If you are using some external APIs for data you must use the .env file to store your sensitive credentials like API keys. Environment variables can also help us to store our API link in one location so that we don’t have to change the link in each file manually. dangerouslySetInnerHTML is a property that you can use on HTML elements in a React application to programmatically set their content. Instead of using a selector to grab the HTML element, then setting its innerHTML, you can use this property directly on the element. When dangerouslySetInnerHTML is used, React also knows that the content of that specific element is dynamic, and, for the children of that node, it simply skips the comparison against the virtual DOM to gain some extra performance. ## Resources Demmy Data: https://www.wpkube.com/add-dummy-content-wordpress-website/ React dangerouslySetInnerHTML: https://reactjs.org/docs/dom-elements.html#dangerouslysetinnerhtml WordPress Plugin Development: https://youtube.com/playlist?list=PLa9NMvQUMD5c85kY0q6X15RTM8zm0s9H7 JavaScript (ES6) tutorials Playlist:- https://youtube.com/playlist?list=PLa9NMvQUMD5dUBOwBnyF85a1w1ITXDMXG == Social Media == Facebook:- https://www.facebook.com/itswebspace/ LinkedIn:- https://www.linkedin.com/in/tanujpatra/ Video Timestamp:- 00:00 - What we are doing in this Video 04:20 - Create .env file 05:55 - Using .env variables in React Js 07:55 - Get post excerpt from WordPress API 09:05 - Render HTML tags in JSX 10:35 - using dangerouslySetInnerHTML property in JSX React Js to render HTML tags 12:43 - Remove wrapping p tags in WordPress REST API response 13:21 - Create a custom plugin in WordPress 15:05 - Use remove filter hook to remove p tags from API response
Download
0 formatsNo download links available.