diff --git a/src/App.tsx b/src/App.tsx
index ef966b0..e745995 100644
--- a/src/App.tsx
+++ b/src/App.tsx
@@ -1,12 +1,12 @@
import { Routes, Route } from 'react-router-dom';
import HomePage from './pages/HomePage';
import PrivacyPage from './pages/PrivacyPage';
-import Testimonials from './components/sections/testimonials/Testimonials';
+import TestimonialsSlider from './components/sections/testimonials/TestimonialsSlider';
export default function App() {
return (
- >} />
+ >} />
} />
);
diff --git a/src/components/sections/testimonials/TestimonialsSlider.tsx b/src/components/sections/testimonials/TestimonialsSlider.tsx
new file mode 100644
index 0000000..5e2d245
--- /dev/null
+++ b/src/components/sections/testimonials/TestimonialsSlider.tsx
@@ -0,0 +1,92 @@
+import { useCallback } from 'react';
+import useEmblaCarousel from 'embla-carousel-react';
+import { Quote, ArrowUp, ArrowDown } from 'lucide-react';
+
+const testimonials = [
+ {
+ quote: "The curriculum is top-notch, and the instructors are industry experts. I felt supported every step of the way.",
+ name: "Jane Smith",
+ role: "Full-Stack Developer",
+ avatar: "https://i.pravatar.cc/150?u=a042581f4e29026704d"
+ },
+ {
+ quote: "I went from zero coding knowledge to building complex applications. This academy is the real deal.",
+ name: "Alex Johnson",
+ role: "Mobile App Developer",
+ avatar: "https://i.pravatar.cc/150?u=a042581f4e29026705d"
+ },
+ {
+ quote: "The hands-on projects were invaluable. I built a portfolio that impressed employers and landed me a great job.",
+ name: "Emily White",
+ role: "Frontend Engineer",
+ avatar: "https://i.pravatar.cc/150?u=a042581f4e29026706d"
+ },
+ {
+ quote: "A fantastic learning environment. The community is amazing, and I made lifelong connections.",
+ name: "Michael Brown",
+ role: "Backend Specialist",
+ avatar: "https://i.pravatar.cc/150?u=a042581f4e29026707d"
+ }
+];
+
+export default function TestimonialsSlider() {
+ const [emblaRef, emblaApi] = useEmblaCarousel({
+ loop: true,
+ axis: 'y',
+ });
+
+ const scrollPrev = useCallback(() => {
+ if (emblaApi) emblaApi.scrollPrev();
+ }, [emblaApi]);
+
+ const scrollNext = useCallback(() => {
+ if (emblaApi) emblaApi.scrollNext();
+ }, [emblaApi]);
+
+ return (
+
+
+
+ Testimonials
+
What Our Students Say
+
+ Hear from our graduates about their journey and success with our academy.
+
+
+
+
+
+
+ {testimonials.map((testimonial, index) => (
+
+
+
+
+ "{testimonial.quote}"
+
+
+
+
+
{testimonial.name}
+
{testimonial.role}
+
+
+
+
+ ))}
+
+
+
+
+
+
+
+
+
+
+ );
+}
\ No newline at end of file
diff --git a/src/data/testimonials.ts b/src/data/testimonials.ts
index 8500711..8e0191e 100644
--- a/src/data/testimonials.ts
+++ b/src/data/testimonials.ts
@@ -1,22 +1,32 @@
-export const testimonials = [
+export interface Testimonial {
+ name: string;
+ course: string;
+ quote: string;
+}
+
+export const testimonials: Testimonial[] = [
{
- name: "John Doe",
- quote: "This academy changed my life. The hands-on projects were incredibly valuable.",
- course: "Full-Stack Web Development"
+ name: "Alex Johnson",
+ course: "Full-Stack Development Graduate",
+ quote:
+ "This program completely changed my career trajectory. The hands-on projects and mentorship were invaluable.",
},
{
- name: "Jane Smith",
- quote: "The instructors are industry experts who are passionate about teaching. I landed a great job right after graduating.",
- course: "Data Science & Machine Learning"
+ name: "Maria Garcia",
+ course: "Data Science Alumna",
+ quote:
+ "I went from knowing nothing about data to landing a job as a data analyst. The curriculum is top-notch and industry-relevant.",
},
{
- name: "Samuel Green",
- quote: "I came in with zero coding experience and now I'm a confident software engineer. Highly recommended!",
- course: "Cybersecurity"
+ name: "Sam Lee",
+ course: "UX/UI Design Certificate",
+ quote:
+ "The instructors are passionate and the community is incredibly supportive. I built a portfolio I'm proud of.",
},
{
- name: "Emily White",
- quote: "The curriculum is up-to-date with the latest technologies. The career support team was also fantastic.",
- course: "Full-Stack Web Development"
- }
+ name: "Jessica Chen",
+ course: "Cybersecurity Bootcamp Finisher",
+ quote:
+ "The bootcamp was intense but so rewarding. I feel confident and prepared for the challenges of the cybersecurity field.",
+ },
];
\ No newline at end of file
diff --git a/src/styles/animations.css b/src/styles/animations.css
index c10b577..3f419c0 100644
--- a/src/styles/animations.css
+++ b/src/styles/animations.css
@@ -119,6 +119,17 @@
}
}
+@keyframes slide-in-up {
+ from {
+ transform: translateY(100%);
+ opacity: 0;
+ }
+ to {
+ transform: translateY(0);
+ opacity: 1;
+ }
+}
+
/* Animation classes */
.animate-pulsate {