Added Clients Feedback Section

src/App.jsx

@@ -1,33 +1,40 @@
-import React from 'react';
+import React from "react";
 import { BrowserRouter, Route, Switch } from "react-router-dom";
 
 import Navigation from "./components/Navigation";
 import Greetings from "./containers/Greetings";
 import Skills from "./containers/Skills";
-import Proficiency from './containers/Proficiency';
+import Proficiency from "./containers/Proficiency";
 import Education from "./containers/Education";
-import Experience from './containers/Experience';
-import Projects from './containers/Projects';
-import GithubProfile from './containers/GithubProfile'
+import Experience from "./containers/Experience";
+import Projects from "./containers/Projects";
+import GithubProfile from "./containers/GithubProfile";
+import Feedbacks from "./containers/Feedbacks";
+
 const App = () => {
-    return ( 
-        <BrowserRouter>
-            <Switch>
-                <Route path="/" exact render={props => (
-                    <>
-                        <Navigation />
-                        <Greetings/>
-                        <Skills />
-                        <Proficiency />
-                        <Education />
-                        <Experience />
-                        <Projects />
-                        <GithubProfile />
-                    </>
-                )}/>
-            </Switch>
-        </BrowserRouter>
-     );
-}
-
-export default App;
+	return (
+		<BrowserRouter>
+			<Switch>
+				<Route
+					path="/"
+					exact
+					render={(props) => (
+						<>
+							<Navigation />
+							<Greetings />
+							<Skills />
+							<Proficiency />
+							<Education />
+							<Experience />
+							<Feedbacks />
+							<Projects />
+							<GithubProfile />
+						</>
+					)}
+				/>
+			</Switch>
+		</BrowserRouter>
+	);
+};
+
+export default App;

src/components/FeedbackCard.jsx

@@ -0,0 +1,23 @@
+import React from "react";
+import { Card, CardBody, Badge } from "reactstrap";
+
+import { Fade } from "react-reveal";
+
+const FeedbackCard = ({ data }) => {
+	return (
+		<Fade right duration={1000} distance="40px">
+			<Card className="card-lift--hover shadow mt-4">
+				<CardBody>
+					<div className="d-flex px-3">
+						<div className="pl-4">
+							<h5 className="text-info">{data.name}</h5>
+							<p className="description mt-3">{data.feedback}</p>
+						</div>
+					</div>
+				</CardBody>
+			</Card>
+		</Fade>
+	);
+};
+
+export default FeedbackCard;

src/containers/Feedbacks.jsx

@@ -0,0 +1,37 @@
+import { feedbacks } from "portfolio";
+import React from "react";
+import { Col, Container, Fade, Row } from "reactstrap";
+import FeedbackCard from "../components/FeedbackCard";
+const Feedbacks = () => {
+	return (
+		<section className="section section-lg">
+			<Container>
+				<Fade bottom duration={1000} distance="40px">
+					<div className="d-flex p-4">
+						<div>
+							<div className="icon icon-lg icon-shape bg-gradient-white shadow rounded-circle text-info">
+								<i className="fa fa-star text-info" />
+							</div>
+						</div>
+						<div className="pl-4">
+							<h4 className="display-3 text-info">
+								Our Clients Feedback
+							</h4>
+						</div>
+					</div>
+					<Row className="row-grid align-items-center">
+						{feedbacks.map((data, i) => {
+							return (
+								<Col key={i} lg={6}>
+									<FeedbackCard data={data} />
+								</Col>
+							);
+						})}
+					</Row>
+				</Fade>
+			</Container>
+		</section>
+	);
+};
+
+export default Feedbacks;