add react helmet meta tag

RohanPunjani · Dec 30, 2019 · a840719 · a840719
1 parent 52d701e
commit a840719
Show file tree

Hide file tree

Showing 5 changed files with 30 additions and 11 deletions.
diff --git a/.eslintrc.js b/.eslintrc.js
@@ -13,6 +13,7 @@ module.exports = {
     'react/jsx-filename-extension': 'off', // disable if necessary
     'react/static-property-placement': 'off', // disable if necessary
     'react/jsx-props-no-spreading': 'off', // disable if necessary
+    'react/require-default-props': 'off',
   },
   parser: 'babel-eslint',
 };
diff --git a/src/components/Image/AboutImg.js b/src/components/Image/AboutImg.js
@@ -30,14 +30,14 @@ const AboutImg = ({ filename, alt }) => (
       if (!image) return null;
 
       const imageFixed = image.node.childImageSharp.fixed;
-      return <Img className="img-fluid rounded shadow-lg" alt={alt} fixed={imageFixed} />;
+      return <Img alt={alt} fixed={imageFixed} />;
     }}
   />
 );
 
 AboutImg.propTypes = {
-  filename: PropTypes.string.isRequired,
-  alt: PropTypes.string.isRequired,
+  filename: PropTypes.string,
+  alt: PropTypes.string,
 };
 
 export default AboutImg;
diff --git a/src/components/Image/ProjectImg.js b/src/components/Image/ProjectImg.js
@@ -36,8 +36,8 @@ const ProjectImg = ({ filename, alt }) => (
 );
 
 ProjectImg.propTypes = {
-  filename: PropTypes.string.isRequired,
-  alt: PropTypes.string.isRequired,
+  filename: PropTypes.string,
+  alt: PropTypes.string,
 };
 
 export default ProjectImg;
diff --git a/src/mock/data.js b/src/mock/data.js
@@ -1,5 +1,12 @@
 import uuidv1 from 'uuid/v1';
 
+// HEAD DATA
+export const headData = {
+  title: 'Jacobo | Developer',
+  lang: 'en', // e.g: en, es, fr, jp
+  domain: 'https://cobidev.com/',
+};
+
 // HERO DATA
 export const heroData = {
   title: '',

diff --git a/src/pages/index.js b/src/pages/index.js
@@ -1,11 +1,22 @@
 import React from 'react';
+import { Helmet } from 'react-helmet';
 import App from '../components/App';
-import { PortfolioProvider } from '../context/context';
+import { headData } from '../mock/data';
 import 'bootstrap/dist/css/bootstrap.min.css';
 import '../style/main.scss';
 
-export default () => (
-  <PortfolioProvider>
-    <App />
-  </PortfolioProvider>
-);
+export default () => {
+  const { title, lang } = headData;
+
+  return (
+    <>
+      <Helmet>
+        <meta charSet="utf-8" />
+        <title>{title || 'Gatsby Simplefolio'}</title>
+        <html lang={lang || 'en'} />
+        {/* <link rel="canonical" href="http://mysite.com/example" /> */}
+      </Helmet>
+      <App />
+    </>
+  );
+};