Initial commit
This commit is contained in:
284
src/app/page.tsx
Normal file
284
src/app/page.tsx
Normal file
@@ -0,0 +1,284 @@
|
||||
"use client";
|
||||
|
||||
import { ThemeProvider } from "@/providers/themeProvider/ThemeProvider";
|
||||
import NavbarLayoutFloatingOverlay from '@/components/navbar/NavbarLayoutFloatingOverlay/NavbarLayoutFloatingOverlay';
|
||||
import HeroCarouselLogo from '@/components/sections/hero/heroCarouselLogo/HeroCarouselLogo';
|
||||
import FeatureCardNine from '@/components/sections/feature/FeatureCardNine';
|
||||
import ProductCardTwo from '@/components/sections/product/ProductCardTwo';
|
||||
import MetricCardOne from '@/components/sections/metrics/MetricCardOne';
|
||||
import TestimonialCardFifteen from '@/components/sections/testimonial/TestimonialCardFifteen';
|
||||
import FooterMedia from '@/components/sections/footer/FooterMedia';
|
||||
import { Users, TrendingUp, Award, Star } from "lucide-react";
|
||||
import Link from "next/link";
|
||||
|
||||
export default function HomePage() {
|
||||
return (
|
||||
<ThemeProvider
|
||||
defaultButtonVariant="slide-background"
|
||||
defaultTextAnimation="reveal-blur"
|
||||
borderRadius="pill"
|
||||
contentWidth="compact"
|
||||
sizing="mediumSizeLargeTitles"
|
||||
background="none"
|
||||
cardStyle="glass-depth"
|
||||
primaryButtonStyle="inset-glow"
|
||||
secondaryButtonStyle="layered"
|
||||
headingFontWeight="extrabold"
|
||||
>
|
||||
<div id="nav" data-section="nav">
|
||||
<NavbarLayoutFloatingOverlay
|
||||
brandName="TechAcademy"
|
||||
navItems={[
|
||||
{ name: "Home", id: "/" },
|
||||
{ name: "Courses", id: "/courses" },
|
||||
{ name: "About", id: "/about" },
|
||||
{ name: "Contact", id: "/contact" }
|
||||
]}
|
||||
button={{
|
||||
text: "Enroll Now",
|
||||
href: "/contact"
|
||||
}}
|
||||
/>
|
||||
</div>
|
||||
|
||||
<div id="hero" data-section="hero">
|
||||
<HeroCarouselLogo
|
||||
logoText="TECHACADEMY"
|
||||
description="Master in-demand technology skills with our comprehensive IT courses. Learn from industry experts and launch your tech career."
|
||||
buttons={[
|
||||
{ text: "Explore Courses", href: "/courses" },
|
||||
{ text: "Get Started", href: "/contact" }
|
||||
]}
|
||||
slides={[
|
||||
{
|
||||
imageSrc: "https://img.b2bpic.net/free-photo/programming-background-with-person-working-with-codes-computer_23-2150010130.jpg",
|
||||
imageAlt: "Programming and coding education"
|
||||
},
|
||||
{
|
||||
imageSrc: "https://img.b2bpic.net/free-photo/system-engineers-celebrating-successful-code-compiling-doing-high-five-hand-gesture-with-colleague-coder-analyzing-algorithm-multiple-screens-takes-off-glasses-congratulates-coworker_482257-41855.jpg",
|
||||
imageAlt: "Tech training and learning"
|
||||
},
|
||||
{
|
||||
imageSrc: "https://img.b2bpic.net/free-photo/person-working-html-computer_23-2150038840.jpg",
|
||||
imageAlt: "IT academy classroom"
|
||||
}
|
||||
]}
|
||||
autoplayDelay={5000}
|
||||
showDimOverlay={true}
|
||||
/>
|
||||
</div>
|
||||
|
||||
<div id="features" data-section="features">
|
||||
<FeatureCardNine
|
||||
features={[
|
||||
{
|
||||
id: 1,
|
||||
title: "Expert Instructors",
|
||||
description: "Learn from experienced professionals with 10+ years in the tech industry. Our instructors bring real-world insights and practical knowledge to every lesson.",
|
||||
phoneOne: {
|
||||
imageSrc: "https://img.b2bpic.net/free-photo/caucasian-software-developer-signaling-screen-data-breach-deactivated-security-system-tech-engineer-observing-multiple-system-security-breaches-caused-by-overloaded-storage-servers_482257-40529.jpg"
|
||||
},
|
||||
phoneTwo: {
|
||||
imageSrc: "https://img.b2bpic.net/free-photo/caucasian-software-developer-signaling-screen-data-breach-deactivated-security-system-tech-engineer-observing-multiple-system-security-breaches-caused-by-overloaded-storage-servers_482257-40529.jpg"
|
||||
}
|
||||
},
|
||||
{
|
||||
id: 2,
|
||||
title: "Flexible Learning",
|
||||
description: "Study at your own pace with self-paced courses, live sessions, and recorded content. Access materials anytime, anywhere on any device.",
|
||||
phoneOne: {
|
||||
imageSrc: "https://img.b2bpic.net/free-photo/informational-agency-multiracial-tech-engineers-programming-application-while-using-computer-cyber-security-company-developers-encrypting-cloud-processing-data-system-using-blockchain-technology_482257-40527.jpg"
|
||||
},
|
||||
phoneTwo: {
|
||||
imageSrc: "https://img.b2bpic.net/free-photo/informational-agency-multiracial-tech-engineers-programming-application-while-using-computer-cyber-security-company-developers-encrypting-cloud-processing-data-system-using-blockchain-technology_482257-40527.jpg"
|
||||
}
|
||||
},
|
||||
{
|
||||
id: 3,
|
||||
title: "Career Support",
|
||||
description: "Get job placement assistance, resume reviews, and interview coaching. Our alumni network opens doors to exciting career opportunities.",
|
||||
phoneOne: {
|
||||
imageSrc: "https://img.b2bpic.net/free-photo/software-programer-pointing-pencil-source-code-computer-screen-explaining-algorithm-coworker-standing-desk-programmers-discussing-online-cloud-computing-with-team_482257-33535.jpg"
|
||||
},
|
||||
phoneTwo: {
|
||||
imageSrc: "https://img.b2bpic.net/free-photo/software-programer-pointing-pencil-source-code-computer-screen-explaining-algorithm-coworker-standing-desk-programmers-discussing-online-cloud-computing-with-team_482257-33535.jpg"
|
||||
}
|
||||
}
|
||||
]}
|
||||
showStepNumbers={true}
|
||||
title="Why Choose TechAcademy"
|
||||
description="Industry-leading education platform designed for career growth"
|
||||
textboxLayout="default"
|
||||
useInvertedBackground="invertDefault"
|
||||
/>
|
||||
</div>
|
||||
|
||||
<div id="products" data-section="products">
|
||||
<ProductCardTwo
|
||||
products={[
|
||||
{
|
||||
id: "1",
|
||||
brand: "Beginner Track",
|
||||
name: "Web Development Fundamentals",
|
||||
price: "$299",
|
||||
rating: 5,
|
||||
reviewCount: "1.2k",
|
||||
imageSrc: "https://img.b2bpic.net/free-vector/realistic-responsive-website-design-collection_23-2149500090.jpg",
|
||||
imageAlt: "Web Development Course"
|
||||
},
|
||||
{
|
||||
id: "2",
|
||||
brand: "Intermediate Track",
|
||||
name: "Python Programming Mastery",
|
||||
price: "$399",
|
||||
rating: 5,
|
||||
reviewCount: "980",
|
||||
imageSrc: "https://img.b2bpic.net/free-vector/laptop-with-tablet-smartphone-website-information_24877-53528.jpg",
|
||||
imageAlt: "Python Programming Course"
|
||||
},
|
||||
{
|
||||
id: "3",
|
||||
brand: "Advanced Track",
|
||||
name: "Data Science & Machine Learning",
|
||||
price: "$599",
|
||||
rating: 5,
|
||||
reviewCount: "756",
|
||||
imageSrc: "https://img.b2bpic.net/free-photo/person-working-html-computer_23-2150038849.jpg",
|
||||
imageAlt: "Data Science Course"
|
||||
},
|
||||
{
|
||||
id: "4",
|
||||
brand: "Professional Track",
|
||||
name: "Cybersecurity Essentials",
|
||||
price: "$499",
|
||||
rating: 5,
|
||||
reviewCount: "543",
|
||||
imageSrc: "https://img.b2bpic.net/free-photo/programming-software-code-application-technology-concept_53876-123931.jpg",
|
||||
imageAlt: "Cybersecurity Course"
|
||||
}
|
||||
]}
|
||||
title="Featured Courses"
|
||||
description="Start your learning journey with our most popular programs"
|
||||
gridVariant="four-items-2x2-equal-grid"
|
||||
animationType="slide-up"
|
||||
textboxLayout="default"
|
||||
useInvertedBackground="noInvert"
|
||||
/>
|
||||
</div>
|
||||
|
||||
<div id="metrics" data-section="metrics">
|
||||
<MetricCardOne
|
||||
metrics={[
|
||||
{
|
||||
id: "1",
|
||||
value: "5000",
|
||||
title: "Students",
|
||||
description: "Successfully trained and certified professionals",
|
||||
icon: Users
|
||||
},
|
||||
{
|
||||
id: "2",
|
||||
value: "95",
|
||||
title: "%",
|
||||
description: "Job placement rate within 3 months",
|
||||
icon: TrendingUp
|
||||
},
|
||||
{
|
||||
id: "3",
|
||||
value: "20",
|
||||
title: "+",
|
||||
description: "Expert instructors on our team",
|
||||
icon: Award
|
||||
},
|
||||
{
|
||||
id: "4",
|
||||
value: "4.9",
|
||||
title: "/5",
|
||||
description: "Average student satisfaction rating",
|
||||
icon: Star
|
||||
}
|
||||
]}
|
||||
title="Our Impact"
|
||||
description="Trusted by thousands of students worldwide"
|
||||
gridVariant="uniform-all-items-equal"
|
||||
animationType="slide-up"
|
||||
textboxLayout="default"
|
||||
useInvertedBackground="invertDefault"
|
||||
/>
|
||||
</div>
|
||||
|
||||
<div id="testimonials" data-section="testimonials">
|
||||
<TestimonialCardFifteen
|
||||
testimonial="TechAcademy transformed my career. The courses are comprehensive, instructors are phenomenal, and the job placement support really works. I landed my dream job within 2 months of completion!"
|
||||
rating={5}
|
||||
author="Sarah Johnson, Senior Developer"
|
||||
avatars={[
|
||||
{
|
||||
src: "https://img.b2bpic.net/free-photo/close-up-portrait-young-handsome-successful-man_1163-5475.jpg",
|
||||
alt: "Student testimonial 1"
|
||||
},
|
||||
{
|
||||
src: "https://img.b2bpic.net/free-photo/happy-businessman-smiling-camera_1163-4660.jpg",
|
||||
alt: "Student testimonial 2"
|
||||
},
|
||||
{
|
||||
src: "https://img.b2bpic.net/free-photo/smiling-homosexual-man-official-suit-looking-camera-close-up-shot-happy-gay-getting-dressed-wedding-ceremony-standing-hotel-room-with-his-partner-background-love-emotion-concept_74855-22675.jpg",
|
||||
alt: "Student testimonial 3"
|
||||
},
|
||||
{
|
||||
src: "https://img.b2bpic.net/free-photo/pensive-person-alone-corridor-serious_1262-1042.jpg",
|
||||
alt: "Student testimonial 4"
|
||||
},
|
||||
{
|
||||
src: "https://img.b2bpic.net/free-photo/happy-young-professional-posing-office_1262-21170.jpg",
|
||||
alt: "Student testimonial 5"
|
||||
},
|
||||
{
|
||||
src: "https://img.b2bpic.net/free-photo/portrait-smiley-business-man_23-2148514859.jpg",
|
||||
alt: "Student testimonial 6"
|
||||
}
|
||||
]}
|
||||
useInvertedBackground="noInvert"
|
||||
/>
|
||||
</div>
|
||||
|
||||
<div id="footer" data-section="footer">
|
||||
<FooterMedia
|
||||
imageSrc="https://img.b2bpic.net/free-photo/html-css-collage-concept-with-person_23-2150061986.jpg"
|
||||
imageAlt="Graduation and success celebration"
|
||||
logoText="TechAcademy"
|
||||
copyrightText="© 2025 TechAcademy. All rights reserved."
|
||||
columns={[
|
||||
{
|
||||
title: "Courses",
|
||||
items: [
|
||||
{ label: "Web Development", href: "/courses" },
|
||||
{ label: "Python Programming", href: "/courses" },
|
||||
{ label: "Data Science", href: "/courses" },
|
||||
{ label: "Cybersecurity", href: "/courses" }
|
||||
]
|
||||
},
|
||||
{
|
||||
title: "Company",
|
||||
items: [
|
||||
{ label: "About Us", href: "/about" },
|
||||
{ label: "Our Team", href: "/about" },
|
||||
{ label: "Careers", href: "#" },
|
||||
{ label: "Blog", href: "#" }
|
||||
]
|
||||
},
|
||||
{
|
||||
title: "Support",
|
||||
items: [
|
||||
{ label: "Contact Us", href: "/contact" },
|
||||
{ label: "FAQ", href: "#faq" },
|
||||
{ label: "Privacy Policy", href: "#" },
|
||||
{ label: "Terms of Service", href: "#" }
|
||||
]
|
||||
}
|
||||
]}
|
||||
/>
|
||||
</div>
|
||||
</ThemeProvider>
|
||||
);
|
||||
}
|
||||
Reference in New Issue
Block a user