365 lines
13 KiB
TypeScript
365 lines
13 KiB
TypeScript
import ContactSplitForm from '@/components/sections/contact/ContactSplitForm';
|
|
import FaqSplitMedia from '@/components/sections/faq/FaqSplitMedia';
|
|
import FeaturesTaggedCards from '@/components/sections/features/FeaturesTaggedCards';
|
|
import FooterBrandReveal from '@/components/sections/footer/FooterBrandReveal';
|
|
import HeroSplitTestimonial from '@/components/sections/hero/HeroSplitTestimonial';
|
|
import MetricsMinimalCards from '@/components/sections/metrics/MetricsMinimalCards';
|
|
import NavbarCentered from '@/components/ui/NavbarCentered';
|
|
import PricingHighlightedCards from '@/components/sections/pricing/PricingHighlightedCards';
|
|
import TeamListCards from '@/components/sections/team/TeamListCards';
|
|
import TestimonialAvatarCard from '@/components/sections/testimonial/TestimonialAvatarCard';
|
|
|
|
export default function App() {
|
|
return (
|
|
<>
|
|
<div id="nav" data-section="nav">
|
|
<NavbarCentered
|
|
logo="IT Academy"
|
|
navItems={[
|
|
{
|
|
name: "Courses",
|
|
href: "#courses",
|
|
},
|
|
{
|
|
name: "Admissions",
|
|
href: "#pricing",
|
|
},
|
|
{
|
|
name: "Instructors",
|
|
href: "#team",
|
|
},
|
|
{
|
|
name: "FAQ",
|
|
href: "#faq",
|
|
},
|
|
]}
|
|
ctaButton={{
|
|
text: "Apply Now",
|
|
href: "#contact",
|
|
}}
|
|
/>
|
|
</div>
|
|
|
|
<div id="hero" data-section="hero">
|
|
<HeroSplitTestimonial
|
|
tag="Launch Your Career"
|
|
title="Master the Future of Technology"
|
|
description="Professional IT training and certification programs designed by industry experts to accelerate your path to a high-growth career in technology."
|
|
primaryButton={{
|
|
text: "View Courses",
|
|
href: "#courses",
|
|
}}
|
|
secondaryButton={{
|
|
text: "Our Vision",
|
|
href: "#about",
|
|
}}
|
|
testimonials={[
|
|
{
|
|
name: "Alex Smith",
|
|
handle: "@alexs",
|
|
text: "This academy changed my career path completely. Highly recommended!",
|
|
rating: 5,
|
|
imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3AJb0zJP2EWyuYlH5wmRP5jjTA5/portrait-of-a-young-professional-smiling-1776760821512-67bffcf0.png",
|
|
},
|
|
{
|
|
name: "Elena Kim",
|
|
handle: "@elenak",
|
|
text: "The curriculum is so practical and up-to-date with current industry standards.",
|
|
rating: 5,
|
|
imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3AJb0zJP2EWyuYlH5wmRP5jjTA5/portrait-of-a-diverse-tech-enthusiast-st-1776760831860-0bbbb807.png",
|
|
},
|
|
{
|
|
name: "Mark Johnson",
|
|
handle: "@markj",
|
|
text: "Exceptional mentorship and community support throughout my journey.",
|
|
rating: 5,
|
|
imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3AJb0zJP2EWyuYlH5wmRP5jjTA5/portrait-of-a-focused-professional-sitti-1776760843918-c7e4c41a.png",
|
|
},
|
|
{
|
|
name: "Sarah Miller",
|
|
handle: "@smiller",
|
|
text: "A life-changing experience that helped me pivot to software engineering.",
|
|
rating: 5,
|
|
imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3AJb0zJP2EWyuYlH5wmRP5jjTA5/portrait-of-a-young-professional-smiling-1776760962282-d02884ee.png?_wi=1",
|
|
},
|
|
{
|
|
name: "David Chen",
|
|
handle: "@dchen",
|
|
text: "The instructors are truly world-class, providing deep insights every day.",
|
|
rating: 5,
|
|
imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3AJb0zJP2EWyuYlH5wmRP5jjTA5/portrait-of-a-female-developer-smiling-p-1776760855974-a3af771e.png?_wi=1",
|
|
},
|
|
]}
|
|
imageSrc="https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3AJb0zJP2EWyuYlH5wmRP5jjTA5/a-professional-tech-classroom-setting-wi-1776760781385-f977331e.png?_wi=1"
|
|
/>
|
|
</div>
|
|
|
|
<div id="courses" data-section="courses">
|
|
<FeaturesTaggedCards
|
|
tag="Our Curriculum"
|
|
title="Industry-Leading Programs"
|
|
description="Choose from a wide variety of specialized tracks designed to help you excel in modern digital landscapes."
|
|
items={[
|
|
{
|
|
tag: "Cloud",
|
|
title: "Advanced Cloud Engineering",
|
|
description: "Master AWS, Azure, and Google Cloud infrastructure patterns.",
|
|
imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3AJb0zJP2EWyuYlH5wmRP5jjTA5/cloud-computing-abstract-conceptual-desi-1776760794719-0c1b04a1.png",
|
|
},
|
|
{
|
|
tag: "Coding",
|
|
title: "Full-Stack Development",
|
|
description: "Become a proficient developer with JavaScript, React, and Node.js.",
|
|
imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3AJb0zJP2EWyuYlH5wmRP5jjTA5/web-development-interface-showing-html-c-1776760803549-0324f680.png",
|
|
},
|
|
{
|
|
tag: "Security",
|
|
title: "Cybersecurity Fundamentals",
|
|
description: "Learn defensive strategies and threat management techniques.",
|
|
imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3AJb0zJP2EWyuYlH5wmRP5jjTA5/cybersecurity-padlock-icon-with-data-shi-1776760812934-7c946239.png",
|
|
},
|
|
]}
|
|
/>
|
|
</div>
|
|
|
|
<div id="stats" data-section="stats">
|
|
<MetricsMinimalCards
|
|
tag="Our Impact"
|
|
title="Proven Career Success"
|
|
metrics={[
|
|
{
|
|
value: "1500+",
|
|
description: "Students Trained",
|
|
},
|
|
{
|
|
value: "94%",
|
|
description: "Placement Rate",
|
|
},
|
|
{
|
|
value: "450+",
|
|
description: "Industry Partners",
|
|
},
|
|
{
|
|
value: "24/7",
|
|
description: "Student Support",
|
|
},
|
|
]}
|
|
/>
|
|
</div>
|
|
|
|
<div id="pricing" data-section="pricing">
|
|
<PricingHighlightedCards
|
|
tag="Choose Your Path"
|
|
title="Transparent Enrollment Plans"
|
|
description="Flexible payment plans to match your personal budget and professional objectives."
|
|
plans={[
|
|
{
|
|
tag: "Bootcamp",
|
|
price: "$1,999",
|
|
description: "Intensive 3-month course.",
|
|
features: [
|
|
"Full curriculum access",
|
|
"Weekly live mentor",
|
|
"Career counseling",
|
|
],
|
|
primaryButton: {
|
|
text: "Apply Now",
|
|
href: "#contact",
|
|
},
|
|
},
|
|
{
|
|
tag: "Professional",
|
|
price: "$3,499",
|
|
description: "Comprehensive 6-month masterclass.",
|
|
features: [
|
|
"Everything in Bootcamp",
|
|
"Portfolio projects",
|
|
"Guaranteed interview",
|
|
"1-on-1 coaching",
|
|
],
|
|
highlight: "Best Value",
|
|
primaryButton: {
|
|
text: "Apply Now",
|
|
href: "#contact",
|
|
},
|
|
},
|
|
{
|
|
tag: "Enterprise",
|
|
price: "Custom",
|
|
description: "For large teams.",
|
|
features: [
|
|
"Dedicated account manager",
|
|
"Custom curriculum",
|
|
"API reporting",
|
|
"Volume discounts",
|
|
],
|
|
primaryButton: {
|
|
text: "Contact Us",
|
|
href: "#contact",
|
|
},
|
|
},
|
|
]}
|
|
/>
|
|
</div>
|
|
|
|
<div id="team" data-section="team">
|
|
<TeamListCards
|
|
tag="Expert Staff"
|
|
title="Meet Your Instructors"
|
|
description="Learn from seasoned professionals who have shaped the tech industry at top-tier companies."
|
|
groups={[
|
|
{
|
|
title: "Engineering Faculty",
|
|
members: [
|
|
{
|
|
name: "Alice Wong",
|
|
role: "Lead Cloud Architect",
|
|
detail: "15 years of expertise in large-scale infrastructure.",
|
|
imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3AJb0zJP2EWyuYlH5wmRP5jjTA5/portrait-of-a-female-developer-smiling-p-1776760855974-a3af771e.png?_wi=2",
|
|
},
|
|
{
|
|
name: "Bob Miller",
|
|
role: "Full-Stack Instructor",
|
|
detail: "Specialist in modern web architecture and UX design.",
|
|
imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3AJb0zJP2EWyuYlH5wmRP5jjTA5/portrait-of-a-young-man-smiling-casual-c-1776760930273-e4c334da.png",
|
|
},
|
|
{
|
|
name: "Charlie Diaz",
|
|
role: "Cybersecurity Lead",
|
|
detail: "Ex-CISO with passion for ethical hacking training.",
|
|
imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3AJb0zJP2EWyuYlH5wmRP5jjTA5/portrait-of-a-young-professional-smiling-1776760962282-d02884ee.png?_wi=2",
|
|
},
|
|
],
|
|
image: {
|
|
src: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3AJb0zJP2EWyuYlH5wmRP5jjTA5/a-professional-tech-classroom-setting-wi-1776760781385-f977331e.png?_wi=2",
|
|
alt: "Portrait of a female developer smiling, professional casual style, neutral background.",
|
|
},
|
|
},
|
|
]}
|
|
/>
|
|
</div>
|
|
|
|
<div id="testimonials" data-section="testimonials">
|
|
<TestimonialAvatarCard
|
|
tag="Success Stories"
|
|
title="Trusted by Thousands"
|
|
primaryButton={{
|
|
text: "Read Stories",
|
|
href: "#",
|
|
}}
|
|
avatars={[
|
|
{
|
|
name: "Sarah",
|
|
imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3AJb0zJP2EWyuYlH5wmRP5jjTA5/portrait-of-a-young-professional-smiling-1776760973771-18a5f87a.png",
|
|
},
|
|
{
|
|
name: "David",
|
|
imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3AJb0zJP2EWyuYlH5wmRP5jjTA5/portrait-of-a-diverse-tech-enthusiast-st-1776760985426-c9b5f42d.png",
|
|
},
|
|
{
|
|
name: "Emily",
|
|
imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3AJb0zJP2EWyuYlH5wmRP5jjTA5/portrait-of-a-focused-professional-sitti-1776760994690-331c5bf7.png",
|
|
},
|
|
{
|
|
name: "Frank",
|
|
imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3AJb0zJP2EWyuYlH5wmRP5jjTA5/portrait-of-a-female-developer-smiling-p-1776761004838-ff1f4982.png",
|
|
},
|
|
{
|
|
name: "Grace",
|
|
imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3AJb0zJP2EWyuYlH5wmRP5jjTA5/portrait-of-a-young-man-smiling-casual-c-1776761013922-01475c7e.png",
|
|
},
|
|
]}
|
|
/>
|
|
</div>
|
|
|
|
<div id="faq" data-section="faq">
|
|
<FaqSplitMedia
|
|
tag="Common Queries"
|
|
title="Frequently Asked Questions"
|
|
description="Everything you need to know about starting your IT career."
|
|
items={[
|
|
{
|
|
question: "What is the admission process?",
|
|
answer: "Simple: choose your course, pay the deposit, and start onboarding.",
|
|
},
|
|
{
|
|
question: "Are there certificates available?",
|
|
answer: "Yes, we provide industry-recognized certificates upon completion.",
|
|
},
|
|
{
|
|
question: "Can I switch courses?",
|
|
answer: "You can transfer within the first two weeks of enrollment.",
|
|
},
|
|
{
|
|
question: "Is remote study available?",
|
|
answer: "All courses are designed to be completed entirely remotely.",
|
|
},
|
|
]}
|
|
imageSrc="https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3AJb0zJP2EWyuYlH5wmRP5jjTA5/helpdesk-abstract-conceptual-customer-su-1776760940441-842d3da1.png"
|
|
/>
|
|
</div>
|
|
|
|
<div id="contact" data-section="contact">
|
|
<ContactSplitForm
|
|
tag="Apply Today"
|
|
title="Ready to Start?"
|
|
description="Submit your application or inquire about custom group pricing today."
|
|
inputs={[
|
|
{
|
|
name: "fullName",
|
|
type: "text",
|
|
placeholder: "Your Full Name",
|
|
required: true,
|
|
},
|
|
{
|
|
name: "email",
|
|
type: "email",
|
|
placeholder: "Email Address",
|
|
required: true,
|
|
},
|
|
]}
|
|
textarea={{
|
|
name: "message",
|
|
placeholder: "Tell us about your career goals...",
|
|
rows: 4,
|
|
}}
|
|
buttonText="Submit Application"
|
|
imageSrc="https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3AJb0zJP2EWyuYlH5wmRP5jjTA5/modern-office-meeting-room-with-light-ai-1776760953113-ca0cc297.png"
|
|
/>
|
|
</div>
|
|
|
|
<div id="footer" data-section="footer">
|
|
<FooterBrandReveal
|
|
brand="IT ACADEMY"
|
|
columns={[
|
|
{
|
|
items: [
|
|
{
|
|
label: "About",
|
|
href: "#about",
|
|
},
|
|
{
|
|
label: "Blog",
|
|
href: "#",
|
|
},
|
|
],
|
|
},
|
|
{
|
|
items: [
|
|
{
|
|
label: "Privacy",
|
|
href: "#",
|
|
},
|
|
{
|
|
label: "Terms",
|
|
href: "#",
|
|
},
|
|
],
|
|
},
|
|
]}
|
|
/>
|
|
</div>
|
|
</>
|
|
);
|
|
}
|