chore:delete white spaces to show 2 space and add ;

src/App.js

@@ -27,7 +27,7 @@ class App extends Component {
         </Router>
       </Fragment>
     );
-  }
-}
+  };
+};
 
 export default App;

src/about/components/Education/Education.js

@@ -1,6 +1,6 @@
 import React from 'react';
-import EducationList from './EducationList'
-import styles from '../../../shared/styles/Title.module.scss'
+import EducationList from './EducationList';
+import styles from '../../../shared/styles/Title.module.scss';
 
 const Education = () => {
     return(

src/about/components/Education/EducationList.js

@@ -1,8 +1,8 @@
 import React from "react";
-import styles from "./.module.css";
+import styles from "./Education.module.css";
 import { Chrono } from "react-chrono";
 import data from "./EducationData";
-import useWindowSize from "../../../shared/hooks/windowSize"
+import useWindowSize from "../../../shared/hooks/windowSize";
 
 const EducationList = () => {
   const size = useWindowSize();

src/about/components/MyInfo/Hobbies/Hobbies.js

@@ -1,6 +1,6 @@
 import React from 'react';
-import HobbyList from './HobbyList'
-import styles from './Hobbies.module.css'
+import HobbyList from './HobbyList';
+import styles from './Hobbies.module.css';
 
 const Hobbies = () => {
 	const HOBBIES = [

src/about/components/MyInfo/Hobbies/HobbyCard.js

@@ -1,5 +1,5 @@
 import React from 'react';
-import styles from './HobbyCard.module.scss'
+import styles from './HobbyCard.module.scss';
 
 const HobbyCard = props => {
     return (

src/about/components/MyInfo/Hobbies/HobbyList.js

@@ -1,6 +1,6 @@
 import React from 'react';
-import styles from './HobbyList.module.scss'
-import HobbyCard from './HobbyCard'
+import styles from './HobbyList.module.scss';
+import HobbyCard from './HobbyCard';
 
 const HobbyList = props => {
 	return(
@@ -15,7 +15,7 @@ const HobbyList = props => {
 				/>
 			))}
 		</div>
-	)
+	);
 };
 
 export default HobbyList;

src/about/components/MyInfo/MyInfo.js

@@ -5,16 +5,15 @@ import Hobbies from './Hobbies/Hobbies'
 import style from '../../../shared/styles/Title.module.scss'
 
 const MyInfo = () => {
-    return(
-        <div>
-            <div className={style["title-container"]}>
-                <h1 className={style.title}>About Me</h1>
-            </div>
-            <MyInfoCard />
-            <Hobbies />
-        </div>
-
-        )
+  return(
+    <div>
+      <div className={style["title-container"]}>
+        <h1 className={style.title}>About Me</h1>
+      </div>
+      <MyInfoCard />
+      <Hobbies />
+    </div>
+  );
 };
 
 export default MyInfo;

src/about/components/MyInfo/MyInfoCard.js

@@ -1,23 +1,23 @@
 import React from 'react';
-import styles from './MyInfoCard.module.scss'
+import styles from './MyInfoCard.module.scss';
 
 const aboutInfo = "My name is Lee Ren Jie. I am aspiring to be a Web/Block Chain Developer! "+
                 "I am a computer science student studying at Asia Pacific University. I am also a passionate and curious person. "+
                 "I write articles on Hashnode and do self-learning to keep myself updated with the cutting-edge technologies. " +
-                "I love sports, music, and sushi 🍣! "
+                "I love sports, music, and sushi 🍣! ";
 
 const MyInfoCard = () => {
-    return(
-        <div>
-            <div className={styles["styled-div"]}></div>
-            <div className={styles["about-container"]}>
-                <div className={styles["avatar-container"]}>
-                    <img className={styles.avatar} src={process.env.PUBLIC_URL + "/images/Splash.jpg"} alt="Avatar"/>
-                </div>
-                    <p className={styles["about-info"]}>{aboutInfo}</p>
-            </div>
+  return(
+    <div>
+      <div className={styles["styled-div"]}></div>
+      <div className={styles["about-container"]}>
+        <div className={styles["avatar-container"]}>
+          <img className={styles.avatar} src={process.env.PUBLIC_URL + "/images/Splash.jpg"} alt="Avatar"/>
         </div>
-        )
+          <p className={styles["about-info"]}>{aboutInfo}</p>
+      </div>
+    </div>
+  );
 };
 
 export default MyInfoCard;

src/about/components/Skills/Skills.js

@@ -1,19 +1,19 @@
 import React from 'react';
 // import styles from './Skills.module.scss'
-import style from '../../../shared/styles/Title.module.scss'
-import SkillsGrid from './SkillsGrid'
+import style from '../../../shared/styles/Title.module.scss';
+import SkillsGrid from './SkillsGrid';
 
 const Skills = () => {
-    return(
-            <div>
-                <div className={style['title-container']}>
-                    <h1 className={style.title}>
-                        My Skillsets
-                    </h1>
-                </div>
-                <SkillsGrid/>
-            </div>
-        )
+  return(
+    <div>
+      <div className={style['title-container']}>
+        <h1 className={style.title}>
+          My Skillsets
+        </h1>
+      </div>
+      <SkillsGrid/>
+    </div>
+  )
 };
 
 export default Skills;

src/about/components/Skills/SkillsData.js

@@ -1,29 +1,26 @@
 import React from 'react';
-import SkillsGrid from './SkillsGrid'
+import SkillsGrid from './SkillsGrid';
 // Add tags: https://dev.to/prvnbist/create-a-tags-input-component-in-reactjs-ki
 // Filter tags: https://codepen.io/nregard/pen/KGbvoG
 
 const SkillsData = () => {
   const SKILLS = [
     {
       id: 'Ruby on Rails',
-
     },
     {
       id: 'Python',
-
     },
     {
       id: 'React',
-
     },
   ];
 
-  return(
+  return (
     <div>
       <SkillsGrid skills={SKILLS}/>
     </div>
-  )
+  );
 };
 
 export default SkillsData;

src/about/components/Skills/SkillsGrid.js

@@ -1,5 +1,5 @@
 import React from 'react';
-import styles from './SkillsGrid.module.scss'
+import styles from './SkillsGrid.module.scss';
 import { CSSGrid, measureItems, makeResponsive, layout } from 'react-stonecutter';
 
 const Grid = makeResponsive(measureItems(CSSGrid), {
@@ -8,24 +8,24 @@ const Grid = makeResponsive(measureItems(CSSGrid), {
 });
 
 const SkillsGrid = () => {
-  return(
-      <div>
-        <CSSGrid
-          component="ul"
-          columns={5}
-          columnWidth={150}
-          gutterWidth={5}
-          gutterHeight={5}
-          layout={layout.pinterest}
-          duration={800}
-          easing="cubicOut"
-          >
-          <li key="A" itemHeight={150}>A</li>
-          <li key="B" itemHeight={120}>B</li>
-          <li key="C" itemHeight={170}>C</li>
-        </CSSGrid>
-      </div>
-      )
+  return (
+    <div>
+      <CSSGrid
+        component="ul"
+        columns={5}
+        columnWidth={150}
+        gutterWidth={5}
+        gutterHeight={5}
+        layout={layout.pinterest}
+        duration={800}
+        easing="cubicOut"
+        >
+        <li key="A" itemHeight={150}>A</li>
+        <li key="B" itemHeight={120}>B</li>
+        <li key="C" itemHeight={170}>C</li>
+      </CSSGrid>
+    </div>
+  );
 };
 
 export default SkillsGrid;

src/about/pages/About.js

@@ -1,18 +1,18 @@
 import React from 'react';
-import Education from '../components/Education/Education'
-import MyInfo from '../components/MyInfo/MyInfo'
-import Skills from  '../components/Skills/Skills'
+import Education from '../components/Education/Education';
+import MyInfo from '../components/MyInfo/MyInfo';
+import Skills from  '../components/Skills/Skills';
 // import Footer from "../../shared/components/Footer/Footer"
 
 const About = () => {
-    return(
-        <div style={{ backgroundColor: "#232323" }}>
-            <MyInfo/>
-            <Skills/>
-            <Education/>
-            {/* <Footer/> */}
-        </div>
-        )
+  return(
+    <div style={{ backgroundColor: "#232323" }}>
+      <MyInfo/>
+      <Skills/>
+      <Education/>
+      {/* <Footer/> */}
+    </div>
+  );
 };
 
 export default About;

src/blog/component/BlogPosts.js

@@ -26,7 +26,7 @@ class BlogPosts extends React.Component {
 
   componentDidMount() {
     this.fetchPosts();
-  }
+  };
 
   fetchPosts = async () => {
     const response = await fetch('https://api.hashnode.com', {
@@ -35,7 +35,7 @@ class BlogPosts extends React.Component {
           'Content-type': 'application/json',
       },
       body: JSON.stringify({ query }),
-    })
+    });
     const ApiResponse = await response.json();
 
     // console.log(ApiResponse.data.user.publication.posts);
@@ -54,7 +54,7 @@ class BlogPosts extends React.Component {
         ))}
       </div>
     );
-  }
-}
+  };
+};
 
 export default BlogPosts;

src/blog/component/Post.js

@@ -1,14 +1,14 @@
 import React from 'react';
-import './Post.scss'
+import './Post.scss';
 
 const Post = ({ post }) => {
-    return (
-      <div className="post-card">
-        <img className="post-image" src={post.coverImage} alt={post.title} />
-        <h3 className="post-title">{post.title}</h3>
-        <p className="post-brief">{post.brief}</p>
-      </div>
-    )
-}
+  return (
+    <div className="post-card">
+      <img className="post-image" src={post.coverImage} alt={post.title} />
+      <h3 className="post-title">{post.title}</h3>
+      <p className="post-brief">{post.brief}</p>
+    </div>
+  );
+};
 
 export default Post;

src/blog/pages/Blog.js

@@ -1,19 +1,19 @@
 import React from 'react';
 import BlogPosts from '../component/BlogPosts.js';
-import styles from '../../shared/styles/Title.module.scss'
-import './Blog.scss'
+import styles from '../../shared/styles/Title.module.scss';
+import './Blog.scss';
 
 const Blog = () => {
 	return(
 		<div className="colored-container">
 			<div className={styles['title-container']}>
 				<h1 className={styles.title}>
-				Latest Blogs
+					Latest Blogs
 				</h1>
 			</div>
 			<BlogPosts />
 		</div>
-	)
-}
+	);
+};
 
 export default Blog;

src/experience/components/Experience/ExperienceList.js

@@ -2,7 +2,7 @@ import React from "react";
 import styles from "./Experience.module.css";
 import { Chrono } from "react-chrono";
 import history from "./ExperienceData";
-import useWindowSize from "../../../shared/hooks/windowSize"
+import useWindowSize from "../../../shared/hooks/windowSize";
 
 const ExperienceList = () => {
   const size = useWindowSize();

src/experience/pages/Experience.js

@@ -1,19 +1,19 @@
 import React from 'react';
 // import Footer from "../../shared/components/Footer/Footer"
-import styles from '../../shared/styles/Title.module.scss'
+import styles from '../../shared/styles/Title.module.scss';
 import ExperienceList from '../components/Experience/ExperienceList';
 
 const Experience = () => {
-    return(
-        <div className="black-bg">
-            <div className={styles['title-container']}>
-                <h1 className={styles.title}>
-                    Experiences
-                </h1>
-            </div>
-            <ExperienceList/>
-        </div>
-        )
+  return(
+    <div className="black-bg">
+      <div className={styles['title-container']}>
+        <h1 className={styles.title}>
+          Experiences
+        </h1>
+      </div>
+      <ExperienceList/>
+    </div>
+  );
 };
 
 export default Experience;