In this post, I'll show you how to create a simple component to add a dynamic title behavior on your web app.
Here you have a repo with an applic...
For further actions, you may consider blocking this person and/or reporting abuse
For those using React Hooks, here is the
withTitle
function:I think you have mistakenly used
HelmetComponent
instead ofTitleComponent
.Great observation, fixed!
if you are struggling with integrating helmet title to your project , run this command npm i helmet
once installed
simply copy and paste into a new file called TitleComponent.js in the src folder
// TitleComponent.js
import React from 'react';
import Helmet from 'react-helmet';
const TitleComponent = ({ title }) => {
var defaultTitle = '⚛️ app';
return (
{title ? title : defaultTitle}
);
};
export { TitleComponent };
and in your app.js inside return(
//paste this !!
)
// lets assume that you have a contact page
import {TitleComponent } from './TitleComponent';
paste this into contact page inside a dev
tag
Its really confused me from the beginning, let me know if you need any help with this
Happy Codding :)
Thanks LuisPa for the post.
May I ask how
HelmetComponent
is implemented? I can't seem to find the source in the article 🙏Sure man! Here you have a repo with an aplicable example: GitHub Repo
✨🌠💫🌟⭐
I have is problem
TypeError: Cannot call a class as a function
my code
thepracticaldev.s3.amazonaws.com/i...
Hi! Please put here the code from the
withTitle()
method, please.You can see the example repo:
github.com/LuisPaGarcia/react-dyna...
Here my code
thepracticaldev.s3.amazonaws.com/i...
I did find problem
I only did change extends Component to extens React.Component at the TitleComponent
thanks
Great!
Amazing!!! It also helps to improves SEO!
Thank you for the post.
Could you do the same with the favicon?
Sure!